【问题标题】:How to show android checkbox at right side?如何在右侧显示android复选框?
【发布时间】:2011-03-10 13:33:11
【问题描述】:

默认情况下,android 复选框显示 右侧的文本和左侧的复选框
我想在右侧显示复选框,在左侧显示文本

我该如何做到这一点?

【问题讨论】:

    标签: android layout checkbox


    【解决方案1】:

    我认为现在回答这个问题为时已晚,但实际上有一种方法可以实现您的目标。您只需将以下行添加到您的复选框:

    android:button="@null"
    android:drawableRight="?android:attr/listChoiceIndicatorMultiple"
    

    您也可以将自定义的可绘制对象用于复选框。

    对于单选按钮:

    android:button="@null"
    android:drawableRight="@android:drawable/btn_radio"
    

    如果您想以编程方式进行:

    定义一个布局并将其命名为 RightCheckBox 并复制以下行:

    <?xml version="1.0" encoding="utf-8"?>
    <CheckBox xmlns:android="http://schemas.android.com/apk/res/android"
        android:text="hello"
        android:layout_width="match_parent" 
        android:layout_height="match_parent"
        android:button="@null"
        android:drawableRight="?android:attr/listChoiceIndicatorMultiple"/>
    

    当您需要以编程方式添加它时,您只需将其膨胀到 CheckBox 并将其添加到根视图。

    CheckBox cb = (CheckBox)((LayoutInflater)getSystemService(LAYOUT_INFLATER_SERVICE)).inflate(R.layout.check_right_checkbox,null);
    rootView.addView(cb);
    

    【讨论】:

    • 对于复选框,您可以使用android:drawableRight="?android:attr/listChoiceIndicatorMultiple"。我认为这是迄今为止我找到的右侧复选框的最佳解决方案。
    • 请注意,Android 5.0 SDK 会向您显示有关 RTL 设备的警告。要让它消失,只需在android:drawableRight 之外添加android:drawableEnd(具有相同的值)。
    • 这个解决方案很好地解决了这个问题。然而,在 Android 5.+ 上,虽然标准小部件包含可绘制到检查周围一小块区域的波纹,但这个修改后的小部件允许波纹扩展到远远超出小部件本身的范围。如果使用这种技术,我建议将背景设置为使用带有矩形遮罩的可绘制波纹。
    • Android 提供了十几个视图对象,所有这些对象都可以更改为绘制 android drawable 或自定义 drawable。如果您想要对象上的涟漪效果(5.0+),只需将其背景设置为启用涟漪的 XML 可绘制对象。以下链接显示了几个示例视图对象,CheckedTextView、CheckBox、ToggleButton 等,并设置了正确的 drwable。 landenlabs.com/android/uicomponents/uicomponents.html#checkbox
    • 它在文本中心显示一个圆形波纹,但在右侧可绘制对象上没有,因此在现代 Android 版本上看起来很丑
    【解决方案2】:

    你可以的

    <CheckBox
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:gravity="right|center"//or "center_vertical" for center text
    android:layoutDirection="rtl"
    android:text="hello" />
    

    下面一行就够了

    android:layoutDirection="rtl"
    

    【讨论】:

    • Hacky 和优雅的同时。干杯!
    • 好把戏的人!不要忘记重力:android:gravity="right|center" 以获得预期的镜像效果。
    • 这不是正确的方法,因为如果您的设备使用 RTL 语言,它看起来不正确。
    • cb.setLayoutDirection(CheckBox.LAYOUT_DIRECTION_RTL);
    • 需要设置android:gravity="end|center_vertical"使文本显示在左侧,因为布局从现在开始。
    【解决方案3】:

    您可以添加 android:layoutDirection="rtl",但它仅适用于 API 17。

    【讨论】:

      【解决方案4】:

      我想不出样式的方法,但您可以将复选框的文本设置为空,然后在复选框的左侧放置一个 TextView 与您想要的文本。

      【讨论】:

      • 我对此有一个疑问:当您单击布局时,它应该显示(在很短的时间内)选择了整行。你如何做到这一点并模拟它是一种原生效果?
      • 没关系 - 我已经为布局设置了一个选择器,现在可以了。
      • @androiddeveloper 你能发布选择器解决方案吗?
      • @FouadWahabi 您可以在 "res/drawable" 中创建一个 xml 可绘制对象,例如:stackoverflow.com/a/2038086,并将视图/布局的背景设置为此可绘制文件。您可能还需要使其可点击。我想我也看过一个关于它的 Google IO 讲座。不确定。强烈建议查看他们的视频。
      • @FouadWahabi 好吧,您可以扩展您选择的布局类,并自己添加此逻辑。您可以查看所有子视图并切换它们的状态。您可以使用这些链接来帮助您:developer.android.com/samples/CustomChoiceList/src/…antoine-merle.com/blog/2013/07/17/…。添加一个clickListener,并切换检查,并在“setChecked”内部相应地设置子视图的状态,但前提是它们实现了Checkable。
      【解决方案5】:
          <android.support.v7.widget.AppCompatCheckBox
        android:id="@+id/checkBox"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="10dp"
        android:layoutDirection="rtl"
        android:text="text" />`
      

      【讨论】:

      • 这也使文本右对齐,所以如果复选框视图与父宽度匹配,它会看起来很奇怪。
      • 使宽度也“包裹内容”使其更好。
      【解决方案6】:

      复制一下:

          <LinearLayout
              android:layout_width="wrap_content"
              android:layout_height="wrap_content"
              android:orientation="horizontal">
              <TextView
                  android:layout_width="wrap_content"
                  android:layout_height="wrap_content"
                  android:text="Your text:"/>
              <CheckBox
                  android:layout_width="wrap_content"
                  android:layout_height="wrap_content"
                  android:checked="true"
                  />
          </LinearLayout>
      

      编码愉快! :)

      【讨论】:

        【解决方案7】:

        复选框文本可能未左对齐

        android:button="@null"
        android:drawableRight="@android:drawable/btn_radio"
        

        在某些设备中。可以用CheckedTextView代替,避免出现问题,

        <CheckedTextView
            ...
            android:checkMark="@android:drawable/btn_radio" />
        

        这个链接会很有帮助:Align text left, checkbox right

        【讨论】:

        • 这是一个单选按钮。请问材料复选框那个怎么样?
        • 复选框使用android:checkMark="?android:attr/listChoiceIndicatorMultiple"
        • 单选按钮使用android:checkMark="?android:attr/listChoiceIndicatorSingle"
        【解决方案8】:

        根据@The Berga 的建议,您可以添加 android:layoutDirection="rtl",但它仅适用于 API 17。
        对于动态实现,这里是

        chkBox.setLayoutDirection(View.LAYOUT_DIRECTION_RTL);
        

        【讨论】:

          【解决方案9】:

          【讨论】:

            【解决方案10】:

            进一步来自 Hazhir imput,对于这个问题,必须在复选框 xml 配置 android:paddingLeft="0dp" 中注入该属性,这是为了避免复选框左侧的空白。

            【讨论】:

              【解决方案11】:

              添加另一个使用 CheckedTextView 如果有人试图以编程方式执行此问题的答案。它还可以选择为复选框使用自定义图像。并且可以在单个视图中完成

              final CheckedTextView checkBox = new CheckedTextView(getApplicationContext());
                  checkBox.setLayoutParams(new LinearLayout.LayoutParams(LinearLayout.LayoutParams.WRAP_CONTENT, LinearLayout.LayoutParams.WRAP_CONTENT));
                  checkBox.setId(1);
                  checkBox.setCheckMarkDrawable(android.R.drawable.checkbox_off_background);
                  checkBox.setOnClickListener(new View.OnClickListener() {
                      @Override
                      public void onClick(View v) {
                          if (checkBox.isChecked()){
                              checkBox.setChecked(false);
                              checkBox.setCheckMarkDrawable(android.R.drawable.checkbox_off_background);
                          }else{
                              checkBox.setChecked(true);
                              checkBox.setCheckMarkDrawable(android.R.drawable.checkbox_on_background);
                          }
                      }
                  });
                  checkBox.setTextColor(Color.BLACK);
                  checkBox.setGravity(Gravity.LEFT);
                  checkBox.setText("hi");
              

              如果你想从 XML 发起 -

              <CheckedTextView
                      android:layout_width="wrap_content"
                      android:layout_height="wrap_content"
                      android:checkMark="@android:drawable/checkbox_off_background"
                      android:checked="false"
                      android:text="Hi from xml"/>
              

              【讨论】:

                【解决方案12】:

                如果不是强制使用CheckBox,您可以改用Switch。 Switch 默认在左侧显示文本。

                【讨论】:

                  【解决方案13】:

                  以下链接演示了如何通过设置正确的可绘制对象来呈现几个带有动画复选框的标准 Android 视图对象。

                  设置背景以获得涟漪效果。

                  [链接到带有右侧和左侧示例复选框的网站。][1] http://landenlabs.com/android/uicomponents/uicomponents.html#checkbox

                           <Button
                              android:id="@+id/p2Button1"
                              android:layout_width="match_parent"
                              android:layout_height="wrap_content"
                  
                              android:background="@drawable/transparent_ripple"
                              android:drawableRight="@drawable/checkline"
                              android:gravity="left|center_vertical"
                              android:text="Button"
                              android:textAllCaps="false"
                  
                              android:textColor="@android:color/white"
                              android:textSize="@dimen/buttonTextSize" />
                  
                          <android.support.v7.widget.AppCompatButton
                              android:id="@+id/p2Button2"
                              android:layout_width="match_parent"
                              android:layout_height="wrap_content"
                  
                              android:background="@drawable/transparent_ripple"
                              android:drawableRight="@drawable/checkline"
                              android:gravity="left|center_vertical"
                              android:text="AppCompatButton"
                              android:textAllCaps="false"
                  
                              android:textColor="@android:color/white"
                              android:textSize="@dimen/buttonTextSize" />
                  
                          <TextView
                              android:id="@+id/p2TextView1"
                              android:layout_width="match_parent"
                              android:layout_height="wrap_content"
                  
                              android:background="@drawable/transparent_ripple"
                              android:drawableRight="@drawable/checkline"
                              android:gravity="left|center_vertical"
                              android:hapticFeedbackEnabled="true"
                  
                              android:text="TextView"
                              android:textColor="@android:color/white"
                              android:textSize="@dimen/buttonTextSize" />
                  
                          <android.support.v7.widget.AppCompatTextView
                              android:id="@+id/p2TextView2"
                              android:layout_width="match_parent"
                              android:layout_height="wrap_content"
                  
                              android:background="@drawable/transparent_ripple"
                              android:drawableRight="@drawable/checkline"
                              android:gravity="left|center_vertical"
                              android:hapticFeedbackEnabled="true"
                  
                              android:text="AppCompatTextView"
                              android:textColor="@android:color/white"
                              android:textSize="@dimen/buttonTextSize" />
                  
                          <View
                              android:layout_width="match_parent"
                              android:layout_height="1dp"
                              android:background="@android:color/white" />
                  
                          <CheckBox
                              android:id="@+id/p2Checkbox1"
                              android:layout_width="match_parent"
                              android:layout_height="@dimen/buttonHeight"
                              android:background="@drawable/transparent_ripple"
                              android:button="@null"
                              android:checked="true"
                              android:drawableRight="@drawable/checkline"
                              android:gravity="left|center_vertical"
                              android:text="CheckBox"
                              android:textColor="@android:color/white"
                              android:textSize="@dimen/buttonTextSize" />
                  
                          <android.support.v7.widget.AppCompatCheckBox
                              android:id="@+id/p2Checkbox2"
                              android:layout_width="match_parent"
                              android:layout_height="@dimen/buttonHeight"
                              android:background="@drawable/transparent_ripple"
                              android:button="@null"
                              android:checked="true"
                              android:drawableRight="@drawable/checkline"
                              android:gravity="left|center_vertical"
                              android:text="AppCompatCheckBox"
                              android:textColor="@android:color/white"
                              android:textSize="@dimen/buttonTextSize" />
                  
                          <android.support.v7.widget.AppCompatCheckedTextView
                              android:id="@+id/p2Checkbox3"
                              android:layout_width="match_parent"
                              android:layout_height="@dimen/buttonHeight"
                              android:background="@drawable/transparent_ripple"
                              android:checkMark="@drawable/checkline"
                              android:checked="true"
                              android:gravity="left|center_vertical"
                              android:text="AppCompatCheckedTextView"
                              android:textColor="@android:color/white"
                              android:textSize="@dimen/buttonTextSize" />
                  
                          <!--  android:checkMark="?android:attr/listChoiceIndicatorMultiple" -->
                          <CheckedTextView
                              android:id="@+id/p2Checkbox4"
                              android:layout_width="match_parent"
                              android:layout_height="@dimen/buttonHeight"
                              android:background="@drawable/transparent_ripple"
                              android:checkMark="@drawable/checkline"
                              android:checked="true"
                              android:gravity="left|center_vertical"
                              android:text="CheckedTextView"
                              android:textColor="@android:color/white"
                              android:textSize="@dimen/buttonTextSize" />
                  
                          <CheckBox
                              android:id="@+id/p2Checkbox5"
                              android:layout_width="match_parent"
                              android:layout_height="@dimen/buttonHeight"
                              android:background="@drawable/transparent_ripple"
                              android:checked="true"
                              android:gravity="center_vertical|end"
                              android:text="CheckBox"
                              android:textColor="@android:color/white"
                              android:textSize="@dimen/buttonTextSize" />
                  
                          <View
                              android:layout_width="match_parent"
                              android:layout_height="1dp"
                              android:background="@android:color/white" />
                  
                  
                          <ToggleButton
                              android:id="@+id/p2ToggleButton1"
                              android:layout_width="match_parent"
                              android:layout_height="@dimen/buttonHeight"
                              android:background="@drawable/transparent_ripple"
                              android:checked="true"
                              android:drawableRight="@drawable/checkline"
                              android:gravity="center_vertical|left"
                              android:textAllCaps="false"
                              android:textColor="@android:color/white"
                  
                              android:textOff="ToggleButtonOff"
                  
                              android:textOn="ToggleButtonOn"
                              android:textSize="@dimen/buttonTextSize" />
                  
                          <ToggleButton
                              android:id="@+id/p2ToggleButton2"
                              android:layout_width="match_parent"
                              android:layout_height="@dimen/buttonHeight"
                              android:background="@drawable/transparent_ripple"
                              android:checked="true"
                              android:drawableRight="@drawable/btn_check_material_anim"
                              android:gravity="center_vertical|left"
                              android:textAllCaps="false"
                  
                              android:textColor="@android:color/white"
                              android:textOff="ToggleBtnnAnimOff"
                              android:textOn="ToggleBtnnAnimOn"
                              android:textSize="@dimen/buttonTextSize" />
                  

                  示例 checkline.xml(在 drawable 中,请参阅 drawable-v21 中动画版本的链接)

                  示例 transparent_ripple.xml(在 drawable-v21 中)

                  <!-- Limit ripple to view object, can also use shape such as oval -->
                  <item android:id="@android:id/mask" android:drawable="@android:color/white" />
                  
                  <item>
                      <selector xmlns:android="http://schemas.android.com/apk/res/android"
                          android:enterFadeDuration="200"
                          android:exitFadeDuration="200">
                  
                          <item android:state_pressed="true">
                              <shape android:shape="rectangle">
                                  <solid android:color="#80c0c000" />
                              </shape>
                          </item>
                      </selector>
                  </item>
                  


                  示例 transparent_ripple.xml(在可绘制中,仅突出显示没有可用的波纹

                  <item android:state_pressed="true">
                      <shape android:shape="rectangle">
                          <solid android:color="#80c0c000" />
                      </shape>
                  </item>
                  <item>
                      <shape android:shape="rectangle">
                          <solid android:color="@android:color/transparent" />
                      </shape>
                  </item>
                  

                  【讨论】:

                    【解决方案14】:

                    你也可以用这个,

                    <CheckBox
                           android:layout_width="match_parent"     
                           android:layout_height="@dimen/button_height_35"
                           android:text="@string/english"
                           android:checked="true"
                           android:paddingEnd="@dimen/padding_5"
                           android:paddingStart="@dimen/padding_5"
                           android:layoutDirection="rtl"
                           android:drawablePadding="@dimen/padding_5"
                           android:drawableEnd="@drawable/ic_english"
                           style="@style/TextStyleSemiBold"
                           android:textSize="@dimen/text_15"
                           android:button="@drawable/language_selector"/>
                    

                    【讨论】:

                    • 包含一些细节或进一步学习的参考总是额外的功劳。让你的答案更有用
                    【解决方案15】:
                    <LinearLayout
                            android:layout_width="match_parent"
                            android:layout_height="wrap_content"
                            android:orientation="horizontal">
                    
                    
                            <TextView
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:layout_gravity="center"
                                android:text="@string/location_permissions"
                                android:textAppearance="@style/TextAppearance.AppCompat.Medium"
                                android:textColor="@android:color/black" />
                    
                            <RelativeLayout
                                android:layout_width="match_parent"
                                android:layout_height="match_parent">
                    
                                <CheckBox
                                    android:id="@+id/location_permission_checkbox"
                                    android:layout_width="wrap_content"
                                    android:layout_height="wrap_content"
                                    android:layout_alignParentRight="true"
                                    android:layout_marginRight="8dp"
                                    android:onClick="onLocationPermissionClicked" />
                    
                            </RelativeLayout>
                        </LinearLayout>
                    

                    【讨论】:

                      猜你喜欢
                      • 2022-11-18
                      • 1970-01-01
                      • 2014-04-14
                      • 1970-01-01
                      • 2010-10-09
                      • 1970-01-01
                      • 2014-02-06
                      • 1970-01-01
                      • 1970-01-01
                      相关资源
                      最近更新 更多