效果图如下:
实现方式:利用RadioButton单选功能来实现,我们只需要更改选择与为选择时的背景颜色及字体颜色即可。
item_selet_layout文件:
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" > <RadioGroup android:id="@+id/radiogroup" android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="horizontal" > <RadioButton style="@style/tabhost_left_style" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_weight="1" android:gravity="center" android:padding="10dp" android:text="待审核" /> <RadioButton style="@style/tabhost_center_style" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_weight="1" android:gravity="center" android:padding="10dp" android:text="已审核" /> <RadioButton style="@style/tabhost_right_style" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_weight="1" android:gravity="center" android:padding="10dp" android:text="我的" /> </RadioGroup> </LinearLayout>
TabHostSelector继承LinearLayout:
public class TabHostSelector extends LinearLayout{ public TabHostSelector(Context context, AttributeSet attrs) { super(context, attrs); init(context); } private void init(Context context){ View view = LayoutInflater.from(context).inflate(R.layout.item_select_layout, null); RadioGroup radioGroup = (RadioGroup) view.findViewById(R.id.radiogroup); radioGroup.setOnCheckedChangeListener(new OnCheckedChangeListener() { @Override public void onCheckedChanged(RadioGroup group, int checkedId) { Utils.showToast(getContext(), checkedId+""); switch (checkedId) { case 1: break; case 2: break; case 3: break; default: break; } } }); radioGroup.check(2); LinearLayout.LayoutParams ll = new LayoutParams(new LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.WRAP_CONTENT)); this.addView(view,ll); }
由于三个选项,左右两个上下角由弧度,于是定义了三个style,分别控制角度。
<style name="tabhost_center_style" parent="@android:style/Widget.CompoundButton.RadioButton"> <item name="android:button">@null</item> <item name="android:textSize">18sp</item> <item name="android:textColor">@color/tabhost_textcolor_selector</item> <item name="android:background">@drawable/tabhost_center_elector</item> </style> <style name="tabhost_left_style" parent="@android:style/Widget.CompoundButton.RadioButton"> <item name="android:button">@null</item> <item name="android:textSize">18sp</item> <item name="android:textColor">@color/tabhost_textcolor_selector</item> <item name="android:background">@drawable/tabhost_left_elector</item> </style> <style name="tabhost_right_style" parent="@android:style/Widget.CompoundButton.RadioButton"> <item name="android:button">@null</item> <item name="android:textSize">18sp</item> <item name="android:textColor">@color/tabhost_textcolor_selector</item> <item name="android:background">@drawable/tabhost_right_elector</item> </style>
res/color/color/tabhost_textcolor_selector:控制文字选中时改变成白色,未选中为黑色。 图:
xml代码:
<?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:state_checked="true" android:color="@android:color/white" /> <item android:color="@android:color/black"></item> </selector> 这里设置字体颜色会出现很多问题,期初用其他方式来实现,始终无效,后来看到这种方式,可以实现。在res文件夹下面新建一个color文件夹,把字体颜色selector文件放在里面。
背景色的变换:
tabhost_right_elector.xml
<?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:state_checked="true"><shape> <solid android:color="@color/tabhost_selected" /> <stroke android:width="1dp" android:color="@color/tabhost_selected" /> <corners android:bottomRightRadius="2dp" android:topRightRadius="2dp" /> </shape></item> <item android:state_checked="false"><shape> <solid android:color="@android:color/white" /> <corners android:bottomRightRadius="2dp" android:topRightRadius="2dp" /> <stroke android:width="1dp" android:color="@color/tabhost_selected" /> </shape></item> </selector>
时间: 2024-10-12 09:09:04