I am trying to give the selector to the RadioButton of android:button but not able to showing that button in the preview as well as the real device, My goal is to make the android:button would be the custom.
I have to RadioGroup with two RadioButton.
I have tried this solution also https://stackoverflow.com/a/12432722/6869491
But still not able to get the desired solution.
<RadioGroup
android:id="#+id/radio_group"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_margin="#dimen/padding_25"
android:orientation="horizontal"
app:layout_constraintBottom_toBottomOf="#id/sub_const"
app:layout_constraintEnd_toEndOf="#id/sub_const"
app:layout_constraintStart_toStartOf="#id/sub_const"
app:layout_constraintTop_toBottomOf="#id/pay_amt_et">
<RadioButton
style="#style/MyRadioButtonStyle"
android:id="#+id/manual_rb"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:checked="true"
android:text="#string/manual"
android:textColor="#color/textcolor"
android:textSize="#dimen/fontsize_16"
/>
<RadioButton
style="#style/MyRadioButtonStyle"
android:id="#+id/recurring_rb"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Recuring"
android:textColor="#color/textcolor"
android:textSize="#dimen/fontsize_16"
/>
</RadioGroup>
And here is the radio button selector, that is radio_btn_selector.
<item android:state_checked="true" android:state_window_focused="false"
android:drawable="#drawable/radio_btn_active" />
<item android:state_checked="false" android:state_window_focused="false"
android:drawable="#drawable/radio_btn_un_selected" />
<item android:state_checked="true" android:state_pressed="true"
android:drawable="#drawable/radio_btn_active" />
<item android:state_checked="false" android:state_pressed="true"
android:drawable="#drawable/radio_btn_un_selected" />
<item android:state_checked="true" android:state_focused="true"
android:drawable="#drawable/radio_btn_active" />
<item android:state_checked="false" android:state_focused="true"
android:drawable="#drawable/radio_btn_un_selected" />
<item android:state_checked="false" android:drawable="#drawable/radio_btn_un_selected" />
<item android:state_checked="true" android:drawable="#drawable/radio_btn_active" />
And here is the radio_btn_active.
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="oval">
<solid android:color="#color/colorWhite" />
<stroke
android:width="#dimen/padding_2"
android:color="#color/grey_darker" />
</shape>
</item>
<item
android:bottom="#dimen/padding_30"
android:end="#dimen/padding_30"
android:start="#dimen/padding_30"
android:top="#dimen/padding_30">
<shape android:shape="oval">
<solid android:color="#color/primary_edtext_light" />
</shape>
</item>
</layer-list>
And this is radio_btn_un_selected.
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval">
<solid android:color="#color/colorWhite" />
<stroke
android:width="#dimen/padding_2"
android:color="#color/grey_darker" />
</shape>
And Given the style as well.
<style name="MyRadioButtonStyle"
parent="#android:style/Widget.CompoundButton.RadioButton">
<item name="android:button">#drawable/radio_btn_selector</item>
</style>
Whats I am making wrong please guide me.
I think you missed to set RadioButton's android:background="#drawable/radio_btn_selector" property.
<RadioButton
android:id="#+id/manual_rb"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:checked="true"
android:text="#string/manual"
android:textColor="#color/textcolor"
android:textSize="#dimen/fontsize_16"
android:button="#android:color/transparent"
android:background="#drawable/radio_btn_selector"
/>
Related
I added switch, I wanted to change its color, so i added following in drawables.
Thumb.xml
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_enabled="false" android:drawable="#color/black" />
<item android:state_pressed="true" android:drawable="#color/tabAccessoryButtonSelected" />
<item android:state_checked="true" android:drawable="#color/tabAccessoryButtonSelected" />
</selector>
Track.xml
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_focused="true" android:drawable="#color/tabAccessoryButtonSelected" />
</selector>
Layout.xml
<Switch
android:layout_width="200dp"
android:layout_height="200dp"
android:id="#+id/switch1"
android:layout_centerHorizontal="true"
android:paddingTop="50dp"
android:text="#string/notification_settings"
android:textColor="#color/white"
android:thumb="#drawable/thumb"
android:track="#drawable/track"
/>
As soon as i added this, switch has stopped displaying in the layout, the text is still there, but the Switch tool is not there.
If i remove Thumb.xml and Track.xml it starts displaying switch.
Kindly guide me what i am doing wrong here.
Thanks
I have modify it now try my solution below.
Layout.xml
<Switch
android:layout_width="200dp"
android:layout_height="200dp"
android:id="#+id/switch1"
android:layout_centerHorizontal="true"
android:paddingTop="50dp"
android:text="#string/notification_settings"
android:textColor="#color/white"
android:thumb="#drawable/thumb"
android:track="#drawable/track"
/>
track.xml
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_focused="true" android:drawable="#drawable/color_thumb" />
<item android:drawable="#drawable/gray_track" />
</selector>
thumb.xml
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_enabled="false" android:drawable="#drawable/gray_track" />
<item android:state_pressed="true" android:drawable="#drawable/color_thumb" />
<item android:state_checked="true" android:drawable="#drawable/color_thumb" />
<item android:drawable="#drawable/gray_track" />
</selector>
color_thumb.xml
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
<size android:height="40dp" />
<gradient android:height="40dp" android:startColor="#color/tabAccessoryButtonSelected"" android:endColor="#color/tabAccessoryButtonSelected""/>
</shape>
gray_track.xml
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
<size android:height="40dp" />
<gradient android:height="40dp" android:startColor="#color/tabAccessoryButtonSelected" android:endColor="#color/tabAccessoryButtonSelected"/>
</shape>
I know this is an old question but I had the same problem today and the issue seemed to be that the thumb drawable needs a fixed size. The track size seems to adjust itself to the size of the thumb so a thumb with no indicated size won't display and because of this the track won't display either.
If you add an actual xml drawable as a thumb and not just a color you can add a size element to it:
switch_thumb.xml
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<solid android:color="#color/colorSwitchThumb" />
<corners android:radius="#dimen/switch_corner_radius"/>
<size android:height="10dp" android:width="10dp"/>
</shape>
My edit text now looks like this (like its background)
http://prntscr.com/843323
and this is the code
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<solid android:color="#android:color/transparent" />
</shape>
</item>
</selector>
How can I set underline to this edit text (for example white) when I click on it to write something.. http://prntscr.com/8434s7
Try this:
how to change focus color of EditText in Android
Or This:
<style name="Theme.MyTheme.EditText" parent="AppTheme">
<item name="colorControlNormal">#ff6600</item>
<item name="colorControlActivated">#ff6600</item>
</style>
<EditText
style="#style/TextAppearance.AppCompat.Display1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#+id/materialDesignEditText"
android:ems="10"
android:hint="Normal EditText"
android:padding="5dp"
android:singleLine="true"
android:textColor="#000000"
android:textColorHint="#android:color/secondary_text_dark"
android:textSize="15dp"
android:theme="#style/Theme.MyTheme.EditText" />
Create textfield_default
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<gradient
android:startColor="Color Hash Code"
android:endColor="#color/background_material_light"
android:angle="90" />
</shape>
create edit_text.xml in drawable
<item
android:state_window_focused="false"
android:state_enabled="false"
android:drawable="#drawable/textfield_disabled" />
<item
android:state_pressed="true"
android:drawable="#drawable/textfield_pressed" />
<item
android:state_enabled="true"
android:state_focused="true"
android:drawable="#drawable/textfield_selected" />
<item
android:state_enabled="true"
android:drawable="#drawable/textfield_default" />
<item
android:state_focused="true"
android:drawable="#drawable/textfield_disabled_selected" />
<item
android:drawable="#drawable/textfield_disabled" />
</selector>
<EditText
style="#drawable/edit_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#+id/materialDesignEditText"
android:ems="10"
android:hint="Text here"
android:padding="5dp"
android:singleLine="true"
android:textColor="#000000"
android:textColorHint="#android:color/secondary_text_dark"
android:textSize="15dp" />
I am creating custom edit text in android by adding xml in drawable res.it is as following
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<!-- Border -->
<item>
<shape>
<solid android:color="#color/gray"></solid>
</shape>
</item>
<!-- Body -->
<item
android:bottom="1dp"
android:right="0dp"
android:left="0dp"
android:top="0dp">
<shape>
<solid android:color="#color/white"></solid>
</shape>
</item>
</layer-list>
<EditText
android:id="#+id/edt_password"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:background="#drawable/edittext"
android:digits="1234567890"
android:ellipsize="end"
android:focusableInTouchMode="true"
android:inputType="numberPassword"
android:singleLine="true"
android:textColor="#color/dark" />
so i just want edittext as a single line.
But when i implement this, for few seconds the upper border of edittext is visible and then it goes away...
I am really not getting why this is happening...
Create res/drawable/custom_edittext_style.xml
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_window_focused="false" android:state_enabled="true" android:drawable="#drawable/apptheme_textfield_default_holo_light" />
<item android:state_window_focused="false" android:state_enabled="false" android:drawable="#drawable/apptheme_textfield_disabled_holo_light" />
<item android:state_enabled="true" android:state_focused="true" android:drawable="#drawable/apptheme_textfield_activated_holo_light" />
<item android:state_enabled="true" android:state_activated="true" android:drawable="#drawable/apptheme_textfield_focused_holo_light" />
<item android:state_enabled="true" android:drawable="#drawable/apptheme_textfield_default_holo_light" />
<item android:state_focused="true" android:drawable="#drawable/apptheme_textfield_disabled_focused_holo_light" />
<item android:drawable="#drawable/apptheme_textfield_disabled_holo_light" />
And add all require drawable file into drawable folder.
<EditText
android:id="#+id/edt_password"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:background="#drawable/custom_edittext_style"
android:digits="1234567890"
android:ellipsize="end"
android:focusableInTouchMode="true"
android:inputType="numberPassword"
android:singleLine="true"
android:textColor="#color/dark" />
Im trying to make custom Radio buttons. Found an article which looked great (Article) but when i try doing what is said here, it doesnt update at all. Would a base theme prevent me from making custom radio buttons? My code below:
Layout xml
<RadioGroup
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:id="#+id/radioGroup"
android:background="#drawable/country_select_radio_button">
<RadioButton
android:id="#+id/ke_radio"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/SouthAfrica"
android:layout_alignStart="#+id/SouthAfrica"
android:layout_alignTop="#+id/SouthAfrica"
android:layout_marginTop="35dp"
android:background="#drawable/country_select_radio_button"
android:text="Kenya"
android:layout_gravity="center_horizontal"
android:checked="false" />
<RadioButton
android:id="#+id/za_radio"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="#+id/btn_za"
android:layout_centerHorizontal="true"
android:layout_marginBottom="125dp"
android:text="South Africa"
android:checked="true"
android:layout_gravity="center_horizontal" />
</RadioGroup>
button style xml
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:drawable="#drawable/b"
android:state_checked="true"
android:state_pressed="true" />
<item
android:drawable="#drawable/a"
android:state_pressed="true" />
<item
android:drawable="#drawable/a"
android:state_checked="true" />
<item
android:drawable="#drawable/b" />
a.xml
<selector
xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" >
<corners
android:radius="5dp" />
<solid
android:color="#fff" />
<stroke
android:width="2dp"
android:color="#FF0000" />
b.xml
<selector
xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" >
<corners
android:radius="5dp" />
<solid
android:color="#FF0000" />
<stroke
android:width="2dp"
android:color="#555555" />
no matter what i change, the style of the button stays the default?
what am i doing wrong?
u need to set the android button property in your xml
<RadioButton
android:id="#+id/ke_radio"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:button="#drawable/radio_button_selector"
android:padding="#dimen/text_padding"
android:paddingLeft="10dp"
/>
wher radio_button selector is your custom xml file for radio button
please use below selector xml file
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/radiobutton1" android:state_checked="false"/>
<item android:drawable="#drawable/radiobutton2" android:state_checked="true"/>
<item android:drawable="#drawable/radiobutton1"/>
</selector>
put 2 images for testing as radiobutton1 and radiobutton2 and test
I am trying to implement a custom RadioButton, and the styling is working as I would expecting, however, the selection highlighting is not exclusive. Meaning, I can have two buttons within the same group highlighted at the same time.
Edit
This the state before I select the second button:
This a visual of the issue I'm getting - note I'd only like one selected:
Below is the code for the background selector of my RadioButton:
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
<item
android:state_checked="true"
android:state_pressed="false"
android:drawable="#drawable/toggle_button_selected"/>
<item
android:state_checked="false"
android:state_pressed="false"
android:drawable="#drawable/toggle_button_unselected"/>
<item
android:state_checked="true"
android:state_pressed="true"
android:drawable="#drawable/toggle_button_selected"/>
<item
android:state_checked="false"
android:state_pressed="true"
android:drawable="#drawable/toggle_button_unselected"/>
</selector>
Below is my implementation in the group:
<RadioGroup
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<RadioButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/toggle_button_selector"
android:button="#android:color/transparent"
android:checked="true"
android:padding="10dp"
android:text="Test" />
<RadioButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/toggle_button_selector"
android:button="#android:color/transparent"
android:padding="10dp"
android:text="Test1" />
</RadioGroup>
Any thoughts?
Edit
Drawables:
toggle_button_unselected.xml
<?xml version="1.0" encoding="utf-8" ?>
<shape
xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" >
<corners
android:radius="5dp" />
<solid
android:color="#color/dark_purple" />
<stroke
android:width="1dp"
android:color="#color/dark_purple" />
</shape>
toggle_button_selected.xml
<?xml version="1.0" encoding="utf-8" ?>
<shape
xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" >
<corners
android:radius="5dp" />
<solid
android:color="#color/purple" />
<stroke
android:width="1dp"
android:color="#color/dark_purple" />
</shape>
The only thing I can think of is that the RadioButtons should have different ids.