Basic knowledge of Android 27: tabhost03 -- Sina Weibo layout Learning -- wonderful use of tabhost

Preface
In order to better develop Android applications, in addition to mastering basic UI components and APIs, you also need to master some skills that can be improved by reading some code, this series will share with you some of the achievements in Sina Weibo's layout. Thank you!
 
Statement
You are welcome to repost, but please keep the original source of the article :)
Blog: http://www.cnblogs.com
Farmer's uncle: http://www.cnblogs.com/over140
 
Version
Sina Weibo weibo_10235010.apk
 
Body

I,

The red part is the goal of this article.
 
II. Implementation
Maintabs. xml

<?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:orientation="vertical"    android:layout_width="fill_parent"    android:layout_height="fill_parent">    <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"    android:background="@drawable/maintab_toolbar_bg"    android:orientation="horizontal"    android:layout_width="fill_parent"    android:layout_height="wrap_content"    android:gravity="center_vertical"    android:layout_gravity="bottom">    <RadioButton     android:layout_marginTop="2.0dip"    android:text="@string/main_home"    android:drawableTop="@drawable/icon_1_n"    android:id="@+id/radio_button0"    style="@style/main_tab_bottom"/>    <RadioButton     android:layout_marginTop="2.0dip"    android:text="@string/main_news"    android:drawableTop="@drawable/icon_2_n"    android:id="@+id/radio_button1"    style="@style/main_tab_bottom"/>    <RadioButton     android:layout_marginTop="2.0dip"    android:text="@string/main_my_info"    android:drawableTop="@drawable/icon_3_n"    android:id="@+id/radio_button2"    style="@style/main_tab_bottom"/>    <RadioButton     android:layout_marginTop="2.0dip"    android:text="@string/menu_search"    android:drawableTop="@drawable/icon_4_n"    android:id="@+id/radio_button3"    style="@style/main_tab_bottom"/>    <RadioButton     android:layout_marginTop="2.0dip"    android:text="@string/more"    android:drawableTop="@drawable/icon_5_n"    android:id="@+id/radio_button4"    style="@style/main_tab_bottom"/>    </RadioGroup>    </LinearLayout></TabHost>

Styles. xml

<?xml version="1.0" encoding="utf-8"?><resources><style name="main_tab_bottom"><item name="android:textSize">@dimen/bottom_tab_font_size</item>    <item name="android:textColor">#ffffffff</item>    <item name="android:ellipsize">marquee</item>    <item name="android:gravity">center_horizontal</item>    <item name="android:background">@drawable/home_btn_bg</item>    <item name="android:paddingTop">@dimen/bottom_tab_padding_up</item>    <item name="android:layout_width">fill_parent</item>    <item name="android:layout_height">wrap_content</item>    <item name="android:button">@null</item>    <item name="android:singleLine">true</item>    <item name="android:drawablePadding">@dimen/bottom_tab_padding_drawable</item>    <item name="android:layout_weight">1.0</item></style></resources>

Home_btn_bg.xml

<?xml version="1.0" encoding="UTF-8"?><selector  xmlns:android="http://schemas.android.com/apk/res/android">    <item android:state_focused="true" android:state_enabled="true" android:state_pressed="false" android:drawable="@drawable/home_btn_bg_s" />    <item android:state_enabled="true" android:state_pressed="true" android:drawable="@drawable/home_btn_bg_s" />    <item android:state_enabled="true" android:state_checked="true" android:drawable="@drawable/home_btn_bg_d" />    <item android:drawable="@drawable/transparent" /></selector>

Code Description:
1. It should be noted that the visibility of tabwidget is set to gone! That is, the ugly style is gone by default: instead, five radio buttons with style are replaced.
2. Pay attention to the style set for the single-choice button. The most important thing is to set home_btn_bg.xml for its background, that is, to customize the selected effect.
Java files

package com.loulijun.demo2;import android.app.TabActivity;import android.content.Intent;import android.os.Bundle;import android.view.Window;import android.widget.RadioGroup;import android.widget.TabHost;import android.widget.RadioGroup.OnCheckedChangeListener;public class MainTabActivity extends TabActivity implements OnCheckedChangeListener{private RadioGroup mainTab;private TabHost tabhost;private Intent iHome;private Intent iNews;private Intent iInfo;private Intent iSearch;private Intent iMore;    @Override    public void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        requestWindowFeature(Window.FEATURE_NO_TITLE);        setContentView(R.layout.main);        mainTab=(RadioGroup)findViewById(R.id.main_tab);        mainTab.setOnCheckedChangeListener(this);        tabhost = getTabHost();                iHome = new Intent(this, HomeActivity.class);        tabhost.addTab(tabhost.newTabSpec("iHome")        .setIndicator(getResources().getString(R.string.main_home), getResources().getDrawable(R.drawable.icon_1_n))        .setContent(iHome));        iNews = new Intent(this, NewsActivity.class);tabhost.addTab(tabhost.newTabSpec("iNews")        .setIndicator(getResources().getString(R.string.main_news), getResources().getDrawable(R.drawable.icon_2_n))        .setContent(iNews));iInfo = new Intent(this, MyInfoActivity.class);tabhost.addTab(tabhost.newTabSpec("iInfo")        .setIndicator(getResources().getString(R.string.main_my_info), getResources().getDrawable(R.drawable.icon_3_n))        .setContent(iInfo));iSearch = new Intent(this,SearchActivity.class);tabhost.addTab(tabhost.newTabSpec("iSearch")        .setIndicator(getResources().getString(R.string.menu_search), getResources().getDrawable(R.drawable.icon_4_n))        .setContent(iSearch));iMore = new Intent(this, MoreActivity.class); tabhost.addTab(tabhost.newTabSpec("iMore")        .setIndicator(getResources().getString(R.string.more), getResources().getDrawable(R.drawable.icon_5_n))        .setContent(iMore));    }   @Overridepublic void onCheckedChanged(RadioGroup group, int checkedId) {switch(checkedId){case R.id.radio_button0:this.tabhost.setCurrentTabByTag("iHome");break;case R.id.radio_button1:this.tabhost.setCurrentTabByTag("iNews");break;case R.id.radio_button2:this.tabhost.setCurrentTabByTag("iInfo");break;case R.id.radio_button3:this.tabhost.setCurrentTabByTag("iSearch");break;case R.id.radio_button4:this.tabhost.setCurrentTabByTag("iMore");break;}}        }

Code Description
1. Because the tabwidget is hidden, related events will also be invalid. Here we use the radiogroup and radiobutton features to handle the switchover, and then listen to the event and call setcurrenttabbytag to switch the activity.
2. You must set indicator for tabwidget even if it is hidden. Otherwise, it will be maintained.
 
Iii. Summary
Before that, I am afraid I will think of using activitygroup for the first time, mainly because the tabwidget of tabhost is very ugly and inconvenient to use. In fact, we can see from the source code that tabactivity also inherits from activitygroup. Here we use single-choice buttons and tabhost to separate them for a long time. We can write such a custom control for time :)

Code address:Various tabhost instances and usage in Android

References:

Sina Weibo layout learning-use tabhost

[Android] Use activitygroup to switch between activity and Layout