Hi I have UI Requirement like this-
There are the four buttons: Popular, A-z, NearBy, Category
Any one of them can be pressed at a time. Suppose if Popular button is pressed, then the rest of the buttons will seem like not pressed.
Now I want it to stay like this until I press one of the remaining three buttons. Once any one of the three is pressed that particular button should be highlighted and rest of the buttons should be normal.
For that you should use Radio Buttons and you need to have a selector to define different drawables for different states. Here is how you can have selector. name it as button_selector and put it to the drawable folder. And you need to have two different drawables for your buttons as normal and pressed states. Name it as button and button_selected.
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true" android:drawable="@drawable/button_selected"></item>
<item android:state_checked="true" android:drawable="@drawable/button_selected"></item>
<item android:drawable="@drawable/button"></item>
</selector>
As for the Radio Button ;
<RadioGroup
android:id="@+id/radio_group_card_selector"
android:layout_width="wrap_content"
android:layout_height="28dp"
android:layout_gravity="center_horizontal|center_vertical"
android:gravity="center_horizontal"
android:orientation="horizontal" >
<RadioButton
android:id="@+id/radio_group_highlights"
android:layout_width="69dp"
android:layout_height="28dp"
android:layout_gravity="left"
android:background="@drawable/button_selector"
android:button="@null"
android:gravity="center_vertical|center_horizontal"
android:text="@string/Highlights"
android:textColor="#21596c"
android:textSize="10sp"
android:textStyle="normal" >
</RadioButton>
<RadioButton
android:id="@+id/radio_group_products"
android:layout_width="69dp"
android:layout_height="28dp"
android:layout_gravity="left"
android:background="@drawable/button_selector"
android:button="@null"
android:gravity="center_vertical|center_horizontal"
android:text="@string/All"
android:textColor="#21596c"
android:textSize="10sp"
android:textStyle="normal" >
</RadioButton>
<RadioButton
android:id="@+id/radio_group_mycards"
android:layout_width="69dp"
android:layout_height="28dp"
android:background="@drawable/button_selector"
android:button="@null"
android:checked="true"
android:gravity="center_vertical|center_horizontal"
android:text="@string/My_Cards"
android:textColor="#21596c"
android:textSize="10sp"
android:textStyle="normal" >
</RadioButton>
</RadioGroup>
So in that way you don't need to deal with the code at RunTime.
EDIT : If you want to use only colors instead of drawables, then you can use the code below for better understanding how it works.
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true"> <!-- pressed -->
<shape>
<gradient
android:startColor="#058CF5"
android:centerColor="#0273ED"
android:centerY="0.75"
android:endColor="#015DE6"
android:angle="270" />
</shape>
</item>
<item android:state_checked="true"> <!-- focused -->
<shape>
<gradient
android:startColor="#058CF5"
android:centerColor="#0273ED"
android:centerY="0.75"
android:endColor="#015DE6"
android:angle="270" />
</shape>
</item>
<item> <!-- default -->
<shape>
<solid android:color="#E6E6E6" />
</shape>
</item>
private TextView[] viewsArray;
public void onCreate(Bundle bundle){
super.onCreate(bundle);
setContentView(R.layout.mylayout);
TextView[] array // all your buttons
for (TextView view : array) {
view.setOnClickListener(mListener);
}
viewsArray = array;
}
private OnClickListener mListener = new OnClickListener(){
public void onClick(View view){
resetViews();
view.setBackgroundResource(R.drawable.selected);
}
};
private void resetViews(){
for(TextView view : viewsArray){
view.setBackgroundResource(R.drawable.notselected);
}
}
