FragmentTabHost的基本用法

2021-11-22 10:59:16

　　开通博客以来已经约莫1个月了。几次想提笔写写东西，但总是由于各种各样的原因并没有开始。现在，年假刚结束，项目也还没有开始，但最终促使我写这篇博客的是，看了一篇博友写的新年计划，说是要在新的一年中写50篇博客，我也心血来潮的定下了这样的目标。把年前项目中用到的FragmentTabHost在这里总结一下。

　　现在市面上app的主流框架大体分为两种：一种是在主界面点击菜单按钮，之后会滑出侧滑菜单，之后进入到各个模块，还有一种是在主界面的下面放置若干个tab按钮，点击按钮，切换到不同的模块。今天要讲的就是第二种的实现方式之一的FragmentTabHost.

　　FragmentTabHost来自于android.support.v4.app这个包下，继承自TabHost，作为android4.0的控件。好了，废话还是少说为妙。

下面是主界面的布局文件

<RelativeLayout 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"

    tools:context="com.itrui.searchs.MainActivity" >

    <android.support.v4.app.FragmentTabHost

        android:id="@android: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"

            >

            <FrameLayout

                android:id="@android:id/tabcontent"

                android:layout_width="match_parent"

                android:layout_height="0dp"

                android:layout_weight="1">

            </FrameLayout>

            <TextView

                android:layout_width="match_parent"

                android:layout_height="1px"

                android:background="#D0D0D0">

            </TextView>

            <TabWidget

                android:id="@android:id/tabs"

                android:layout_width="match_parent"

                android:layout_height="?attr/actionBarSize"

                android:background="#FFFFFF"

                android:layout_gravity="bottom"

                android:padding="10dp"

                ></TabWidget>

        </LinearLayout>

    </android.support.v4.app.FragmentTabHost>

</RelativeLayout>

控件的命名是固定的不能随便更改。控件的id必须是Android提供的标准id, 即"@android:id"

Tab的布局文件：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"

    android:layout_width="match_parent"

    android:layout_height="match_parent"

     >

    <LinearLayout

        android:id="@+id/layout_ancor"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_centerHorizontal="true"

        android:layout_alignParentBottom="true"

        android:gravity="center"

        android:orientation="vertical"

        android:padding="2dp"

        android:paddingBottom="15dp"

        android:paddingTop="10dp">

    <ImageView

        android:id="@+id/img_tab_pic"

        android:layout_width="32dp"

        android:layout_height="32dp"

        />

    </LinearLayout>

</RelativeLayout>

此布局文件是一张图片，当然你也可以根据自己的需求来添加其他的控件，比如文字之类的控件

其中之一的Fragment的布局：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

    android:layout_width="match_parent"

    android:layout_height="match_parent"

    android:orientation="vertical" >

    <RelativeLayout

        android:id="@+id/fragment_main_frist_title"

        android:layout_width="match_parent"

        android:layout_height="50dp"

        android:orientation="horizontal"

        >

        <TextView

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:gravity="center"

            android:paddingTop="10dp"

            android:layout_marginLeft="80dp"

            android:text="poi搜索"/>

        <ImageView

            android:id="@+id/iv_baidu_dingwei"

            android:layout_width="32dp"

            android:layout_height="32dp"

            android:paddingTop="10dp"

            android:paddingRight="5dp"

            android:layout_alignParentRight="true"

            android:src="@drawable/baidumap"/>

    </RelativeLayout>

    <TextView 

        android:layout_width="match_parent"

        android:layout_height="wrap_content"

        android:text="我是主界面的第一个fragment"/>

</LinearLayout>

当然你也可以同一个fragment实现复用。

主页面的代码：

public class MainActivity extends FragmentActivity {

    private FragmentTabHost myTabhost;

    //Tab图片

    private int mImages[] = {

            R.drawable.tab_assistant_gray,R.drawable.tab_center_gray,R.drawable.tab_contest_gray,R.drawable.tab_counter_gray

    };

    //标记
    private String mFragmentTags[] ={

            "第一个","第二个","第三个","第四个"

    };

    //加载的Fragment

    private Class mFragment[] ={

            MainFristFragment.class,MainSecondFragment.class,MainThridFragment.class,MainFristFragment.class

    };

    @Override

    protected void onCreate(Bundle savedInstanceState) {

        requestWindowFeature(Window.FEATURE_NO_TITLE);

        getWindow().setFlags(WindowManager.LayoutParams.FLAG_KEEP_SCREEN_ON, WindowManager.LayoutParams.FLAG_KEEP_SCREEN_ON);

        super.onCreate(savedInstanceState);

        setContentView(R.layout.activity_main);

        initTabHost();

    }

    private void initTabHost() {

        myTabhost = (FragmentTabHost) findViewById(android.R.id.tabhost);

        myTabhost.setup(this, getSupportFragmentManager(),android.R.id.tabhost);

        //去掉分割线

        myTabhost.getTabWidget().setDividerDrawable(null);

        for(int i = 0;i<mImages.length;i++){

            //对Tab按钮添加标记和图片

            TabSpec tabSpec = myTabhost.newTabSpec(mFragmentTags[i]).setIndicator(getImageView(i));

            //添加Fragment

            myTabhost.addTab(tabSpec,mFragment[i],null);

            myTabhost.getTabWidget().getChildAt(i).setBackgroundResource(R.color.white);

        }

    }

    //获取图片资源

    private View getImageView(int index){

        View view = getLayoutInflater().inflate(R.layout.tab_title, null);

        ImageView imageView = (ImageView) view.findViewById(R.id.img_tab_pic);

        imageView.setImageResource(mImages[index]);

        return view;

    }

}

在onCreat()中执行 getWindow().setFlags(WindowManager.LayoutParams.FLAG_KEEP_SCREEN_ON, WindowManager.LayoutParams.FLAG_KEEP_SCREEN_ON);语句的作用是让手机屏幕保持一种不暗不关闭的效果。通常的应用场景是视频播放器。
总结：

在FragmentTabHost这一个布局中包裹着FrameLayout(也可以换成其他布局主要作用是存放fragment)和TabWidget控件。

执行语句：

myTabhost.setup(this, getSupportFragmentManager(),android.R.id.tabhost);

去掉分割线

myTabhost.getTabWidget().setDividerDrawable(null);

向FragmentTabHost中添加标识和添加图标

TabSpec tabSpec = myTabhost.newTabSpec(mFragmentTags[i]).setIndicator(getImageView(i));

将对应的fragment添加到控件中去

myTabhost.addTab(tabSpec,mFragment[i],null);

其实还是蛮好用的一个控件。

码农公寓

相关文章