TabHost详解

article/2025/9/9 0:57:17

前言:今天仔细研究了下TabHost,主要是为了实现微信底部导航栏的功能,最后也给出一个链接,这位老兄用TabHost基本做出来了微信导航栏。

正文

TabHost的实现分为两种,一个是不继承TabActivity,一个是继承自TabActivity;当然了选用继承自TabActivity的话就相对容易一些,下面来看看分别是怎样来实现的吧。

方法一、定义tabhost:不用继承TabActivity

 1、布局文件:activity_main.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent" 
android:orientation="vertical"
tools:context=".MainActivity" >
<Button
android:id="@+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button" />
<TabHost
android:id="@+id/tabhost"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<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" >
</TabWidget>
<FrameLayout
android:id="@android:id/tabcontent"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<!-- 第一个tab的布局 -->
<LinearLayout
android:id="@+id/tab1"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<TextView
android:id="@+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="林炳东" />
</LinearLayout>
<!-- 第二个tab的布局 -->
<LinearLayout
android:id="@+id/tab2"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<TextView
android:id="@+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="张小媛" />
</LinearLayout>
<!-- 第三个tab的布局 -->
<LinearLayout
android:id="@+id/tab3"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<TextView
android:id="@+id/textView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="马贝贝" />
</LinearLayout>
</FrameLayout>
</LinearLayout>
</TabHost> 
</LinearLayout>

2、JAVA代码

public class MainActivity extends Activity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
TabHost th=(TabHost)findViewById(R.id.tabhost);
th.setup();            //初始化TabHost容器
//在TabHost创建标签,然后设置:标题/图标/标签页布局
th.addTab(th.newTabSpec("tab1").setIndicator("标签1",getResources().getDrawable(R.drawable.ic_launcher)).setContent(R.id.tab1));
th.addTab(th.newTabSpec("tab2").setIndicator("标签2",null).setContent(R.id.tab2));
th.addTab(th.newTabSpec("tab3").setIndicator("标签3",null).setContent(R.id.tab3));	
//上面的null可以为getResources().getDrawable(R.drawable.图片名)设置图标 
}
}

效果图:

此例源码地址:http://download.csdn.net/detail/harvic880925/6657611  (不要分,欢迎下载)

 方法二:Tab的内容分开:不用继承TabActivity

 1、第一个tab的XML布局文件,tab1.xml:

<?xml version="1.0" encoding="UTF-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/LinearLayout01" 
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<TextView 
android:text="我是标签1的内容喔"
android:id="@+id/TextView01" 
android:layout_width="wrap_content"
android:layout_height="wrap_content">
</TextView>
</LinearLayout>

2、第二个tab的XML布局文件,tab2.xml: 

<?xml version="1.0" encoding="UTF-8"?>
<LinearLayout  xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/LinearLayout02"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<TextView android:text="标签2"
android:id="@+id/TextView01" 
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>

3、主布局文件,activity_main.xml:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<TabHost
android:id="@+id/tabhost"         
android:layout_width="match_parent"
android:layout_height="match_parent" >
<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" >
</TabWidget>
<FrameLayout
android:id="@android:id/tabcontent"
android:layout_width="match_parent"
android:layout_height="match_parent" >
</FrameLayout>
</LinearLayout>
</TabHost>
</LinearLayout>

4、JAVA代码:

public class MainActivity extends Activity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
TabHost m = (TabHost)findViewById(R.id.tabhost);
m.setup();
LayoutInflater i=LayoutInflater.from(this);
i.inflate(R.layout.tab1, m.getTabContentView());
i.inflate(R.layout.tab2, m.getTabContentView());//动态载入XML,而不需要Activity
m.addTab(m.newTabSpec("tab1").setIndicator("标签1").setContent(R.id.LinearLayout01));  
m.addTab(m.newTabSpec("tab2").setIndicator("标签2").setContent(R.id.LinearLayout02)); 
}
}

效果图:

此例源码地址:http://download.csdn.net/detail/harvic880925/6657679   (不要分,欢迎下载)

 方法三:继承自TabActivity

1、主布局文件,activity_main.xml:

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<!-- 第一个布局 -->
<LinearLayout   
android:id="@+id/view1"
android:layout_width="match_parent"
android:layout_height="match_parent" >      
<TextView
android:id="@+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="张小媛" />
</LinearLayout>
<!-- 第二个布局 -->
<LinearLayout   
android:id="@+id/view2"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<TextView
android:id="@+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="马贝贝" />
</LinearLayout>
<!-- 第三个布局 -->
<TextView android:id="@+id/view3" 
android:background="#00ff00"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:text="Tab3"/>
</FrameLayout>

2、JAVA代码: 

 先将派生自Activity改为TabActivity,然后代码如下:

 

public class MainActivity extends TabActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setTitle("TabDemoActivity");
TabHost tabHost = getTabHost();
LayoutInflater.from(this).inflate(R.layout.activity_main,
tabHost.getTabContentView(), true);
tabHost.addTab(tabHost.newTabSpec("tab1").setIndicator("tab1", getResources().getDrawable(R.drawable.ic_launcher))
.setContent(R.id.view1));
tabHost.addTab(tabHost.newTabSpec("tab3").setIndicator("tab2")
.setContent(R.id.view2));
tabHost.addTab(tabHost.newTabSpec("tab3").setIndicator("tab3")
.setContent(R.id.view3));
//标签切换事件处理,setOnTabChangedListener
tabHost.setOnTabChangedListener(new OnTabChangeListener(){  
@Override
public void onTabChanged(String tabId) {
if (tabId.equals("tab1")) {   //第一个标签
}
if (tabId.equals("tab2")) {   //第二个标签
}
if (tabId.equals("tab3")) {   //第三个标签
}
}            
}); 
}
}

效果如下:

 

此例源码地址:http://download.csdn.net/detail/harvic880925/6657791   (不要分,仅供分享)

 四:实现微信底部导航栏

效果:

 

参看博客:http://blog.csdn.net/wangkuifeng0118/article/details/7745109

 源码地址:http://download.csdn.net/detail/harvic880925/6657767   (不要分,仅供分享)

 

 请大家尊重作者版权,转载请标明出处:http://blog.csdn.net/harvic880925/article/details/17120325

 


http://chatgpt.dhexx.cn/article/glkTcEd0.shtml

相关文章

Android选项卡TabHost功能和用法

1、选项卡TabHost介绍 TabHost可以方便地在窗口上放置多个标签页&#xff0c;每个标签页相当于获得了一个与外部容器大小相同的组件摆放区域 TabHost是一个简单的容器&#xff0c;提供如下两种方法来创建选项卡 newTabSpec(String tag):创建选项卡 addTab(TabHost.TabSpec tabS…

[Android] 选项卡组件TabHost

Tab选项卡实现多个分页之间的快速切换&#xff0c;每个分页可以显示不同的内容&#xff0c;在Android平台提供了TabHost组件实现Tab选项卡的功能&#xff0c;选项卡组件的主要功能是可以进行应用程序分类管理。 每个选项卡称为一个Tab&#xff0c;而包含这多个选项卡的容器称为…

交叉熵:计算交叉熵损失函数nn.CrossEntropyLoss()

首先要提出的问题是。。。什么是损失函数&#xff1f;干什么的&#xff08;功能&#xff09;&#xff1f;类型有哪些&#xff1f; 1.什么是损失函数&#xff1f; 损失函数&#xff08;loss function&#xff09;或 代价函数&#xff08;cost function&#xff09;是将随机事件或…

softmax函数与交叉熵损失函数

本文主要介绍了当前机器学习模型中广泛应用的交叉熵损失函数与softmax激励函数。 这个损失函数主要应用于多分类问题&#xff0c;用于衡量预测值与实际值之间的相似程度。 交叉熵损失函数定义如下: L C E ( y ^ , y ∗ ) − ∑ i 1 N c l a s s e s y i ∗ l o g ( y i ^ …

【交叉熵损失函数】关于交叉熵损失函数的一些理解

目录 0. 前言1.损失函数&#xff08;Loss Function&#xff09;1.1 损失项1.2 正则化项 2. 交叉熵损失函数2.1 softmax2.2 交叉熵 0. 前言 有段时间没写博客了&#xff0c;前段时间主要是在精读一些计算机视觉的论文&#xff08;比如yolov1&#xff09;&#xff0c;以及学cs23…

CrossEntropy交叉熵损失函数及softmax函数的理解

参考链接1 参考链接2 参考链接3 参考链接4 &#xff08;一&#xff09;什么是Sigmoid函数和softmax函数&#xff1f; 提到二分类问题容易想到逻辑回归算法&#xff0c;而逻辑回归算法最关键的步骤就是将线性模型输出的实数域映射到[0, 1]表示概率分布的有效实数空间&#xff…

【基础篇】交叉熵损失函数(Cross Entropy Loss)

文章目录 1. 理论知识2. 代码 1. 理论知识 我们需要关注那些按常理来说不太可能发生的事情。『信息量』就是用来度量事件的不确定性&#xff0c; 事件包含的信息量应与其发生的概率负相关 。假设 X X X是一个离散型随机变量&#xff0c;它的取值集合为 { x 1 , x 2 , . . . ,…

损失函数-交叉熵的推导和二分类交叉熵

交叉熵 期望&#xff1a; 期望就是所有随机变量的均值。 E(X)X1*P&#xff08;X1&#xff09;X2*P&#xff08;X2&#xff09;X3*P&#xff08;X3&#xff09; 熵&#xff1a; 熵表示所有信息量的期望。 信息量如何计算呢&#xff1f; 概率值取Log&#xff0c;然后加个负…

深度学习中的损失函数(交叉熵)

0、前景介绍 对于线性回归模型适用于输出为连续值的情景&#xff0c;但是在模型输出是一个像图像类别这样的离散值时。对于这样离散值的预测问题&#xff0c;通常使用一些例如sigmoid/softmax的分类模型。 1. 图像分类任务 假设下面两个模型都是通过softmax的方式得到对于每…

图示Softmax及交叉熵损失函数

Softmax函数 Softmax是将神经网络得到的多个值&#xff0c;进行归一化处理&#xff0c;使得到的值在之间&#xff0c;让结果变得可解释。即可以将结果看作是概率&#xff0c;某个类别概率越大&#xff0c;将样本归为该类别的可能性也就越高。Softmax就如下图&#xff08;借鉴李…

最全的交叉熵损失函数(Pytorch)

损失函数 引言BCELossBCEWithLogitsLossNLLLossCrossEntropyLoss总结参考 引言 这里主要讲述pytorch中的几种交叉熵损失类&#xff0c;熵是用来描述一个系统的混乱程度,通过交叉熵我们就能够确定预测数据与真是数据之间的相近程度。交叉熵越小&#xff0c;表示数据越接近真实样…

简单的交叉熵损失函数,你真的懂了吗?

个人网站&#xff1a;红色石头的机器学习之路 CSDN博客&#xff1a;红色石头的专栏 知乎&#xff1a;红色石头 微博&#xff1a;RedstoneWill的微博 GitHub&#xff1a;RedstoneWill的GitHub 微信公众号&#xff1a;AI有道&#xff08;ID&#xff1a;redstonewill&#xf…

交叉熵损失概念

交叉熵是信息论中的一个概念&#xff0c;要想了解交叉熵的本质&#xff0c;需要先从最基本的概念讲起。 1. 信息量 首先是信息量。假设我们听到了两件事&#xff0c;分别如下&#xff1a; 事件A&#xff1a;巴西队进入了2018世界杯决赛圈。 事件B&#xff1a;中国队进入了2…

softmax交叉熵损失函数深入理解(二)

0、前言 前期博文提到经过两步smooth化之后&#xff0c;我们将一个难以收敛的函数逐步改造成了softmax交叉熵损失函数&#xff0c;解决了原始的目标函数难以优化的问题。Softmax 交叉熵损失函数是目前最常用的分类损失函数&#xff0c;本博文继续学习Softmax 交叉熵损失函数的改…

史上最全交叉熵损失函数详解

在我们自学神经网络神经网络的损失函数的时候会发现有一个思路就是交叉熵损失函数&#xff0c;交叉熵的概念源于信息论&#xff0c;一般用来求目标与预测值之间的差距。比如说我们在人脑中有一个模型&#xff0c;在神经网络中还有一个模型&#xff0c;我们需要找到神经网络模型…

交叉熵损失函数原理详解

交叉熵损失函数原理详解 之前在代码中经常看见交叉熵损失函数(CrossEntropy Loss)&#xff0c;只知道它是分类问题中经常使用的一种损失函数&#xff0c;对于其内部的原理总是模模糊糊&#xff0c;而且一般使用交叉熵作为损失函数时&#xff0c;在模型的输出层总会接一个softm…

损失函数——交叉熵损失函数

一篇弄懂交叉熵损失函数 一、定义二、交叉熵损失函数&#xff1a;知识准备&#xff1a;1、信息熵&#xff1a;将熵引入到信息论中&#xff0c;命名为“信息熵”2、 KL散度&#xff08;相对熵&#xff09;&#xff1a; 交叉熵&#xff1a;结论&#xff1a; Softmax公式Sigmoid常…

交叉熵损失函数详解

我们知道&#xff0c;在二分类问题模型&#xff1a;例如逻辑回归「Logistic Regression」、神经网络「Neural Network」等&#xff0c;真实样本的标签为 [0&#xff0c;1]&#xff0c;分别表示负类和正类。模型的最后通常会经过一个 Sigmoid 函数&#xff0c;输出一个概率值&am…

交叉熵损失函数(CrossEntropy Loss)(原理详解)

监督学习主要分为两类&#xff1a; 分类&#xff1a;目标变量是离散的&#xff0c;如判断一个西瓜是好瓜还是坏瓜&#xff0c;那么目标变量只能是1&#xff08;好瓜&#xff09;,0&#xff08;坏瓜&#xff09;回归&#xff1a;目标变量是连续的&#xff0c;如预测西瓜的含糖率…

nn.CrossEntropyLoss()交叉熵损失函数

1、nn.CrossEntropyLoss() 在pytorch中nn.CrossEntropyLoss()为交叉熵损失函数&#xff0c;用于解决多分类问题&#xff0c;也可用于解决二分类问题。在使用nn.CrossEntropyLoss()其内部会自动加上Sofrmax层 nn.CrossEntropyLoss()的计算公式如下&#xff1a; 其中&#xff0c…