RadioButton 左侧显示文字,右侧显示按钮时文字不靠边的问题解决
2014-02-13 17:18
190 查看
项目中有一个这样的需求:
下面三行点击某行即选中,颜色变深。自然的想到使用RadioButton因此决定使用RadioButton和RadioButton实现。
完整的代码如下:
布局文件activity_main.xml:
MainActivity.java:
上面的Hello world!是居左的,但是下面的文字却怎么都不能靠边。试了各种方法都不行。
最后,无意中给RadioButton添加一个backgroud属性即可:
最后实现了所需效果。
通过对比,感觉应该是左面有padding。尝试去打印下它的paddingleft:getCompoundPaddingLeft(),得到的结果是76,说明左侧是有边距的。但是,为什么设置background也行呢?高手请指点,谢谢~~
下面三行点击某行即选中,颜色变深。自然的想到使用RadioButton因此决定使用RadioButton和RadioButton实现。
1、RadioButton实现上述效果
<RadioButton android:id="@+id/rbAll" android:layout_width="match_parent" android:layout_height="wrap_content" android:button="@null" android:drawableRight="@drawable/selector_tb" android:text="测试条目一" android:textColor="@android:color/primary_text_light" android:textSize="14sp" />这个是RadioButton的实现:首先android:button="@null",这个用于隐藏RadioButton默认的按钮;android:drawableRight="@drawable/selector_tb"这个用于显示自己定义的按钮,也就是上图右侧的按钮,当然,如果在左侧,你可以设置android:drawableLeft="@drawable/selector_tb"等;然后就是文字的属性。这样就设置完毕了。android:drawableRight="@drawable/selector_tb"中的selector_tb是一个选择器,代码如下:
<?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:drawable="@drawable/ic_rb_press" android:state_checked="true" /> <item android:drawable="@drawable/ic_rb_unpress" android:state_checked="false" /> </selector>
完整的代码如下:
布局文件activity_main.xml:
<LinearLayout 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" android:orientation="vertical" android:background="@android:color/white" tools:context=".MainActivity" > <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/hello_world" /> <RadioGroup android:id="@+id/rgRight" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginTop="8dp" android:orientation="vertical" > <RadioButton android:id="@+id/rbAll" android:layout_width="match_parent" android:layout_height="wrap_content" android:background="@android:color/white" android:button="@null" android:drawableRight="@drawable/selector_tb" android:text="测试条目一" android:textColor="@android:color/primary_text_light" android:textSize="14sp" /> <RadioButton android:id="@+id/rbLimit" android:layout_width="match_parent" android:layout_height="wrap_content" android:background="@android:color/white" android:button="@null" android:drawableRight="@drawable/selector_tb" android:text="测试条目二" android:textColor="@android:color/primary_text_light" android:textSize="14sp" /> <RadioButton android:id="@+id/rbNone" android:layout_width="match_parent" android:layout_height="wrap_content" android:button="@null" android:drawableRight="@drawable/selector_tb" android:text="测试条目三" android:textColor="@android:color/primary_text_light" android:textSize="14sp" /> </RadioGroup> </LinearLayout>
MainActivity.java:
public class MainActivity extends Activity implements OnCheckedChangeListener { private RadioGroup rgRight; private RadioButton rbAll, rbLimit, rbNone; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); rgRight = (RadioGroup) findViewById(R.id.rgRight); rgRight.setOnCheckedChangeListener(this); rbAll = (RadioButton) findViewById(R.id.rbAll); rbLimit = (RadioButton) findViewById(R.id.rbLimit); rbNone = (RadioButton) findViewById(R.id.rbNone); } @Override public void onCheckedChanged(RadioGroup group, int checkedId) { switch (checkedId) { case R.id.rbAll: radioButtonInit(); rbAll.setTextColor(getResources().getColor(android.R.color.secondary_text_dark)); break; case R.id.rbLimit: radioButtonInit(); rbLimit.setTextColor(getResources().getColor(android.R.color.secondary_text_dark)); break; case R.id.rbNone: radioButtonInit(); rbNone.setTextColor(getResources().getColor(android.R.color.secondary_text_dark)); break; default: break; } } private void radioButtonInit() { rbAll.setTextColor(getResources().getColor(android.R.color.primary_text_light)); rbLimit.setTextColor(getResources().getColor(android.R.color.primary_text_light)); rbNone.setTextColor(getResources().getColor(android.R.color.primary_text_light)); } }
2、问题
上面的代码运行后效果如下:上面的Hello world!是居左的,但是下面的文字却怎么都不能靠边。试了各种方法都不行。
最后,无意中给RadioButton添加一个backgroud属性即可:
<RadioButton android:id="@+id/rbAll" android:layout_width="match_parent" android:layout_height="wrap_content" android:background="@android:color/white" android:button="@null" android:drawableRight="@drawable/selector_tb" android:text="测试条目一" android:textColor="@android:color/primary_text_light" android:textSize="14sp" />
最后实现了所需效果。
3、总结
虽然效果实现了,但是这个问题一直不明白为什么,怀疑可能是RadioButton没有真正的match_parent。因此写了下面的测试代码:<RadioGroup android:id="@+id/rgRight" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginTop="8dp" android:orientation="vertical" > <RadioButton android:id="@+id/rbAll" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_margin="4dp" android:button="@null" android:drawableRight="@drawable/selector_tb" android:text="测试条目一" android:textColor="@android:color/primary_text_light" android:textSize="14sp" /> <RadioButton android:id="@+id/rbAll" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_margin="4dp" android:paddingLeft="0dp" android:button="@null" android:drawableRight="@drawable/selector_tb" android:text="测试条目一" android:textColor="@android:color/primary_text_light" android:textSize="14sp" /> <RadioButton android:id="@+id/rbLimit" android:layout_width="match_parent" android:layout_height="wrap_content" android:button="@null" android:drawableRight="@drawable/selector_tb" android:paddingLeft="4dp" android:text="测试条目二" android:textColor="@android:color/primary_text_light" android:textSize="14sp" /> <RadioButton android:id="@+id/rbNone" android:layout_width="match_parent" android:layout_height="wrap_content" android:button="@null" android:drawableRight="@drawable/selector_tb" android:padding="0dp" android:text="测试条目三" android:textColor="@android:color/primary_text_light" android:textSize="14sp" /> <RadioButton android:id="@+id/rbNone" android:layout_width="match_parent" android:layout_height="wrap_content" android:background="@android:color/white" android:button="@null" android:drawableRight="@drawable/selector_tb" android:text="测试条目三" android:textColor="@android:color/primary_text_light" android:textSize="14sp" /> </RadioGroup>运行后效果如下:
通过对比,感觉应该是左面有padding。尝试去打印下它的paddingleft:getCompoundPaddingLeft(),得到的结果是76,说明左侧是有边距的。但是,为什么设置background也行呢?高手请指点,谢谢~~
相关文章推荐
- (转)RadioButton左侧显示文字,右侧显示按钮时文字不靠边的问题解决
- RadioButton左侧显示文字及右侧button对齐
- iOS 去掉导航左侧按钮系统默认的文字 只留 默认箭头 (而且解决了 切换应用是 闪桌面的问题)
- 解决在火狐浏览器中文本框和按钮在同行显示不对齐问题
- 解决:swfupload在IE9中不显示上传按钮的问题
- [Android] Android Studio 解决Button按钮文字全大写的问题
- 解决导航问题winform的左侧树控件右侧panel加载用户控件
- Android4.3模拟器界面中右侧菜单按钮无法使用问题解决办法
- 解决IE9下Extjs4文字显示太小问题
- button按钮文字超出范围后省略号在中间的问题解决办法
- highcharts图例文字显示错位的问题解决
- 解决ToolBar中的menu无法同时显示图标和文字的问题
- Android之解决toolbar里面显示返回按钮图片太大和没有水平居中的问题
- 通过弹出菜单和换行方式解决多按钮显示问题
- 解决select选项内容过长,文字显示不全的问题
- 文字显示乱码问题解决
- 解决MFC对话框不显示最小化、最大化和关闭按钮的问题
- 解决input按钮显示差异的问题
- 解决导航问题winform的左侧树控件右侧panel加载用户控件
- ionic 项目在iOS上picker不显示done完成按钮问题解决