android - radiogroup 的自定义圆形样式

Question

我正在尝试为单选按钮(或可切换按钮)制作自定义样式，但我不知道它是否可以实现。

我的按钮的当前样式:

我想实现这样的目标

理想的风格:

一个加号是有一个动画，其中选定的颜色在按钮之间“滑动”。在 xml 设计和动画方面，我真的是新手。关于我在哪里可以学到这样的东西的任何指示或建议都很好!

感谢您的帮助。

汤姆。

Answer 1

在 drawable 文件夹中创建给定的 xml 文件灰色背景.xml

<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item>
    <shape android:shape="rectangle">
        <solid android:color="#B9AFAF"/>
        <corners android:radius="30dp" />
        <stroke
            android:width="1dp"
            android:color="@color/black" />
    </shape>
</item>

黄色背景.xml

<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item>
    <shape android:shape="rectangle">
        <solid android:color="@color/orng"/>
        <corners android:radius="30dp" />
        <stroke
            android:width="1dp"
            android:color="@color/black"
            />
    </shape>
</item>

gray_round.xml

<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item>
    <shape android:shape="rectangle">
        <solid android:color="#B9AFAF"/>
        <corners android:radius="30dp" />
        <stroke
            android:width="1dp"
            android:color="#B9AFAF"
            />
    </shape>
</item>

创建activity_main.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:gravity="center"
android:layout_width="match_parent"
android:layout_height="match_parent">
<RadioGroup
    android:id="@+id/radioGroup"
    android:layout_width="wrap_content"
    android:orientation="horizontal"
    android:background="@drawable/a_gray_background"
    android:layout_height="wrap_content">
    <androidx.appcompat.widget.AppCompatRadioButton
        android:id="@+id/button1"
        android:layout_width="150dp"
        android:button="@null"
        android:gravity="center"
        android:text="A Voir"
        android:layout_margin="1dp"
        android:layout_height="@dimen/dimen_30dp"
        android:background="@drawable/a_yellow_background"/>
    <androidx.appcompat.widget.AppCompatRadioButton
        android:layout_width="150dp"
        android:id="@+id/button2"
        android:button="@null"
        android:gravity="center"
        android:layout_margin="1dp"
        android:text="A Voir"
        android:layout_height="@dimen/dimen_30dp" />
</RadioGroup>

现在创建 MainActivity.java 类

public class MainActivity extends AppCompatActivity  {
RadioGroup radioGroup;
RadioButton rd1,rd2;
@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    radioGroup=findViewById(R.id.radioGroup);
    rd1=findViewById(R.id.button1);
    rd2=findViewById(R.id.button2);

    radioGroup.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener()
    {
        public void onCheckedChanged(RadioGroup group, int checkedId)
        {
            if (checkedId == R.id.button1)
            {
               rd1.setBackgroundResource(R.drawable.yellow_background);
              rd2.setBackgroundResource(R.drawable.gray_round);

            }

          else   if (checkedId == R.id.button2)
            {
                rd1.setBackgroundResource(R.drawable.gray_round);
                rd2.setBackgroundResource(R.drawable.yellow_background);
            }
        }
    });
}}

希望对您有所帮助。

谢谢。