美文网首页
FragmentTabHost

FragmentTabHost

作者: 云承寒 | 来源:发表于2017-07-26 13:13 被阅读0次
    FragmentTabHost介绍

    FragmentTabHost代表整个底部导航栏,它包含的每一个Item,称之为TabSpec,点击可以切换到相应的Fragment分页。TabSpec里面需要有指示器Indicator,用来设置样式。

    相较于RadioButton(RadioGroup)+ Fragment的实现方式,FragmentTabHost实现简单,对资源的控制相对较好。

    FragmentTabHost基本用法
    1.FragmentTabHost XML布局
    
    注意
      1.  使用 v4 的FragmentTabHost
      2.  FragmentTabHost需要使用Android自带的id
            @android:id/tabhost
    
      3.  FragmentTabHost中的FrameLayout也需要使用自带id
            @android:id/tabcontent
          因为实现的是底部菜单,底部的FrameLayout设置为0dp
          真正展示内容的是上方的FrameLayout
    
    <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=".ui.activity.MainActivity">
    
        <FrameLayout
            android:id="@+id/fra_content"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1" />
    
        <android.support.v4.app.FragmentTabHost
            android:id="@android:id/tabhost"
    
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="#E8E8E8">
    
            <FrameLayout
                android:id="@android:id/tabcontent"
    
                android:layout_width="0dp"
                android:layout_height="0dp" />
        </android.support.v4.app.FragmentTabHost>
    </LinearLayout>
    
    2.drawable设置
    <selector xmlns:android="http://schemas.android.com/apk/res/android">
        <item android:drawable="@mipmap/red_img" android:state_selected="true" />
        <item android:drawable="@mipmap/base_img" />
    </selector>
    
    
    文本选择设置
    <selector xmlns:android="http://schemas.android.com/apk/res/android">
        <item android:color="@color/colorAccent" android:state_selected="true" />
    
        <item android:color="#000" />
    </selector>
    
    
    设置Tab Host每个Item的样式
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:orientation="vertical">
    
        <ImageView
            android:id="@+id/tab_img"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/red_press" />
    
        <TextView
            android:id="@+id/tab_text"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="123"
            android:textColor="@color/text_press" />
    
    </LinearLayout>
    
    2.代码实现
    步骤
    1.  为TabHost设置初始化
    mFraTabHost.setup(mContext, getSupportFragmentManager(), R.id.fra_content);
    
    2.  生成每个Item
    TabHost.TabSpec mTabSpec = mFraTabHost.newTabSpec("Tag" + i);
    
    3.  为每个Item指定样式
    mTabSpec.setIndicator(View view);
    
    4.  将每个Item添加到TabHost,同时也添加Fragment
    mFraTabHost.addTab(mTabSpec, fraClass[i], null);
    
    public class MainActivity extends AppCompatActivity {
    
        private FragmentTabHost mFraTabHost;
        private Context mContext;
    
        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_main);
    
            initView();
            initTabHost();
            initEvent();
        }
    
        private void initEvent() {
            //监听分页切换
            mFraTabHost.setOnTabChangedListener(new TabHost.OnTabChangeListener() {
                @Override
                public void onTabChanged(String s) {
                    Log.i("TagInfo", s);
                }
            });
        }
    
        private void initTabHost() {
            mFraTabHost.setup(mContext, getSupportFragmentManager(), R.id.fra_content);
            initTabHostData();
    
            //设置显示的当前页
            mFraTabHost.setCurrentTab(1);
            //去掉分割线
            mFraTabHost.getTabWidget().setShowDividers(LinearLayout.SHOW_DIVIDER_NONE);
        }
    
        private void initTabHostData() {
            Class[] fraClass = {RedFragment.class, BlueFragment.class};
            int[] icon = {R.drawable.red_press, R.drawable.blue_press};
            String[] title = {"Red", "Blue"};
    
            for (int i = 0; i < fraClass.length; i++) {
                TabHost.TabSpec mTabSpec = mFraTabHost.newTabSpec("Tag" + i);
                mTabSpec.setIndicator(getTabHostItemView(icon[i], title[i]));
                mFraTabHost.addTab(mTabSpec, fraClass[i], null);
            }
        }
    
        public View getTabHostItemView(int icon, String itemText) {
            LayoutInflater inflater = LayoutInflater.from(this);
            View view = inflater.inflate(R.layout.item_tabhost, null);
            TextView mItemText = view.findViewById(R.id.tab_text);
            ImageView mItemImg = view.findViewById(R.id.tab_img);
            mItemImg.setImageResource(icon);
            mItemText.setText(itemText);
            return view;
        }
    
        private void initView() {
            mContext = this;
            mFraTabHost = findViewById(android.R.id.tabhost);
        }
    }
    

    相关文章

      网友评论

          本文标题:FragmentTabHost

          本文链接:https://www.haomeiwen.com/subject/qbgnkxtx.html