[Android Basics] TabWidget sets the background and font, androidtabwidget

[Android Basics] TabWidget sets the background and font, androidtabwidget

When TabHost is used to implement the bottom navigation bar, the three navigation buttons in the bottom navigation bar cannot be customized in the layout file, such as setting the color, font size, and color when clicking, A solution is provided here, that is, to customize the code.

The idea is to add pagination to the TabHost in the Activity, and add special effects one by one in the navigation bar TabWidget navigation buttons (you must add pagination before customizing the buttons and adding a pagination, to generate a button ).

The layout file activity_main.xml contains TabHost, which contains three tabs that only show text.

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:id="@+id/container"    android:layout_width="match_parent"    android:layout_height="wrap_content"    android:orientation="vertical"    tools:context="com.plan.MainActivity"    tools:ignore="MergeRootFrame" >    <TabHost        android:id="@android:id/tabhost"        android:layout_width="fill_parent"        android:layout_height="fill_parent"        android:layout_alignParentLeft="true"        android:layout_alignParentTop="true" >        <LinearLayout            android:layout_width="match_parent"            android:layout_height="fill_parent"            android:orientation="vertical" >            <FrameLayout                android:id="@android:id/tabcontent"                android:layout_width="match_parent"                android:layout_height="fill_parent"                android:layout_weight="0.8" >                <LinearLayout                    android:id="@+id/tab1"                    android:layout_width="match_parent"                    android:layout_height="match_parent"                    android:orientation="vertical" >                    <TextView                        android:id="@+id/textView1"                        android:layout_width="wrap_content"                        android:layout_height="wrap_content"                        android:text="tab1" />                </LinearLayout>                <LinearLayout                    android:id="@+id/tab2"                    android:layout_width="match_parent"                    android:layout_height="match_parent"                    android:orientation="vertical" >                    <TextView                        android:id="@+id/textView2"                        android:layout_width="wrap_content"                        android:layout_height="wrap_content"                        android:text="tab2" />                </LinearLayout>                <LinearLayout                    android:id="@+id/tab3"                    android:layout_width="match_parent"                    android:layout_height="match_parent"                    android:orientation="vertical" >                    <TextView                        android:id="@+id/textView3"                        android:layout_width="wrap_content"                        android:layout_height="wrap_content"                        android:text="tab3" />                </LinearLayout>            </FrameLayout>            <TabWidget                android:id="@android:id/tabs"                android:layout_width="match_parent"                android:layout_height="wrap_content" >            </TabWidget>        </LinearLayout>    </TabHost></RelativeLayout>

The code in MainActivity is as follows:

Package com. aiplan_03; import android. app. activityGroup; import android. graphics. color; import android. OS. bundle; import android. util. log; import android. widget. tabHost; import android. widget. tabWidget; import android. widget. textView; public class MainActivity extends ActivityGroup {TabHost mTabHost = null; TabWidget mTabWidget = null; // TabWidget control @ Override protected void onCreate (Bundle savedInstanceState) {super. onCreate (savedInstanceState); setContentView (R. layout. activity_main); mTabHost = (TabHost) findViewById (android. r. id. tabhost); mTabHost. setup (this. getLocalActivityManager (); // you can call this operation to obtain the widget mTabWidget = mTabHost. getTabWidget (); // Add page 1 mTabHost. addTab (mTabHost. newTabSpec ("button1 "). setContent (R. id. tab1 ). setIndicator ("btn1"); // Add page 2 mTabHost. addTab (mTabHost. newTabSpec ("button2 "). setContent (R. id. tab2 ). setIndicator ("btn2"); // Add page 3 mTabHost. addTab (mTabHost. newTabSpec ("button3 "). setContent (R. id. tab3 ). setIndicator ("btn3"); Log. d ("Number of buttons", Integer. toString (mTabWidget. getChildCount (); // Add special effects for (int I = 0; I <mTabWidget. getChildCount (); I ++) {// change the font color TextView TV = (TextView) mTabWidget. getChildAt (I ). findViewById (android. r. id. title); TV. setTextColor (Color. rgb (255,255,255); // sets the background image mTabWidget. getChildAt (I ). setBackgroundResource (R. drawable. tabwidget_selector );}}}

The font of the navigation button is changed to white, and a selector is added to the background of the navigation button. The following is the selector code:
Tabwidget_selector.xml, which must be placed in the drawable folder

<?xml version="1.0" encoding="utf-8"?><selector xmlns:android="http://schemas.android.com/apk/res/android" >    <item     android:state_selected="false"     android:drawable="@color/tabwidget_unselected"     />     <item     android:state_selected="true"     android:drawable="@color/tabwidget_selected" /> </selector>

Two colors are used in it. The following is color. xml, which must be placed in the values folder.

<resources xmlns:android="http://schemas.android.com/apk/res/android">    <color name="tabwidget_selected">#ff2222</color>    <color name="tabwidget_unselected">#000000</color></resources>

The last one is as follows:

Copyright Disclaimer: This article is an original article by the blogger and cannot be reproduced without the permission of the blogger.