Specific radio buttons - the easiest way to set different styles for the first / last buttons

advertisements

I would like to achieve this specific type of radio buttons in my layout:

= different graphics for the first item, middle ones, and last one, which have different rounded corners. I can imagine doing this with different styles for the 3 types of buttons (using custom styles, stateful drawables).

I'm implementing this using custom toggle buttons. I would like to take advantage of drawable selector for using different drawables for the first and the last items, so I use:

<selector xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:state_checked="true" android:state_first="true"
        android:drawable="@drawable/radio_left_act"/> 

    <item android:state_checked="true" android:state_last="true"
        android:drawable="@drawable/radio_right_act"/> 

    <item android:state_checked="true"
        android:drawable="@drawable/radio_middle_act"/> 

    <item android:state_checked="false" android:state_first="true"
        android:drawable="@drawable/radio_left_inact"/> 

    <item android:state_checked="false" android:state_last="true"
        android:drawable="@drawable/radio_right_inact"/> 

    <item android:state_checked="false"
        android:drawable="@drawable/radio_middle_inact"/> 

</selector>

But now I have a problem, that states state_first, state_last are not set automatically in my LinearLayout, so I have to set them manually every time the buttons are clicked. Is there some way, some layout, where these states are set automatically? Thank you for any help.


Found nothing special, so here is a "default" solution, with custom toggle buttons. Here are 3 different styles (put to styles.xml) for first, middle ones and last buttons:

<!-- Toggle button styles -->

<style name="CustomToggle">
    <item name="android:paddingTop">9dp</item>
    <item name="android:paddingBottom">9dp</item>
    <item name="android:layout_height">wrap_content</item>
    <item name="android:layout_width">0dp</item>
    <item name="android:layout_weight">1</item>
</style>            

<style name="FirstToggle" parent="@style/CustomToggle">
    <item name="android:background">@drawable/radio_first</item>
</style>            

<style name="MiddleToggle" parent="@style/CustomToggle">
    <item name="android:background">@drawable/radio_middle</item>
</style>            

<style name="LastToggle" parent="@style/CustomToggle">
    <item name="android:background">@drawable/radio_last</item>
</style>

And a short code for activity handling the events of toggle buttons, so only 1 button is checked in the same time, and checked button is disabled:

public class AktivityActivity extends Activity
{
    ArrayList<ToggleButton> toggle_buttons;

    public void onCreate(Bundle savedInstanceState)
    {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.aktivity);

        initToggleButtons();
    }

    private void initToggleButtons()
    {
        toggle_buttons = new ArrayList<ToggleButton>();
        toggle_buttons.add((ToggleButton) findViewById(R.id.toggle_1));
        toggle_buttons.add((ToggleButton) findViewById(R.id.toggle_2));
        toggle_buttons.add((ToggleButton) findViewById(R.id.toggle_3));

        // Listen on all toggle buttons
        for (ToggleButton toggle_button : toggle_buttons)
            toggle_button.setOnCheckedChangeListener(check_listener);

        // Check first toggle button
        updateToggleButtons(toggle_buttons.get(0));
    }

    // Only one toggle can be checked, and checked button must be disabled
    private void updateToggleButtons(ToggleButton checked_button)
    {
        for (ToggleButton toggle_button : toggle_buttons)
        {
            toggle_button.setChecked(toggle_button == checked_button);
            toggle_button.setEnabled(toggle_button != checked_button);
        }
    }

    // Toggle buttons change listener
    OnCheckedChangeListener check_listener = new OnCheckedChangeListener()
    {
        public void onCheckedChanged(CompoundButton buttonView, boolean isChecked)
        {
            if (isChecked)
                updateToggleButtons((ToggleButton) buttonView);
        }
    };
}

Maybe it can be usefull for somebody...