Question

我想问一下如何在Android中设计Radio Group就像这张图片

“我的风格”

我设计了这样的XML：

    <RadioGroup
       android:layout_below="@+id/btnGroup"

       android:layout_width="wrap_content"
       android:layout_height="wrap_content">
       <RelativeLayout
            android:layout_width="match_parent"
           android:layout_height="wrap_content">

           <RadioButton
               android:id="@+id/rdiEasy"
               android:text="EASY"
               android:layout_alignParentLeft="true"
               android:layout_width="wrap_content"
               android:layout_height="wrap_content" />

           <RadioButton
               android:id="@+id/rdiMedium"
               android:text="MEDIUM"
               android:layout_marginRight="8dp"
               android:layout_alignParentRight="true"
               android:layout_width="wrap_content"
               android:layout_height="wrap_content" />

       </RelativeLayout>
       <RelativeLayout
           android:layout_width="match_parent"
           android:layout_height="wrap_content">

           <RadioButton
               android:id="@+id/rdiHard"
               android:text="HARD"
               android:layout_alignParentLeft="true"

               android:layout_width="wrap_content"
               android:layout_height="wrap_content" />

           <RadioButton
               android:id="@+id/rdiHardest"
               android:text="HARDEST"
               android:layout_alignParentRight="true"
               android:layout_width="wrap_content"
               android:layout_height="wrap_content" />

       </RelativeLayout>
   </RadioGroup>

我使用RadioButtonGroup wrap 2 RelativeLayout，每个RelativeLayout包含两个Radio Button。但是有了这个设计，我不能只选择一个单选按钮，还可以选择多个单选按钮。所以任何人都可以帮助我如何使用这种设计设计单选按钮，但只选择一个选项。

Answer 1

使用此代码，它完美无缺。

    <RelativeLayout
    android:id="@+id/rl1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentLeft="true"
    android:layout_alignParentStart="true"
    android:layout_alignParentTop="true">

    <RadioGroup
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:layout_alignParentTop="true"
        android:orientation="horizontal"
        android:transitionGroup="true">

        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            android:paddingLeft="30dp">

            <RadioButton
                android:id="@+id/rdiEasy"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Easy" />

            <RadioButton
                android:id="@+id/rdiHard"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Hard" />

        </LinearLayout>

        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            android:paddingLeft="30dp">

            <RadioButton
                android:id="@+id/rdiMedium"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_toRightOf="@+id/rdiEasy"
                android:text="Medium" />

            <RadioButton
                android:id="@+id/rdiHardest"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_toRightOf="@+id/rdiHard"
                android:text="Hardest" />

        </LinearLayout>
    </RadioGroup>
</RelativeLayout>

Answer 2

尝试使用此代码而不使用radiogroup中的布局。尝试通过设置重力来实现所需的模式，如下所示，并检查单选按钮是否只选择了一个或多个

<RadioGroup
    android:id="@+id/radioGroup"
    android:layout_width="500dp"
    android:layout_height="250dp"
    android:layout_weight=".07"
    android:gravity="center">


    <RadioButton
        android:id="@+id/radioButton2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="left|top"
        android:layout_marginLeft="5dp"
        android:text="New RadioButton" />

    <RadioButton
        android:id="@+id/radioButton"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="right|top"
        android:layout_marginRight="5dp"
        android:text="New RadioButton" />

    <RadioButton
        android:id="@+id/radioButton4"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|left"
        android:layout_marginLeft="5dp"
        android:text="New RadioButton" />

    <RadioButton
        android:id="@+id/radioButton3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|right"
        android:layout_marginRight="5dp"
        android:text="New RadioButton" />

</RadioGroup>

Answer 3

我认为这对你有用

https://gist.github.com/ishitcno1/9544243

Style Radio Group Android

3 个答案: