详解Android应用中使用TabHost组件进行布局的基本方法

 更新时间:2016年04月12日 15:44:56   作者:chenzheng_java  
这篇文章主要介绍了Android应用中使用TabHost组件进行布局的基本方法,不继承TabActivity并以最基本的布局文件方式进行布局,需要的朋友可以参考下

TabHost布局文件

我们先来了解一下布局文件的基本内容:
1. 根标签及id

设置Android自带id : XML布局文件中, 可以使用 标签设置, 其中的id 需要引用 android的自带id :

android:id=@android:id/tabhost ;

getHost()获取前提 : 设置了该id之后, 在Activity界面可以使用 getHost(), 获取这个TabHost 视图对象;

示例 :

复制代码 代码如下:

<tabhost android:id="@android:id/tabhost" android:layout_height="match_parent" android:layout_width="match_parent"></tabhost>

2. TabWidget组件

选项卡切换 : 该组件是选项卡切换按钮, 通过点击该组件可以切换选项卡;

设置android自带id : 这个组件的id要设置成android的自带id : android:id=@android:id/tabs ;

TabHost必备组件 : 该组件与FrameLayout组件是TabHost组件中必备的两个组件;

切换按钮下方显示 : 如果想要将按钮放到下面, 可以将该组件定义在下面, 但是注意,FrameLayout要设置android:layout_widget = 1;

设置TabWidget大小 : 如果想要设置该按钮组件的大小, 可以设置该组件与FrameLayout组件的权重;

示例 :

复制代码 代码如下:

<tabwidget android:id="@android:id/tabs" android:layout_height="wrap_content" android:layout_width="fill_parent" android:orientation="horizontal/"></tabwidget>

3. FrameLayout组件

组件作用 : 该组件中定义的子组件是TabHost中每个页面显示的选项卡, 可以将TabHost选项卡显示的视图定义在其中;

设置android自带id : 这个组件的id要设置成android的自带的id : android:id=@android:id/tabcontent ;

示例 :

复制代码 代码如下:

<framelayout android:id="@android:id/tabcontent" android:layout_height="fill_parent" android:layout_weight="1" android:layout_width="fill_parent"></framelayout>

示例

2016412154201842.gif (354×175)

上图为最终效果图
代码结构图

2016412154240467.gif (221×432)

main.xml

<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
 android:id="@+id/hometabs" 
 android:orientation="vertical" 
 android:layout_width="fill_parent" 
 android:layout_height="fill_parent"> 
 <!-- TabHost必须包含一个 TabWidget和一个FrameLayout--> 
 <TabHost android:id="@+id/tabhost" 
  android:layout_width="fill_parent" 
  android:layout_height="wrap_content" 
  > 
  <LinearLayout 
   android:orientation="vertical" 
   android:layout_width="fill_parent" 
   android:layout_height="fill_parent"> 
   <!-- TabWidget的id属性必须为 @android:id/tabs-->    
   <TabWidget android:id="@android:id/tabs" 
    android:orientation="horizontal" 
    android:layout_width="fill_parent" 
    android:layout_height="wrap_content"> 
   </TabWidget> 
   <!-- FrameLayout的id属性必须为 @android:id/tabcontent--> 
    <FrameLayout android:id="@android:id/tabcontent" 
     android:layout_width="fill_parent" 
     android:layout_height="fill_parent"> 
     <TextView android:id="@+id/view1" 
      android:layout_width="fill_parent" 
      android:layout_height="fill_parent"/> 
     <TextView android:id="@+id/view2" 
      android:layout_width="fill_parent" 
      android:layout_height="fill_parent"/> 
     <TextView android:id="@+id/view3" 
      android:layout_width="fill_parent" 
      android:layout_height="fill_parent"/> 
    </FrameLayout> 
   
   </LinearLayout> 
 </TabHost> 
</LinearLayout> 

java代码如下

package cn.com.tagHost.test; 
 
import android.app.Activity; 
import android.os.Bundle; 
import android.widget.TabHost; 
import android.widget.TabWidget; 
 
public class TagHostTest2 extends Activity { 
 @Override 
 public void onCreate(Bundle savedInstanceState) { 
  super.onCreate(savedInstanceState); 
  setContentView(R.layout.main); 
  // 获取TabHost对象 
  TabHost tabHost = (TabHost) findViewById(R.id.tabhost); 
  // 如果没有继承TabActivity时,通过该种方法加载启动tabHost 
  tabHost.setup(); 
  tabHost.addTab(tabHost.newTabSpec("tab1").setIndicator("第一个标签", 
    getResources().getDrawable(R.drawable.icon)).setContent( 
    R.id.view1)); 
 
  tabHost.addTab(tabHost.newTabSpec("tab3").setIndicator("第三个标签") 
    .setContent(R.id.view3)); 
 
  tabHost.addTab(tabHost.newTabSpec("tab2").setIndicator("第二个标签") 
    .setContent(R.id.view2)); 
 } 
} 

运行得到正确的结果。
废话连篇:这里需要注意的是
第一:布局文件的格式。以及TabWidget和FrameLayout的id属性值。
第二:TabWidget代表的是标签部分,FrameLayout代表的点击标签后看到的内容部分。FrameLayout里面声明的组件意为具备成为标签内容的资格,具体的还要在代码中具体指定。
你是否也想要这种结果呢。让标签在下部分显示

2016412154317508.gif (362×516)

那么你只需要给main.xml进行下布局修改就可以了。

main.xml

<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
 android:id="@+id/hometabs" android:orientation="vertical" 
 android:layout_width="fill_parent" android:layout_height="fill_parent"> 
 <!-- TabHost必须包含一个 TabWidget和一个FrameLayout--> 
 <TabHost android:id="@+id/tabhost" android:layout_width="fill_parent" 
  android:layout_height="wrap_content"> 
  <LinearLayout android:orientation="vertical" 
   android:layout_width="fill_parent" android:layout_height="fill_parent"> 
 
   <!-- FrameLayout的id属性必须为 @android:id/tabcontent--> 
   <FrameLayout android:id="@android:id/tabcontent" 
    android:layout_width="fill_parent" android:layout_height="fill_parent"> 
    <TextView android:id="@+id/view1" android:layout_width="fill_parent" 
     android:layout_height="fill_parent" 
     android:text="hello baby!" 
     /> 
    <TextView android:id="@+id/view2" android:layout_width="fill_parent" 
     android:layout_height="fill_parent" /> 
    <TextView android:id="@+id/view3" android:layout_width="fill_parent" 
     android:layout_height="fill_parent" /> 
   </FrameLayout> 
   <RelativeLayout android:layout_width="fill_parent" 
    android:layout_height="fill_parent"> 
 
    <!-- TabWidget的id属性必须为 @android:id/tabs--> 
    <TabWidget android:id="@android:id/tabs" 
     android:orientation="horizontal" android:layout_width="fill_parent" 
     android:layout_height="wrap_content" 
     android:layout_alignParentBottom="true" 
     android:paddingBottom="0dp" 
     > 
    </TabWidget> 
   </RelativeLayout> 
  </LinearLayout> 
 </TabHost> 
</LinearLayout> 

为了让标签和父容器底部持平,我们使用了android:layout_alignParentBottom="true",该属性只有在RelativeLayout布局中才会存在哦、这也是为什么我们将tabWidget放入一个RelativeLayout中的原因。
此外,在lineaerLayout布局中,TabWidget和FrameLayout的位置可是调换了哦。

相关文章

  • Android 仿硅谷新闻下拉刷新/上拉加载更多

    Android 仿硅谷新闻下拉刷新/上拉加载更多

    这篇文章主要介绍了Android 仿硅谷新闻下拉刷新/上拉加载更多的实现代码,非常不错具有一定的参考借鉴价值,需要的朋友可以参考下
    2016-10-10
  • Android Camera+SurfaceView自动聚焦防止变形拉伸

    Android Camera+SurfaceView自动聚焦防止变形拉伸

    这篇文章主要为大家介绍了Android自定义相机Camera+SurfaceView实现自动聚焦防止变形拉伸详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2023-01-01
  • Android 零基础到精通之广播机制

    Android 零基础到精通之广播机制

    Android 提供了一套完整的 API,允许应用程序自由地发送和接收广播。发送广播需要借助之前学习的 Intent,而接收广播的方法则需要引入一个新的概念 —— BroadcasterReceiver
    2021-10-10
  • Android使用SharedPreferences存储XML文件的实现方法

    Android使用SharedPreferences存储XML文件的实现方法

    这篇文章主要介绍了Android使用SharedPreferences存储XML文件的实现方法,实例分析了SharedPreferences类的基本初始化与文件存储相关技巧,需要的朋友可以参考下
    2016-07-07
  • Android studio so库找不到问题解决办法

    Android studio so库找不到问题解决办法

    这篇文章主要介绍了Android studio so库找不到问题解决办法的相关资料,希望通过本文能帮助到大家解决出现的这种问题,需要的朋友可以参考下
    2017-10-10
  • Android EditText实现分割输入内容

    Android EditText实现分割输入内容

    这篇文章主要为大家详细介绍了Android EditText实现分割输入内容的相关资料,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-04-04
  • android通过拼音搜索中文的功能实现代码

    android通过拼音搜索中文的功能实现代码

    这篇文章主要介绍了android通过拼音搜索中文的功能实现代码,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2020-11-11
  • 仿网易新闻客户端头条ViewPager嵌套实例

    仿网易新闻客户端头条ViewPager嵌套实例

    正确使用requestDisallowInterceptTouchEvent(boolean flag)方法,下面为大家介绍下外层ViewPager布局的实例,感兴趣的朋友可以参考下哈
    2013-06-06
  • Android生成二维码工具类封装及使用

    Android生成二维码工具类封装及使用

    最近公司业务上有个生成二维码图片的需求(Android端),之后笔者在网上查阅了一些资料,实现了这个功能,这篇文章主要给大家介绍了关于Android生成二维码工具类封装及使用的相关资料,需要的朋友可以参考下
    2024-04-04
  • Android实现老虎机小游戏代码示例

    Android实现老虎机小游戏代码示例

    大家好,本篇文章主要讲的是Android实现老虎机小游戏代码示例,感兴趣的同学赶快来看一看吧,对你有帮助的话记得收藏一下,方便下次浏览
    2021-12-12

最新评论