android UI - 仿威信tab样式
16lz
2021-01-26
由于前段时间工作比较忙，前面的api demo的学习耽误了一段时间，忙里偷闲分享一个威信UI的例子
效果图：
其实现原理就是 TabHost +RadioButton
1、首先来看下layout文件
<?xml version="1.0" encoding="utf-8"?><TabHost xmlns:android="http://schemas.android.com/apk/res/android" android:id="@android:id/tabhost" android:layout_width="fill_parent" android:layout_height="fill_parent" > <LinearLayout android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="vertical" > <FrameLayout android:id="@android:id/tabcontent" android:layout_width="fill_parent" android:layout_height="0.0dip" android:layout_weight="1.0" /> <TabWidget android:id="@android:id/tabs" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_weight="0.0" android:visibility="gone" /> <RadioGroup android:id="@id/main_tab_group" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_gravity="bottom" android:background="@drawable/mmfooter_bg" android:gravity="bottom" android:orientation="horizontal" android:paddingTop="2.0dip" > <RadioButton android:id="@id/main_tab_weixin" style="@style/MMTabButton" android:checked="true" android:drawableTop="@drawable/tab_weixin" android:text="@string/main_title" /> <RadioButton android:id="@id/main_tab_address" style="@style/MMTabButton" android:drawableTop="@drawable/tab_address" android:text="@string/main_contact" /> <RadioButton android:id="@id/main_tab_find_friend" style="@style/MMTabButton" android:drawableTop="@drawable/tab_find_frd" android:text="@string/main_addcontact" /> <RadioButton android:id="@id/main_tab_settings" style="@style/MMTabButton" android:drawableTop="@drawable/tab_settings" android:text="@string/main_setting" /> </RadioGroup> </LinearLayout></TabHost>
2、接下来中电看RadioButton的各个属性
style属性引用的样式：
<style name="MMTabButton"> <item name="android:textSize">12.0dip</item> <item name="android:textColor">@color/mm_tab_btn</item> <item name="android:gravity">center_horizontal</item> <item name="android:background">@drawable/tab_bg</item> <item name="android:layout_width">0.0dip</item> <item name="android:layout_height">wrap_content</item><item name="android:layout_marginLeft">0.70000005dip</item> <item name="android:layout_marginRight">0.70000005dip</item> <item name="android:button">@null</item> <item name="android:layout_weight">1.0</item> </style>其中background<?xml version="1.0" encoding="utf-8"?><selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:state_pressed="true" android:drawable="@drawable/tab_bg_halo"/> <item android:state_selected="true" android:drawable="@drawable/tab_bg_halo"/> <item android:state_enabled="true" android:state_checked="true" android:drawable="@drawable/tab_bg_halo" /> <item android:drawable="@drawable/mm_trans" /></selector>
drawabletop属性
<?xml version="1.0" encoding="utf-8"?><selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:state_pressed="true" android:drawable="@drawable/tab_weixin_pressed"/> <item android:state_selected="true" android:drawable="@drawable/tab_weixin_pressed"/> <item android:state_enabled="true" android:state_checked="true" android:drawable="@drawable/tab_weixin_pressed" /> <item android:drawable="@drawable/tab_weixin_normal" /></selector>
至此界面效果完成
感兴趣的同学可以下载附件仔细研究。
注意：源码来自 微度网 苗条的胖子
更多相关文章
- android中配置文件property的用途以及使用
- android的Jetpack的navigation原理详解
- android的莫名其妙的事
- Android图形动画概述
- 自定义android Rating bar
- Android(安卓)- shape不完整的圆环(ring)
- Android自定义控件的实现
- Android(安卓)Material Design新UI控件使用大全 三
- Android(安卓)Design Support Library 控件的使用