前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >选项卡(TabHost)使用

选项卡(TabHost)使用

作者头像
李小白是一只喵
发布2020-04-24 08:35:00
1.8K0
发布2020-04-24 08:35:00
举报
文章被收录于专栏:算法微时光算法微时光

image.png

目录

TabHost

TabHost实现Tab切换, 实现类似通话记录界面的切换效果.

使用方式: 从TabActivity中用getTabHost()方法获取TabHost,然后设置标签内容

布局:

  1. TabHost必须设置android:id为@android:id/tabhost
  2. TabWidget必须设置android:id为@android:id/tabs
  3. FrameLayout必须设置android:id为@android:id/tabcontent

实战

activity_main.xml文件:

代码语言:javascript
复制
<TabHost
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@android:id/tabhost"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_weight="1">

    <LinearLayout
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <!-- TabWidget组件id值不可变-->
        <TabWidget
            android:id="@android:id/tabs"
            android:layout_width="match_parent"
            android:layout_height="wrap_content">
        </TabWidget>

        <!-- FrameLayout布局,id值不可变-->
        <FrameLayout
            android:id="@android:id/tabcontent"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_above="@android:id/tabs">


            <!-- 第一个tab的布局 -->
            <LinearLayout
                android:id="@+id/tab1"
                android:layout_width="match_parent"
                android:layout_height="match_parent" >

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="第一个tab的布局" />
            </LinearLayout>


            <!-- 第二个tab的布局 -->
            <LinearLayout
                android:id="@+id/tab2"
                android:layout_width="match_parent"
                android:layout_height="match_parent" >


                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="第二个tab的布局" />
            </LinearLayout>

            <!-- 第二个tab的布局 -->
            <LinearLayout
                android:id="@+id/tab3"
                android:layout_width="match_parent"
                android:layout_height="match_parent" >


                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="第三个tab的布局" />
            </LinearLayout>


        </FrameLayout>
    </LinearLayout>
</TabHost>

代码:

代码语言:javascript
复制
package com.example.user.tabhost;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.TabHost;

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        TabHost tab = (TabHost) findViewById(android.R.id.tabhost);

        //初始化TabHost容器
        tab.setup();
        //在TabHost创建标签,然后设置:标题/图标/标签页布局
        tab.addTab(tab.newTabSpec("tab1").setIndicator("未接来电" , null).setContent(R.id.tab1));
        tab.addTab(tab.newTabSpec("tab2").setIndicator("已接来电" , null).setContent(R.id.tab2));
        tab.addTab(tab.newTabSpec("tab3").setIndicator("呼出通话" , null).setContent(R.id.tab3));

    }
}

运行效果:

image.png

参考

Android选项卡TabHost功能和用法

本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 目录
  • TabHost
  • 实战
  • 参考
相关产品与服务
容器服务
腾讯云容器服务(Tencent Kubernetes Engine, TKE)基于原生 kubernetes 提供以容器为核心的、高度可扩展的高性能容器管理服务,覆盖 Serverless、边缘计算、分布式云等多种业务部署场景,业内首创单个集群兼容多种计算节点的容器资源管理模式。同时产品作为云原生 Finops 领先布道者,主导开源项目Crane,全面助力客户实现资源优化、成本控制。
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档