关于Android studio程序开发TabHost选项卡组件使用心得

关于TabHost选项卡组件使用心得


#来记录自己学习的点滴,也为了更好的复习知识

  1. Famelayout (帧布局)

    Framelayout继承自ViewGroup,使用FrameLayout布局管理器时,整个界面被当成一块空白备用区域,所有的子元素都不能被指定放置的位置,它们全部放在这块区域的左上角,并且后面的子元素直接覆盖在前面的子元素之上,将前面的子元素部分或全部遮挡,即帧布局的大小由子元素中尺寸最大的那个子元素来决定。如果子元素一样大,同一时刻只能看到最上面的子元素。
    如下图是使用Famelayout (帧布局)制作的霓虹灯效果,本质是Famelayout布局文件中使用不同大小的TextView组件,设置不同的背景颜色即可。关于Android studio程序开发TabHost选项卡组件使用心得_第1张图片

  2. TabHost组件

    TabHost继承自FrameLayout,它是个带Tab选项卡的容器,包含TabWidget和FrameLayout两个部分,TabWidget是每个Tab选项卡的标签按钮,FrameLayout是每个Tab选项卡的内容,在Android应用开发中提供了继承TabActivity和继承Activity两种实现方法,其中TabActivity已经过时,我主要学习Activity的实现方法。
    *Tab选项卡的UI布局文件的设计需要遵循下表的要求进行定义:

属性/方法名 说明
TabHoste 可自定义id
TabWidget 必须设置android:id为@android:id/tabs
FrameLayout 必须设置android:id为@android:id/tabcontent
  1. TabWidget组件

    TabWidget组件定义的选项标签按钮可以放在UI的上部或底部,本例中是放在U上的上部,也可以使用相对布局方式将它定义在UI的底部。

 <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">
        <!--如果想改为让选项置于UI底部,需将上句话删去,因为相对布局不需要规定水平还是垂直-->
        <TabWidget
            android:layout_alignParentBottom="true"
            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="200dp">
            <!--设置红色背景-->
            <LinearLayout
                android:id="@+id/layoutred"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:background="#ffff00"
                android:orientation="horizontal">
            </LinearLayout>
            <!--设置黄色背景-->
            <LinearLayout
                android:id="@+id/layoutyellow"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:background="#00ffff"
                android:orientation="horizontal">
            </LinearLayout>
        </FrameLayout>
    </LinearLayout>

如果要将选项卡标签放在U的底部,只需要修改上述代码的第6行,将其布局方式修改为相对布局RelativeLayout,然后在TabWidget中置于父类底部即可,附上放在底部代码:

 android:layout_alignParentBottom="true"

标签放在下面以后实现的结果如下图所示,这里选项标签我已经放在下面了,但上面的代码实现以后标签是放在上面的
关于Android studio程序开发TabHost选项卡组件使用心得_第2张图片
4. 功能代码的实现
依照上面的.mxl文件,实现当用户单击“红色”选项卡时,显示layout-red布局中定义的内容;当用当用户单击“黄色”选项卡时,显示layout-yellow布局中定义的内容

public class MainActivity extends Activity {
 TabHost tabhost;

 @Override
 protected void onCreate(Bundle savedInstanceState) {
     super.onCreate(savedInstanceState);
     this.setContentView(R.layout.setcolor);
     intiView();
     tabhost.setup();//加载tabhost
     TabHost.TabSpec tsRed=tabhost.newTabSpec("tabred").setIndicator("红色").setContent(R.id.layoutred);
     //TabSpec就是用来设置TabHost的每个选项
    //newTabSpec 设置该tabhost的标签(就是在选项上显示的内容)
    //setIndicator 显示的文字或图片 
    //setContent 下面显示的内容,这里的意思是让它显示layout里红色背景的内容
     tabhost.addTab(tsRed);
     TabHost.TabSpec tsYellow=tabhost.newTabSpec("tabyellow").setIndicator("黄色").setContent(R.id.layoutyellow);
     tabhost.addTab(tsYellow);
 }
 void intiView(){
     tabhost= (TabHost) this.findViewById(R.id.myTabhost);
 }
}
  1. TabHost组件的应用——考试界面的实现
    关于Android studio程序开发TabHost选项卡组件使用心得_第3张图片
    这里单击TabHost组件来实现换题,如下图换到了判断题关于Android studio程序开发TabHost选项卡组件使用心得_第4张图片
    这是我的第一篇博客,若有机会我会在下一篇博客讲讲这里埋得坑——考试界面的实现的具体过程,希望能抛砖引玉,希望各位前辈能给我一些指点,分享一些成长心得,不胜感激。
    注:尤其感谢中国大学Mocc网课《移动程序终端设计》,我只是对老师上课讲的内容稍加整理。

你可能感兴趣的:(布局组件的使用)