I have a set of Radio Buttons in a RadioGroup. I have created a StateList Drawable to indicate the state of each button. The buttons operate properly in that selecting any one will kick off the listeners, etc. However, the StateList Drawable isn't working. Here's the relevant stuff:
Layout XML with button:
<RadioButton
android:id="#+id/score4"
android:layout_width="48dp"
android:layout_height="48dp"
android:layout_marginBottom="5dp"
android:button="#drawable/score_button_selector" />
score_button_selector xml:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_checked="true"
android:drawable="#drawable/score_bg_2c_on" />
<item android:state_checked="false"
android:drawable="#drawable/score_bg_2c_off"/>
</selector>
score_bg_2c_off is a blue button:
and score_bg_2c_on is a green button:
The blue button appears properly, but when selected (pressed/clicked), the green one should appear instead. As I said, the operation of the button is fine, I get it's value properly, etc. - just not the drawable change. I tried state_selected instead of state_checked with no better results.
Any ideas why this isn't working as I'd like?
Thanks.
Here's some more data... I took out the android:button= and put the drawable on the android:background=.
<RadioButton
android:id="#+id/score4"
android:layout_width="48dp"
android:layout_height="48dp"
android:layout_marginBottom="5dp"
android:background="#drawable/score_button_selector" />
This way the default radio button shows up. This button shows when it is selected (blue inside the button), but the background never changes. I know it's seeing the score_button_selector drawable because it's showing the button with the blue background that is only defined in the drawable.
Try this
<RadioButton
android:id="#+id/score4"
android:layout_width="48dp"
android:layout_height="48dp"
android:layout_marginBottom="5dp"
android:button="#android:color/transparent"
android:background="#drawable/score_button_selector" />
Nothing a good project clean can't fix! I think that perhaps a majority of the time doing a clean as a last resort b-4 posting a question is a good protocol. It cleared this problem up after chasing ghosts for 3 days.
Related
I am trying to align android switchcompat on both side whether its checked or unchecked but without success.
<android.support.v7.widget.SwitchCompat
android:id="#+id/switch1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:checked="true"
android:clickable="true"
android:layout_gravity="center_vertical"/>
and here is the result
Any ideas how to get it done?
The Switches (the view bounds of switches to be specific) in your image are aligned as expected. However, it appears as though they are not aligned because the thumb actually goes a little out of the switch track (still within the view bounds). If you want the thumb and track to be aligned on both sides, you can create a custom Switch.
An example would be:
Create background.xml as follows:
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_checked="true"
android:drawable="#drawable/drawable1" />
<item android:state_checked="false" android:drawable="#drawable/drawable2"/>
</selector>
Set this as background for Switch:
<android.support.v7.widget.SwitchCompat
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/background"/>
You will get something like:
I know this aint perfect in terms of design, but you get the idea!
This shows that the view bounds are actually aligned in both checked and unchecked states.
You can customize it further by setting the track, thumb and so on...
On tweaking the background a little and setting the track you can get something like:
Cheers!
I need to make a rounded rectangular toggle_switch in android like the one given below:
Can anyone guide me the complete steps to do so.
I solved my problem as follow :
Added a toggle button to my xml layout file :
<ToggleButton
android:id="#+id/ToggleButton1"
android:layout_width="120dp"
android:layout_height="25dp"
android:layout_marginRight="30dp"
android:layout_weight="2"
android:background="#drawable/toogle_switch"
android:text="ToggleButton"
android:textOff=""
android:textOn="" />
Then defined a custom togglebutton Background "toogle_switch" in 'drawable' folder as below:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/switchon" android:state_checked="true"></item>
<item android:drawable="#drawable/switchoff" android:state_checked="false"></item>
</selector>
switchon & switchoff are the 2 images I have shown in question.
Hope it helps everyone.! :)
Here you go:
http://developer.android.com/guide/topics/ui/controls/togglebutton.html
Exact image shown is determined by so called 'selector' or 'state list', which is a piece of XML that maps button states to images.
http://developer.android.com/guide/topics/resources/drawable-resource.html#StateList
You need to:
prepare images for all possible states of the button (toggled, pressed, etc) and place them in drawable folders
write a state list (selector) that binds images with button states
connect this state list to button android:background property
I have this code and works for every version since API 14 but on Android 5.0 (Lollipop) isn't working correctly.
Below is the way how I want the buttons to appear.
click of button1
buttonArrivals.getBackground().setAlpha(180);
buttonDepartures.getBackground().setAlpha(255);
click of button2
buttonArrivals.getBackground().setAlpha(255);
buttonDepartures.getBackground().setAlpha(180);
On the Lollipop version, the buttons appear with the same Alpha but I never set the same alpha. I just use the code above.
UPDATE 24/11/2014
Here is the XML of the buttons (AutoResizeButton extends Button)
br.com.timo.gru.util.AutoResizeButton
android:id="#+id/buttonArrivals"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="2"
android:background="#00abbd"
android:drawableLeft="#drawable/icon_aviao_desemb"
android:drawablePadding="-5dp"
android:drawableStart="#drawable/icon_aviao_desemb"
android:gravity="center"
android:paddingEnd="0dp"
android:paddingLeft="2dp"
android:paddingRight="0dp"
android:text="#string/chegadas"
android:textColor="#android:color/white"
br.com.timo.gru.util.AutoResizeButton
android:id="#+id/buttonPartidas"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="2"
android:background="#00abbd"
android:drawableLeft="#drawable/icon_aviao_partida"
android:drawablePadding="-5dp"
android:drawableStart="#drawable/icon_aviao_partida"
android:ellipsize="end"
android:gravity="center"
android:text="#string/partidas"
android:textColor="#android:color/white"
Internally ColorState (used by ColorDrawable) is shared between these 2 buttons (optimization), so whenever you change alpha on one button's background - other button will get this change as well.
You can try to to mutate background drawable before changing its alpha:
buttonArrivals.getBackground().mutate().setAlpha(180);
buttonDepartures.getBackground().mutate().setAlpha(255);
You can also read good explanation from Romain Guy on why this is happening: http://curious-creature.org/2009/05/02/drawable-mutations
However, it looks like you try to implement something which is easily achievable with Android selectors. You can specify different color for each button state (in your case selected/not selected), so in your code you just need to update state:
buttonArrivals.setSelected(true);
buttonDepartures.setSelected(false);
And selector would look like:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:color="#ff00abbd"
android:state_selected="true" >
</item>
<item android:color="#b400abbd"
android:state_selected="false">
</item>
</selector>
I've got some imagebuttons (about 15) with different backgrounds and sources. I want to change the pressed state of all of them on the same way: adding a color overlay.
Is there a way without onTouchListern (all examples I tried didn't work correctly...) and without a separat active-image and selector.xml for each button, like:
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/button_one_active" android:state_pressed="true"/>
<item android:drawable="#drawable/button_one"/>
</selector>
ImageButton (current state):
<ImageButton
android:id="#+id/button_one"
android:layout_width="53dp"
android:layout_height="53dp"
android:background="#drawable/button_one_background"
android:contentDescription="#string/button_one_description"
android:onClick="onButtonClick"
android:scaleType="fitCenter"
android:layout_alignTop="#+id/button_two"
android:layout_toRightOf="#+id/button_two" />
Source is set in Java with setImageResource or setImageBitmap
In java code, for the onClicklisteners of the buttons add,
button.setBackgroundResource(R.drawable.button_pressed_image);
I have an Android application that uses a MapView with an ImageButton control (to move to the user's current location) I've added in the top right-hand corner. The problem I am having is that the ImageButton control's background is too transparent, but changing it with android:background="#BBFFFFFF" alters both the size of the background and removes the blue "flash" that you normally see when the button is pressed - two qualities I wish to retain.
I start with something like this:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<com.google.android.maps.MapView
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/mapview"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:clickable="true"
android:apiKey="my api key"
/>
<ImageButton android:id="#+id/googlemaps_select_location"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_alignParentRight="true"
android:layout_marginTop="13dp"
android:layout_marginRight="13dp"
android:src="#drawable/device_access_location_found"/>
</RelativeLayout>
Which achieves something that looks like this:
So then I add:
android:background="#BBFFFFFF"
And I get this:
Note that although this is basically the level of opacity I want, changing the background has affected the padding, and also doesn't display a blue "flash" when pressed (which obviously isn't illustrated in this question).
So my question is, how can I change just the background color/opacity in the non-pressed state, while retaining the other visual qualities of the button? I had a brief read about Android styles and themes, but can't even figure out where this button is getting its style/theme from and how I would go about just overriding the background color/opacity while retaining all of the other visual features.
Issue
When you are assigning a fixed color to the a view background, you are replacing the default background in the view by the fixed color you define.
In reality, the background of a button is not a simple fixed color. It's a state list of color or drawables, which means, depending on button status (focous, selected, pressed, etc.) a different background is used, resulting in the "flash" animation you see when button is pressed. If you replace this state list by a simple fixed color, not depending on buttons status, you get a fixed background (i.e. not changing when button is pressed).
Resolution
There is a xml parameter that can be used to change the image view's alfa (i.e. transparency) which is:
android:alpha="1"
where the value 1 above can be any float between 0 and 1, being 1 the maximum opacy.
However, I believe this is not solving your issue, because you want to change the alfa of background not the image alfa, if I correctly understood your issue. Anyway the default seems to be 1.
One possibility the should work for you is to define a selector to be used as background. The selector will choose the drawable based on his status.
Example
<?xml version="1.0" encoding="UTF-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true" android:drawable="#android:color/darker_gray" />
<item android:drawable="#android:color/white" />
</selector>
Save the xml file above in your drawable-xxxx folder with the name my_selector
In this example I'm using standard android colors, but you can define your own colors. You need to assigne a color for each different button status that you want to have a different color.
Then you need to define your ImageView backgroung to be the selector you defined above:
<ImageButton
android:id="#+id/googlemaps_select_location"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_marginRight="13dp"
android:layout_marginTop="13dp"
android:background="#drawable/my_selector"
android:src="#drawable/device_access_location_found" />
With the above changes, the bacground color used by the button will change when the button is pressed and you can have the "flash" effect.
I ended up using a style to inherit the look of Widget.ImageButton with just a few minor tweaks for my purposes:
My /res/values/styles.xml file now looks like:
<resources>
<style name="AppTheme" parent="android:Theme.Light" />
<style name="my_loc_btn_style" parent="#android:style/Widget.ImageButton">
<item name="android:layout_marginTop">8dp</item>
<item name="android:layout_marginRight">8dp</item>
</style>
</resources>
And my layout file has:
<ImageButton android:id="#+id/googlemaps_select_location"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_alignParentRight="true"
style="#style/my_loc_btn_style"
android:src="#drawable/device_access_location_found"/>
This seems to have inherited a background from Widget.ImageButton that seems to be just slightly transparent, which is what I was after anyway, so I don't set the transparency at all now.