Geek Answers Handbook

Iphone switch like button for android

I created a toggle button in android, and I used a selector to change the background, which toggles between on and off backgrounds.

My problem is how to make the background file remain in the state it will be pressed for, for example, if I click on on, the background should remain in the on state, but in my case, as soon as I stop pressing the button , it will return to the original background.

Does anyone know how to implement it?

Here is my selector file:

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/off" /> <!-- default -->
    <item android:state_pressed="true" android:drawable="@drawable/on" /> <!-- on state -->   
    <item android:state_focused="false" android:drawable="@drawable/off" /> <!-- off state -->
</selector>
+5
source share
4 answers

There is a CompoundButton that you probably want. Then there are several subclasses specializing in this too.

+1

, View . , ( , , iphone, , ).

View 2 Buttons .

0

Android 4.0 Switch, , iOS.

0

, Android 2.2 :

/ , iOS- .

XML

<RadioGroup
    android:id="@+id/settings_gender_radio"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="center_horizontal"
    android:orientation="horizontal" >

    <RadioButton
        android:id="@+id/female"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:layout_weight="0.5"
        android:background="@drawable/unselected_left_background"
        android:button="@null"
        android:gravity="center"
        android:onClick="onRadioButtonClicked"
        android:paddingBottom="5dp"
        android:paddingTop="5dp"
        android:text="@string/female"
        android:textColor="@color/Purple" />

    <RadioButton
        android:id="@+id/male"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:layout_weight="0.5"
        android:background="@drawable/unselected_right_background"
        android:button="@null"
        android:gravity="center"
        android:onClick="onRadioButtonClicked"
        android:paddingBottom="5dp"
        android:paddingTop="5dp"
        android:text="@string/male"
        android:textColor="@color/glooPurple" />

    <!-- Dummy element to avoid initial state sexism -->
    <RadioButton
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_gravity="center"
        android:checked="true" />
</RadioGroup>

Java

int MALE = 0x0;
int FEMALE = 0x1;
int mGender;

public void onRadioButtonClicked(View view) {
  RadioButton femaleButton = (RadioButton) getActivity().findViewById(
      R.id.female);
  RadioButton maleButton = (RadioButton) getActivity()
      .findViewById(R.id.male);
  boolean checked = ((RadioButton) view).isChecked();

  switch (view.getId()) {
  case R.id.male:
    if (checked) {
      // Check api version
      if (android.os.Build.VERSION.SDK_INT < 16) {
        femaleButton.setBackgroundDrawable(getResources().getDrawable(
            R.drawable.unselected_left_background));
        maleButton.setBackgroundDrawable(getResources().getDrawable(
            R.drawable.selected_right_background));
      } else {
        femaleButton.setBackground(getResources().getDrawable(
            R.drawable.unselected_left_background));
        maleButton.setBackground(getResources().getDrawable(
            R.drawable.selected_right_background));
      }
      femaleButton.setTextColor(getResources().getColor(R.color.Purple));
      maleButton.setTextColor(getResources().getColor(R.color.Gray));
      mGender = MALE;
    }
    break;
  case R.id.female:
    if (checked) {
      if (android.os.Build.VERSION.SDK_INT < 16) {
        femaleButton.setBackgroundDrawable(getResources().getDrawable(
            R.drawable.selected_left_background));
        maleButton.setBackgroundDrawable(getResources().getDrawable(
            R.drawable.unselected_right_background));
      } else {
        femaleButton.setBackground(getResources().getDrawable(
            R.drawable.selected_left_background));
        maleButton.setBackground(getResources().getDrawable(
            R.drawable.unselected_right_background));
      }
      femaleButton.setTextColor(getResources().getColor(R.color.Gray));
      maleButton.setTextColor(getResources().getColor(R.color.Purple));
      mGender = FEMALE;
    }
    break;
  }
}

selected_left_background.xml

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

    <corners
        android:bottomLeftRadius="4dp"
        android:bottomRightRadius="0dp"
        android:radius="1dp"
        android:topLeftRadius="4dp"
        android:topRightRadius="0dp" />

    <gradient
        android:angle="270"
        android:endColor="@color/primaryColor"
        android:startColor="@color/primaryColor"
        android:type="linear" />

</shape>

selected_right_background.xml

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

    <corners
        android:bottomLeftRadius="0dp"
        android:bottomRightRadius="4dp"
        android:radius="1dp"
        android:topLeftRadius="0dp"
        android:topRightRadius="4dp" />

    <gradient
        android:angle="270"
        android:endColor="@color/primaryColor"
        android:startColor="@color/primaryColor"
        android:type="linear" />

</shape>

unselected_left_background.xml

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

    <corners
        android:bottomLeftRadius="4dp"
        android:bottomRightRadius="0dp"
        android:radius="1dp"
        android:topLeftRadius="4dp"
        android:topRightRadius="0dp" />

    <solid android:color="@color/ltGray" />

    <stroke
        android:width="1px"
        android:color="@color/gloopurple" />

</shape>

unselected_right_background.xml

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

    <corners
        android:bottomLeftRadius="0dp"
        android:bottomRightRadius="4dp"
        android:radius="1dp"
        android:topLeftRadius="0dp"
        android:topRightRadius="4dp" />

    <solid android:color="@color/ltGray" />

    <stroke
        android:width="1px"
        android:color="@color/gloopurple" />

</shape>

Please let me know if you have any problems with the implementation of this solution, I would like to help. Also any suggestions / tips on how I could do it better are more than welcome

0
source

More articles:


All Articles