Android Styling Radio Button

Android Koltin RadioButton allows user select one option from a set , RadioButton Generally used along with RadioGroup .

In the previous tutorial we have seen basic example of radioButton and Android Radio Button Orientation Layout Direction

RadioGroup group contains multiple RadioButton , when user click one radio button that will it marked as checked and rest others are unchecked

colorAccent


To Change Radio Button Mark Color everywhere in your entire application , then change the colorAccent color of BaseTheme in style.xml

 <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
    </style>


Particular Radio Button


 When you want to particular Radio Button then create  your own style and extend it to Widget.AppCompat.CompoundButton.RadioButton Add items to style .
  1. colorControlNormal controls the ‘normal’ state of components such as an unselected EditText, and unselected Checkboxes and RadioButtons
  2. colorControlActivated overrides colorAccent as the activated or checked state for Checkboxes and RadioButtons
  3. colorControlHighlight controls the ripple coloring .
<style name="CustomRadioTheme" parent="Widget.AppCompat.CompoundButton.RadioButton">
 <item name="android:colorControlNormal">#7a7a7a</item>
 <item name="android:colorControlActivated">#FF9800</item>
 <item name="android:colorControlHighlight">#FF9800</item>
</style>


<RadioGroup
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:theme="@style/CustomRadioTheme"
  android:id="@+id/radio_grp">

 <RadioButton;
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:text="option 1"
   android:textSize="16sp"/>

 <RadioButton
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:text="option 2"
   android:textSize="16sp"/>

 <RadioButton
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:text="option 2"
   android:textSize="16sp"/>

</RadioGroup>


No comments:

Post a comment