FragmentTableHost+Fragment

最新推荐文章于 2018-03-26 18:29:25 发布

hatsune39

最新推荐文章于 2018-03-26 18:29:25 发布

阅读量644

点赞数

本文链接：https://blog.csdn.net/hatsune39/article/details/53423089

版权

团购商城的框架:FragmentTableHost+Fragment

使用FragmentTableHost和Fragment来实现一个可以在底部进行点选操作来切换Fragment的框架.

大概效果图如下:

MainActivity代码:

//添加fragment的数组,主要是为了动态的改变APP以及界面的个数,如果要添加新的模块,只需要在这里添加一个fragment
private Class[] fragments = new Class[]{MainFragment.class,AroundFragment.class,MineFragment.class,MoreFragment.class};
//为框架底部设置图片的状态选择器数组,如果需要添加新的模块的话,还要添加状态选择器
private int[] imgSelectors = new int[]{R.drawable.ic_home_tab_index,R.drawable.ic_home_tab_near,R.drawable.ic_home_tab_my,R.drawable.ic_home_tab_more};

//为空间底部设置文本资源,如果要添加新的模块,还要在这里添加文本信息
private String[] tabTitles = new String[]{"首页","热卖","乐一乐","更多"};
@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main); 
    //初始化控件
    FragmentTabHost tabHost = (FragmentTabHost) findViewById(R.id.tabHost);
    //使用此方法,为fragmentTabHost来填充fragment使用带有参数的方法,1.上下文 2.fragment的管理器FragmentManager 3.官方要求写死的
    tabHost.setup(MainActivity.this,getSupportFragmentManager(),android.R.id.tabcontent);
    //使用FragmentTabHost去添加子标签,根据fragment的集合里有多少个fragment,动态进行添加
    for (int x = 0;x<fragments.length;x++){
        //把一个布局的XML资源转化为一个View的对象,第一个参数就是layout,第二个参数设置为null
        View inflate = getLayoutInflater().inflate(R.layout.tab_item, null);
        //进行控件查找
        ImageView tab_iv = (ImageView) inflate.findViewById(R.id.iv);
        TextView tab_tv = (TextView) inflate.findViewById(R.id.tv);
        //为这些子控件设置图片文本资源,从对应的集合里拿
        tab_iv.setImageResource(imgSelectors[x]);
        tab_tv.setText(tabTitles[x]);
        //第一个参数使用fragmentTabHost去添加子标签核心代码,TabHost,newTabSped(""+x)为每个子标签添加标识并添加加载显示的底部View对象
        //第二个参数为添加动态加载的fragment对象,从集合里动态的拿fragment,第三个参数,给null即可.
        tabHost.addTab(tabHost.newTabSpec(""+x).setIndicator(inflate),fragments[x],null);
    }

}

MainActivity布局文件:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <!--有V4包的就是为了支持低版本
        框架的布局不要轻易改动
    -->
    <android.support.v4.app.FragmentTabHost
        android:id="@+id/tabHost"
        android:layout_alignParentTop="true"
        android:layout_alignParentRight="true"
        android:layout_alignParentEnd="true"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <!--更改TabWidget这个空间在LinearLayout容器里的上下位置,就可以改变TabHost里控制fragment的按钮所在的上下位置-->
        <LinearLayout
            android:orientation="vertical"
            android:layout_width="match_parent"
            android:layout_height="match_parent">
            <!--权重是LinerLayout里独有的属性-->
            <FrameLayout
                android:id="@android:id/tabcontent"
                android:layout_width="match_parent"
                android:layout_height="0dp"
                android:layout_weight="1"></FrameLayout>
            <TabWidget
                android:id="@android:id/tabs"
                android:divider="@null"
                android:background="#ffffff"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"></TabWidget>
        </LinearLayout>
    </android.support.v4.app.FragmentTabHost>
</RelativeLayout>

SelectorChapek for Android(更加图片资源生产状态选择器)
用于生成Selector的插件。你需要在drawable文件夹中右键，在弹出的菜单中选择Generate Android Selectors，它就会根据你的几个drawable文件夹里的资源的命名，帮你生成Selector代码。
注意:(使用这个插件,命名必须规范,前缀名必须一致,都必须是同一类型,资源文件需要根据约定的后缀来命名。最后一个单词分为按下状态为_pressed，正常状态为_normal，不可用状态为_disable，等等。)
比如:ic_home_tab_index_selected.png和ic_home_tab_index_normal.png方可以.

利用插件selectorChapek自动根据图片名称生成相应的点选操作时需要用到的XML文件.

在value文件夹中的color中新建两个color

<color name="tab_normal">#c5c9d0</color>
<color name="tab_selected">#fb773b</color>

drawable中新建XML用来更改文字颜色

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:color="@color/tab_selected" android:state_selected="true"></item>
    <item android:color="@color/tab_normal" ></item>

</selector>

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              android:orientation="vertical"
              android:layout_width="match_parent"
              android:layout_height="match_parent">
<LinearLayout
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
    <ImageView
        android:id="@+id/iv"
        android:layout_gravity="center"
        android:src="@mipmap/ic_launcher"
        android:layout_width="30dp"
        android:layout_height="30dp"/>

    <!--改变框架字体的颜色,找textColor,进tab_text修改-->
    <TextView
        android:id="@+id/tv"
        android:text="首页"
        android:layout_gravity="center"
        android:textColor="@drawable/tab_text"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"/>
</LinearLayout>
</LinearLayout>