【Android】模拟Android微信APK底部的TabHost选项卡
16lz
2021-01-26
资源准备
下载一个微信apk,解压,并找出所需的资源图片。layout中XML布局
<?xml version="1.0" encoding="UTF-8"?><!-- Tab导航 最新版 --><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" ><RelativeLayoutandroid:layout_width="fill_parent"android:layout_height="wrap_content"android:orientation="vertical"><FrameLayoutandroid:id="@android:id/tabcontent"android:layout_width="fill_parent"android:layout_height="fill_parent"android:background="#FFF" ></FrameLayout><!-- TabWidget管理所有的选项卡,id名是android指定的 --><TabWidgetandroid:id="@android:id/tabs"android:layout_width="fill_parent"android:layout_height="fill_parent"android:visibility="gone" /><!-- Frame下放置单选群组替代TAB效果 --><RadioGroupandroid:id="@+id/main_radio"android:layout_width="fill_parent"android:layout_height="wrap_content"android:background="#ccc"android:gravity="center_vertical"android:orientation="horizontal"android:layout_alignParentBottom="true" ><RadioButtonandroid:id="@+id/tab_icon_weixin"style="@style/main_tab_bottom"android:checked="true"android:drawableTop="@drawable/tab_weixin_normal"android:text="微信" /><RadioButtonandroid:id="@+id/tab_icon_address"style="@style/main_tab_bottom"android:checked="false"android:drawableTop="@drawable/tab_address_normal"android:text="通讯录" /><RadioButtonandroid:id="@+id/tab_icon_find"style="@style/main_tab_bottom"android:drawableTop="@drawable/tab_find_frd_normal"android:text="发现" /><RadioButtonandroid:id="@+id/tab_icon_myself"style="@style/main_tab_bottom"android:drawableTop="@drawable/tab_settings_normal"android:text="我" /></RadioGroup></RelativeLayout></TabHost>
style中XML文档
<!-- MainTab选项卡中单选按钮的样式,其中包括了文本、selector、padding、宽高、权重等的设置 --> <style name="main_tab_bottom"> <item name="android:textSize">13sp</item> <item name="android:textColor">#666666</item> <item name="android:gravity">center_horizontal</item> <!-- 该处引用drawable下面的一个xml文档(selector) --> <item name="android:paddingTop">5dp</item> <item name="android:layout_width">fill_parent</item> <item name="android:layout_height">wrap_content</item> <item name="android:layout_weight">1.0</item> <!-- 每个按钮的权重,相等则平分尺寸 --> <item name="android:button">@null</item> <!-- 隐藏单选按钮 --> <item name="android:layout_marginTop">1.0dip</item> <item name="android:paddingBottom">5.0dip</item> </style>
Activity中Java文件
package com.app;import android.app.AlertDialog;import android.app.TabActivity;import android.content.DialogInterface;import android.content.Intent;import android.os.Bundle;import android.view.KeyEvent;import android.view.View;import android.widget.RadioButton;import android.widget.RadioGroup;import android.widget.TabHost;import android.widget.TextView;import android.widget.Toast;import android.widget.TabWidget;/** * Tab导航 *///public class Tabs extends TabActivity implements View.OnClickListener{public class Tabs extends TabActivity{public static TabHost mTabHost;public static TabHost getmTabHost() {return mTabHost;}private RadioGroup main_radio;private RadioButton tab_icon_weixin, tab_icon_address, tab_icon_find,tab_icon_myself;/** Called when the activity is first created. */@Overridepublic void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.tabs);mTabHost = getTabHost();final TabWidget tabWidget = mTabHost.getTabWidget();tabWidget.setStripEnabled(false);// 圆角边线不启用//添加n个tab选项卡,定义他们的tab名,指示名,目标屏对应的类mTabHost.addTab(mTabHost.newTabSpec("TAG1").setIndicator("0").setContent(new Intent(this, WeixinActivity.class)));mTabHost.addTab(mTabHost.newTabSpec("TAG2").setIndicator("1").setContent(new Intent(this, AddressActivity.class)));mTabHost.addTab(mTabHost.newTabSpec("TAG3").setIndicator("2").setContent(new Intent(this, FindActivity.class)));mTabHost.addTab(mTabHost.newTabSpec("TAG4").setIndicator("3").setContent(new Intent(this, MyselfActivity.class)));// 视觉上,用单选按钮替代TabWidgetmain_radio = (RadioGroup) findViewById(R.id.main_radio);tab_icon_weixin = (RadioButton) findViewById(R.id.tab_icon_weixin);tab_icon_address = (RadioButton) findViewById(R.id.tab_icon_address);tab_icon_find = (RadioButton) findViewById(R.id.tab_icon_find);tab_icon_myself = (RadioButton) findViewById(R.id.tab_icon_myself);main_radio.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener() {@Overridepublic void onCheckedChanged(RadioGroup group, int id) {if (id == tab_icon_weixin.getId()) {mTabHost.setCurrentTab(0);} else if (id == tab_icon_address.getId()) {mTabHost.setCurrentTab(1);} else if (id == tab_icon_find.getId()) {mTabHost.setCurrentTab(2);} else if (id == tab_icon_myself.getId()) {mTabHost.setCurrentTab(3);}}});// 设置当前显示哪一个标签mTabHost.setCurrentTab(0);// 遍历tabWidget每个标签,设置背景图片 无for (int i = 0; i < tabWidget.getChildCount(); i++) {View vv = tabWidget.getChildAt(i);vv.getLayoutParams().height = 45;// vv.getLayoutParams().width = 65;vv.setBackgroundDrawable(null);}//findViewById(R.id.tab_icon_brand).setOnClickListener(this);}}
效果图
更多相关文章
- Android布局绘制常见小问题
- 【Android(安卓)初学】4、RadioButton & CheckBox
- Android中使用achartengine生成图表
- Android(安卓)ImageView 图片设置为透明
- Android布局管理器-使用LinearLayout实现简单的登录窗口布局
- Android(安卓)RecyclerView设置多选
- Android(安卓)设置EditText的DrawableRight和DrawableLeft 的通
- Android添加权限AndroidManifes.xml
- android webview 显示不出来