【问题标题】:Add margin between a RadioButton and its label in Android?在 Android 中的 RadioButton 与其标签之间添加边距?
【发布时间】:2011-01-09 05:27:02
【问题描述】:

是否可以在 RadioButton 和标签之间添加一点空间,同时仍然使用 Android 的内置组件?默认情况下,文本看起来有些皱缩。

<RadioButton android:id="@+id/rb1"
    android:layout_width="fill_parent" 
    android:layout_height="wrap_content"
    android:text="My Text"/>

我已经尝试了几件事:

  1. 指定边距和内边距似乎会在整个元素(按钮和文本一起)周围添加空间。这是有道理的,但不能满足我的需要。

  2. 通过 XML 创建自定义可绘制对象,为选中和未选中状态指定图像,然后在每个图像的右侧添加一些额外的像素。这应该可行,但现在您正在超出默认 UI。 (不是世界末日,但也不理想)

  3. 在每个标签的开头添加额外的空格。 Android 似乎修剪了前导空格字符,如“My String”,但指定 unicode U+00A0,如“\u00A0My String”就可以了。这行得通,但似乎有点脏。

有更好的解决方案吗?

【问题讨论】:

    标签: android radio-button


    【解决方案1】:

    目前无法尝试验证,但您是否尝试查看属性 android:drawablePadding 是否满足您的需求?

    【讨论】:

    • 嗯。试一试,在这种情况下似乎没有任何效果。感谢您的建议,从描述中听起来肯定是正确的:“可绘制对象和文本之间的填充”。
    【解决方案2】:

    不确定这是否能解决您的问题,但您是否尝试过 Radio Button 的值为 50dip 或更大的“Padding left”属性

    【讨论】:

    • 这行得通,并且需要 50dip 来覆盖默认可绘制对象的宽度。起初我使用 20dip 并且文本向左移动!那是因为锚点不是drawable的右边缘;它是drawable的左边缘。
    【解决方案3】:

    我试过了,“android:paddingLeft”会起作用。 paddingLeft 只会影响文本,同时保持无线电图像保持在原始位置。

    【讨论】:

      【解决方案4】:

      我尝试了几种方法,并在模拟器和设备上都可以正常工作:

          <RadioButton
              android:background="@android:color/transparent"
              android:button="@null"
              android:drawableLeft="@drawable/your_own_selector"
              android:drawablePadding="@dimen/your_spacing" />
      
      • android:background 需要透明,因为在 api10 上似乎有一个带有内部填充的背景(未尝试使用其他 api,但该解决方案也适用于其他 api)
      • android:button 需要为 null,否则填充将无法正常工作
      • android:drawableLeft 需要指定而不是 android:button
      • android:drawablePadding 是可绘制对象和文本之间的空间

      【讨论】:

      • 最佳答案!你也可以设置 android:background="@null" 并且看起来和你说的一样,没有填充。
      • 当我设置 android:button="@null" 时,单选按钮没有被选中(点击)。我做错了什么。请帮助stackoverflow.com/questions/28052820/…
      • @Shirish 此解决方案与您的按钮未被点击无关。我刚刚实现了它,它被点击了。
      • 感谢您的解决方案!
      【解决方案5】:

      “android:paddingLeft”似乎只能在 android 4.2.2 下正常工作

      我已经尝试了几乎所有版本的android,它只适用于4.2.2版本。

      【讨论】:

        【解决方案6】:

        对于现在阅读本文的任何人来说,接受的答案将导致新 API 上出现一些布局问题,从而导致填充过多。

        在 API paddingLeft 以设置相对于单选按钮的视图边界的填充。此外,补丁 9 的背景也会改变相对于视图的视图边界。

        在 API >= 17 上,paddingLeft(或 paddingStart)与可绘制的单选按钮相关。同样适用于补丁九。为了更好地说明填充差异,请参阅随附的屏幕截图。

        如果您深入研究代码,您会在 API 17 中找到一个名为 getHorizontalOffsetForDrawables 的新方法。在计算单选按钮的左侧填充时调用此方法(因此图片中显示了额外的空间)。

        TL;DR 如果您的 minSdkVersion >= 17,请使用 paddingLeft。如果您支持 API

        【讨论】:

        • api 17 是 android.os.Build.VERSION_CODES.JELLY_BEAN_MR1
        • 最好的方法是使用“values-v17”目录;将您的 API 17+ 维度放在资源 xml 中,将标准的 16 及以下维度放在简单的“值”中。
        • Google 开发人员/管理层对待我们普通开发人员的方式令人惊叹。他们随心所欲,随心所欲。一致性和完整性对​​他们来说毫无意义。
        • 还有一种方法可以为可绘制的单选按钮设置一个左侧填充吗?那么如何在屏幕左侧和可绘制的单选按钮(不是整个单选按钮)之间设置填充。
        【解决方案7】:

        我正在使用我认为应该适用于所有 API 版本的不同方法。 我没有应用填充,而是在 RadioButtons 之间添加了一个空视图:

        <View
                android:layout_width="20dp"
                android:layout_height="1dp" />
        

        这应该给你 20dp 的内边距。

        【讨论】:

          【解决方案8】:
          final float scale = this.getResources().getDisplayMetrics().density;
          checkBox.setPadding(checkBox.getPaddingLeft() + (int)(10.0f * scale + 0.5f),
          
              checkBox.getPaddingTop(),
              checkBox.getPaddingRight(),
              checkBox.getPaddingBottom());
          

          【讨论】:

            【解决方案9】:

            可绘制对象和文本之间的填充。这将通过在 xml 文件中添加以下行来实现。 android:drawablePadding="@dimen/10dp"

            【讨论】:

            • 我正在寻找这个...帮了我很多
            • @dimen/10dp 不好的做法
            【解决方案10】:

            通过paddingLeft单选按钮标签之间添加ma​​rgin

            android:paddingLeft="10dip"
            

            只需设置您的自定义填充

            RadioButton 的 xml 属性。

            <RadioButton
                android:id="@+id/radHighest"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:button="@drawable/YourImageResource"
                android:drawablePadding="50dp"
                android:paddingLeft="10dip"
                android:text="@string/txt_my_text"
                android:textSize="12sp" />
            

            完成

            【讨论】:

              【解决方案11】:

              我来这里是为了寻找答案,最简单的方法(经过一番思考)是在标签本身的开头添加间距,就像这样

              <RadioGroup
                   android:orientation="horizontal"
                   android:layout_width="wrap_content"
                   android:layout_height="wrap_content"
                   android:layout_alignRight="@+id/btnChangeMode"
                   android:layout_marginTop="10dp"
                   android:layout_marginBottom="10dp"
                   android:layout_below="@+id/view3"
                   android:gravity="center|left"
                   android:id="@+id/ledRadioGroup">
              <RadioButton
                       android:button="@drawable/custom_radio_button"
                       android:layout_width="wrap_content"
                       android:layout_height="wrap_content"
                       android:text=" On"
                       android:layout_marginRight="6dp"
                       android:id="@+id/ledon"
                       android:textColor="@color/white" />
              <RadioButton
                       android:button="@drawable/custom_radio_button"
                       android:layout_width="wrap_content"
                       android:layout_height="wrap_content"
                       android:text=" Off"
                       android:layout_marginLeft="6dp"
                       android:id="@+id/ledoff"
                       android:textColor="@color/white" />
              

              【讨论】:

                【解决方案12】:

                对我有用:

                <?xml version="1.0" encoding="utf-8"?>
                    <selector xmlns:android="http://schemas.android.com/apk/res/android">
                        <item android:state_checked="true">
                            <layer-list>
                                <item android:right="5dp">
                                    <shape android:paddingLeft="5dp" android:shape="oval">
                                     <size android:width="20dp" android:height="20dp" />
                                     <solid android:color="@color/blue" />
                            </shape>
                        </item>
                    </layer-list>
                </item>
                <item android:paddingLeft="5dp" android:state_checked="false">
                    <layer-list>
                        <item android:right="5dp">
                            <shape android:paddingLeft="5dp" android:shape="oval">
                                <size android:width="20dp" android:height="20dp" />
                                <solid android:color="@color/grey" />
                                </shape>
                            </item>
                        </layer-list>
                    </item>
                </selector>
                

                【讨论】:

                  【解决方案13】:

                  使用以下 XML 属性。它对我有用

                  对于 API

                  android:paddingLeft="16dp"
                  

                  对于 API >= 17 使用

                  android:paddingStart="@16dp"
                  

                  例如:

                  <android.support.v7.widget.AppCompatRadioButton
                          android:id="@+id/popularityRadioButton"
                          android:layout_width="match_parent"
                          android:layout_height="wrap_content"
                          android:checked="true"
                          android:paddingEnd="@dimen/radio_button_text"
                          android:paddingLeft="@dimen/radio_button_text"
                          android:paddingRight="@dimen/radio_button_text"
                          android:paddingStart="@dimen/radio_button_text"
                          android:text="Popularity"
                          android:textSize="@dimen/sort_dialog_text_size"
                          android:theme="@style/AppTheme.RadioButton" />
                  

                  更多:drawablePadding 属性不起作用。仅当您在单选按钮中添加了可绘制对象时,它才有效。例如:

                  <RadioButton
                      android:id="@+id/radioButton"
                      android:layout_width="wrap_content"
                      android:layout_height="wrap_content"
                      android:layout_gravity="center_horizontal"
                      android:button="@null"
                      android:drawableEnd="@android:drawable/btn_radio"
                      android:drawablePadding="56dp"
                      android:drawableRight="@android:drawable/btn_radio"
                      android:text="New RadioButton" />
                  

                  【讨论】:

                    【解决方案14】:
                    <RadioButton
                                    android:id="@+id/rb1"
                                    android:layout_width="wrap_content"
                                    android:layout_height="wrap_content"
                                    android:layout_marginTop="5dp"
                                    android:background="@null"
                                    android:paddingLeft="20dp"
                                    android:text="1"
                                    android:textColor="@color/text2"
                                    android:textSize="16sp"
                                    android:textStyle="bold" />
                    

                    【讨论】:

                    • 考虑添加一些 cmets 来解释这是如何解决问题的;)
                    【解决方案15】:

                    您可以尝试使用单选按钮的重力属性。

                    <RadioButton
                                            android:id="@+id/rb_all"
                                            android:layout_width="match_parent"
                                            android:layout_height="wrap_content"
                                            android:checked="true"
                                            android:gravity="right|center_vertical"
                                            android:padding="@dimen/padding_30dp"
                                            android:text="@string/filter_inv_all"
                                            android:textColor="@color/black"
                                            android:textSize="@dimen/text_size_18" />
                    

                    这将使文本与最右边对齐。查看图片中的第一个收音机。

                    【讨论】:

                      【解决方案16】:

                      您可以在您的 XML 文件中使用此代码

                      <RadioButton
                      android:id="@+id/rButton"
                      android:layout_width="wrap_content"
                      android:layout_height="wrap_content"
                      android:drawablePadding="50dp"
                      android:paddingLeft="10dip"
                      android:text="@string/your_text" />
                      

                      或在 Activity 类上使用它

                      radioButton.setPadding(12, 10, 0, 10);
                      

                      【讨论】:

                        【解决方案17】:

                        像这样在 style.xml 中创建一个样式

                        <style name="Button.Radio">
                        
                            <item name="android:paddingLeft">@dimen/spacing_large</item>
                            <item name="android:textSize">16sp</item>
                        </style>
                        

                        将该样式放在单选按钮中

                         <RadioButton
                                        android:id="@+id/rb_guest_busy"
                                        android:layout_width="match_parent"
                                        android:layout_height="48dp"
                                        android:text="@string/guest_is_waiting"
                                        android:textSize="@dimen/font_size_3x_medium"
                                        android:drawablePadding="@dimen/spacing_large"
                                        android:textColor="@color/color_text_heading_dark"
                                        style="@style/Button.Radio"/>
                        

                        您可以更改与按钮相同的任何属性,因为它 RadioButton 间接继承按钮。

                        【讨论】:

                          【解决方案18】:

                          我知道这是一个老问题,但有了这个解决方案,我终于放心了,忘记了 API 级别。

                          左侧垂直 RadioGroup 与右侧垂直文本视图。

                           <LinearLayout
                              android:layout_width="match_parent"
                              android:layout_height="wrap_content"
                              android:orientation="horizontal">
                          
                              <RadioGroup
                                  android:layout_width="wrap_content"
                                  android:layout_height="wrap_content"
                                  android:gravity="center_vertical">
                                  <RadioButton
                                      android:id="@+id/radio1"
                                      android:layout_width="wrap_content"
                                      android:layout_height="wrap_content"/>
                                  <RadioButton
                                      android:id="@+id/radio2"
                                      android:layout_width="wrap_content"
                                      android:layout_height="wrap_content"/>
                              </RadioGroup>
                          
                              <LinearLayout
                                  android:layout_width="wrap_content"
                                  android:layout_height="match_parent"
                                  android:orientation="vertical">
                                  <TextView
                                      android:layout_width="wrap_content"
                                      android:layout_height="match_parent"
                                      android:layout_marginLeft="8dp"
                                      android:gravity="center_vertical"
                                      android:text="Radio 1"/>
                                  <TextView
                                      android:layout_width="wrap_content"
                                      android:layout_height="match_parent"
                                      android:layout_marginLeft="8dp"
                                      android:gravity="center_vertical"
                                      android:text="Radio 2"/>
                              </LinearLayout>
                          </LinearLayout>
                          

                          【讨论】:

                          • @Mark Buikema,绝对不是标签,但它确实像标签一样工作!如果您想要点击标签,您可以将点击监听器添加到 TextViews。我的意思是,我们是否需要为 android os 的 e-v-e-r-y 版本实现布局?我想,没有。
                          猜你喜欢
                          • 1970-01-01
                          • 2021-09-06
                          • 2018-10-21
                          • 1970-01-01
                          • 2022-11-10
                          • 1970-01-01
                          • 1970-01-01
                          • 1970-01-01
                          • 1970-01-01
                          相关资源
                          最近更新 更多