Android TabHost详解及事例(选项卡)


Android TabHost的写法基本是固定的,注意:id必须是固定的,是死的,不然异常

TabHost分三部分:

1.Tabhost android:id=”@android:id/tabhost”
2.TabWidget android:id=”@android:id/tabs”
3.FrameLayout android:id=”@android:id/tabcontent”

好了,思想+代码。

layout代码:

<TabHost
            android:id="@android:id/tabhost"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="@color/white">
            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:orientation="vertical">
                <TabWidget
                    android:id="@android:id/tabs"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"/>
                <FrameLayout
                    android:id="@android:id/tabcontent"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent">
                    <LinearLayout
                        android:id="@+id/now_update"
                        android:orientation="vertical"
                        android:layout_width="match_parent"
                        android:layout_height="match_parent"
                        android:background="@color/red_hot">
                    </LinearLayout>
                    <LinearLayout
                        android:id="@+id/today_choose"
                        android:orientation="vertical"
                        android:layout_width="match_parent"
                        android:layout_height="match_parent"
                        android:background="@color/red_hot">
                    </LinearLayout>
                    <LinearLayout
                        android:id="@+id/good_choose"
                        android:orientation="vertical"
                        android:layout_width="match_parent"
                        android:layout_height="match_parent"
                        android:background="@color/red_hot">
                    </LinearLayout>
                </FrameLayout>
            </LinearLayout>
        </TabHost>

Activity代码:

public class StoryHallActivity extends TabActivity {
    private TabHost tabHost;
    private TabWidget tabWidget;
    private TabHostSettingsClass tabHostSettingsClass;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_story_hall);
        findView();
        initView();
    }

    private void findView() {
        tabHost= (TabHost) findViewById(android.R.id.tabhost);
        tabWidget= (TabWidget) findViewById(android.R.id.tabs);
    }

    private void initView() {
        TabHostClass tabHostClass=new TabHostClass(tabHost,R.id.now_update,R.id.today_choose,R.id.good_choose,"最新更新","今日推荐","精彩推荐");
        tabHostClass.setTabHost();
        tabHostSettingsClass=new TabHostSettingsClass(StoryHallActivity.this,tabHost,tabWidget);
        tabHostSettingsClass.setChangeTabSetting();
        tabHost.setOnTabChangedListener(new TabHost.OnTabChangeListener() {
            @Override
            public void onTabChanged(String s) {
                tabHostSettingsClass.setChangeTabSetting();
            }
        });
    }
}

TabHost添加代码:

public class TabHostClass {
    private TabHost tabHost;
    private String one;
    private String two;
    private String three;
    private int v1;
    private int v2;
    private int v3;
    public TabHostClass(TabHost tabHost,int v1,int v2,int v3,String one,String two ,String three) {
        this.tabHost=tabHost;
        this.one=one;
        this.two=two;
        this.three=three;
        this.v1=v1;
        this.v2=v2;
        this.v3=v3;
    }

    public  void setTabHost(){
        tabHost.setup();
        tabHost.addTab(tabHost.newTabSpec("one").setContent(v1).setIndicator(one));
        tabHost.addTab(tabHost.newTabSpec("two").setContent(v2).setIndicator(two));
        tabHost.addTab(tabHost.newTabSpec("three").setContent(v3).setIndicator(three));
    }
}

注意:封装TabHost类

设置选中不选中时的字体颜色和背景代码:

public class TabHostSettingsClass {
    private TabHost tabHost;
    private TabWidget tabWidget;
    private Context context;
    public TabHostSettingsClass(Context context,TabHost tabHost,TabWidget tabWidget) {
        this.context=context;
        this.tabHost=tabHost;
        this.tabWidget=tabWidget;
    }
    public void setChangeTabSetting(){
        for (int i = 0; i < tabWidget.getChildCount(); i++) {
            TextView tView = (TextView) tabWidget.getChildAt(i).findViewById(
                    android.R.id.title);
            //修改背景
            tabWidget.getChildAt(i).setBackgroundResource(
                    R.drawable.tabhost_bg);
            tView.setTextSize(16);
            //字体
            tView.setTypeface(Typeface.DEFAULT);
            if (tabHost.getCurrentTab() == i) {
                tView.setTextColor(context.getResources().getColorStateList(
                        android.R.color.holo_red_light));
            } else {
                tView.setTextColor(context.getResources().getColorStateList(
                        android.R.color.darker_gray));
            }
        }
    }
}

注意:上面的是封装的选中不选中的字体和背景的方法

background(背景)代码:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- Non focused states -->
    <item android:state_focused="false" android:state_selected="false" android:state_pressed="false" android:drawable="@android:color/white" />
    <item android:state_focused="false" android:state_selected="true"  android:state_pressed="false" android:drawable="@android:color/white" />

    <!-- Focused states -->
    <item android:state_focused="true" android:state_selected="false" android:state_pressed="false" android:drawable="@android:color/white" />
    <item android:state_focused="true" android:state_selected="true"  android:state_pressed="false" android:drawable="@android:color/white" />

    <!-- Pressed -->
    <!--    Non focused states -->
    <item android:state_focused="false" android:state_selected="false" android:state_pressed="true" android:drawable="@android:color/white" />
    <item android:state_focused="false" android:state_selected="true"  android:state_pressed="true" android:drawable="@android:color/white" />

    <!--    Focused states -->
    <item android:state_focused="true" android:state_selected="false" android:state_pressed="true" android:drawable="@android:color/white" />
    <item android:state_focused="true" android:state_selected="true"  android:state_pressed="true" android:drawable="@android:color/white" />
</selector>

注意:自己修改即可

关于在TabHost下面的页面,可在layout中的3个LinearLayout下添加。

方法1.直接写(不建议,太多乱)

方法2.include引用进来(独立)

发表评论

邮箱地址不会被公开。 必填项已用*标注

昵称 *