安卓单选按钮的环形样式

Question

我需要为我的单选按钮创建2个环形：

1. 白色圆圈
2. 白色圆圈内部带有另一个颜色的圆圈

我不太清楚如何做到这一点。 我已经尝试过的方法：

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

    <item android:state_checked="false"><shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="ring">
            <android:solid android:color="@color/white" />

            <android:size android:height="10dp" android:width="10dp" />

            <corners android:radius="10dp" />
        </shape></item>

</selector>

<RadioButton
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:button="@drawable/radio_shape_unchecked"
                        android:checked="false"
                        android:text="Persoana fizica" />

http://i.stack.imgur.com/mltby.png

- Mihai Bratulescu

Answer 1

这里有一些代码供您参考。您可以像这样做。如果您遇到任何问题，则我可以将整个项目发送给您..希望这对您和其他人有所帮助 !!

res/drawable/red_ring.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
   android:innerRadiusRatio="3"
   android:shape="ring"
   android:thickness="10dp"
   android:useLevel="false" >

  <solid android:color="#FF0000" />

  <size
    android:height="30dp"
    android:width="30dp" />

</shape>

res/drawable/blue_ring.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
   android:innerRadiusRatio="3"
   android:shape="ring"
   android:thickness="5dp"
   android:useLevel="false" >

  <solid android:color="#0000FF" />

  <size
    android:height="20dp"
    android:width="20dp" />

</shape>

res/drawable/layer.xml

  <?xml version="1.0" encoding="utf-8"?>
  <layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
      <item android:drawable="@drawable/red_ring"/>
      <item android:drawable="@drawable/blue_ring"/>

  </layer-list>

res/drawable/selector_radio.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
   <item android:state_checked="true" android:drawable="@drawable/layer"></item>
   <item android:drawable="@drawable/blue_ring"></item>
</selector>

res/layout/activity_main.xml

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity" >

<RadioGroup
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:layout_centerInParent="true"
    android:gravity="center" >

    <RadioButton
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:button="@drawable/selector_radio"
        android:paddingLeft="30dp"
        android:text="Radio 1" />

    <RadioButton
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="10dp"
        android:button="@drawable/selector_radio"
        android:paddingLeft="30dp"
        android:text="Radio 2" />
   </RadioGroup>

 </RelativeLayout>

屏幕截图:

- Ketan Ahir

---

非常感谢，你几乎给了我完全相同的外观（我需要的是类似于收音机2的样式，但颜色互换），我会尝试编辑它并获得我需要的外观。 - Mihai Bratulescu

很好，如果你发现这个有用，请不要忘记接受并点赞。 - Ketan Ahir

我不会忘记，但我有一个问题：如何设置边框或者说如何让所选的单选按钮看起来像问题中的照片（链接在问题中）。现在我只能想到如何将其设置为单一颜色。 - Mihai Bratulescu

@MihaiBratulescu 哦..抱歉啊..我刚忘了添加layer.xml，现在我编辑过了，请查看答案。如果可以的话请打勾接受。 - Ketan Ahir

严重问题：尽管在模拟器的预览中看起来完美，但它只是一个带有白色边框的环，不再完全白色。 - Mihai Bratulescu

Answer 2

Ketan Ahir的解决方案对我不起作用，因为我需要填充背景。最终我做了一个圆环形和椭圆形，并在显示时设置了大小。

圆环形

 <shape
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="ring" android:useLevel="false">
    <solid
        android:color="#fbad38" />
    <stroke
        android:width="2dp"
        android:color="#fbad38" />
   </shape>

椭圆形状

<shape xmlns:android="http://schemas.android.com/apk/res/android"
       android:shape="oval" android:useLevel="false">
  <solid android:color="#fbad38"></solid>
</shape>

调整代码大小

    frbtRadio1 = (RadioButton) view.findViewById(R.id.radio1);

    frbtRadio1.getViewTreeObserver().addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
        @Override
        public void onGlobalLayout() {
            ViewGroup.LayoutParams lp = frbtRadio1.getLayoutParams();
            lp.height = frbtRadio1.getWidth();

            frbtRadio1.setLayoutParams(lp)
            frbtRadio1.getViewTreeObserver().removeOnGlobalLayoutListener( this );
        }
    });

- gfirem