Android：选项卡就像切换按钮选择器而不是微调器

Question

我有一个 android 应用程序，在一个活动中我需要一个选项卡，比如选择器，用户可以在其中选择一个选项。这 3 个选项是蓝色、绿色、红色。用户需要选择其中任何一个。我可以使用微调器this.But 我喜欢使用类似功能的圆边标签，它可以切换，所选项目将显示为突出显示，其他项目将显示为灰色，如下所示。 我只希望用户能够只切换一个按钮。用户可以通过单击或切换来选择一个选项，并且视图应该看起来像一个带有圆边的条。如何在 android 中实现上述视图？请帮帮我。

Answer 1

这样试试

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:azeoo="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >

<RadioGroup
    android:id="@+id/rgTask"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:background="@drawable/round_border"
    android:orientation="horizontal" >

    <RadioButton
        android:id="@+id/rbBlue"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:background="@drawable/bg_blue"
        android:button="@android:color/transparent"
        android:gravity="center"
        android:paddingBottom="5dp"
        android:paddingTop="5dp"
        android:singleLine="true"
        android:text="Blue"
        android:textSize="22sp" />

    <View
        android:id="@+id/vSep1"
        android:layout_width="1dp"
        android:layout_height="match_parent"
        android:background="#0000FF"
        android:visibility="visible" />

    <RadioButton
        android:id="@+id/rbGreen"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:background="@drawable/bg_green"
        android:button="@android:color/transparent"
        android:gravity="center"
        android:paddingBottom="5dp"
        android:paddingTop="5dp"
        android:singleLine="true"
        android:text="Green"
        android:textSize="22sp" />

    <View
        android:id="@+id/vSep2"
        android:layout_width="1dp"
        android:layout_height="match_parent"
        android:background="#0000FF"
        android:visibility="visible" />

    <RadioButton
        android:id="@+id/rbRed"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:background="@drawable/bg_red"
        android:button="@android:color/transparent"
        android:gravity="center"
        android:paddingBottom="5dp"
        android:paddingTop="5dp"
        android:singleLine="true"
        android:text="Red"
        android:textSize="22sp" />
</RadioGroup>

将以下所有文件放入您的drawable 文件夹中 bg_blue.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">

<item android:state_checked="true"><shape android:shape="rectangle">
        <solid android:color="#0000FF" />

        <corners android:bottomLeftRadius="10dp" android:topLeftRadius="10dp" />
    </shape></item>
<item><shape android:shape="rectangle">
        <solid android:color="#00000000" />
    </shape></item>

</selector>

bg_green.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">

<item android:state_checked="true"><shape android:shape="rectangle">
        <solid android:color="#00FF00" />
    </shape></item>
<item><shape android:shape="rectangle">
        <solid android:color="#00000000" />
    </shape></item>

</selector>

bg_red.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">

<item android:state_checked="true"><shape android:shape="rectangle">
        <solid android:color="#FF0000" />

        <corners android:bottomRightRadius="10dp" android:topRightRadius="10dp" />
    </shape></item>
<item><shape android:shape="rectangle">
        <solid android:color="#00000000" />
    </shape></item>

</selector>

round_border.xml

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

<!-- view background color -->
<solid android:color="#00000000" >
</solid>

<!-- view border color and width -->
<stroke
    android:width="1dp"
    android:color="#0000FF" >
</stroke>

<!-- If you want to add some padding -->


<!-- Here is the corner radius -->
<corners android:radius="10dp" >
</corners>

</shape>

像这样输出