Android-TabLayout使用小结

TabLayout是Google发布的Android Support Design库里的一个控件，它控件非常强大，既可以用来实现TabPageIndicator的效果，也可以作为底部导航条使用。下面将来详细讲述一下它的用法:

1.TabLayout实现TabPageIndicator效果

核心代码:

@Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_vpager);        viewPager = (ViewPager)findViewById(R.id.viewPager);        tabLayout = (TabLayout)findViewById(R.id.tab_layout);        fragments[0] = new HomeFragment();        fragments[1] = new MessageFragment();        fragments[2] = new PlayerFragment();        fragments[3] = new MineFragment();        /**         * 切忌不可这样写：         * tabLayout.addTab(tabLayout.newTab().setText("xxx"));         * 否则文字将显示不出来         **/        tabLayout.addTab(tabLayout.newTab());        tabLayout.addTab(tabLayout.newTab());        tabLayout.addTab(tabLayout.newTab());        tabLayout.addTab(tabLayout.newTab());        adapter = new PagerAdapter(getSupportFragmentManager());        viewPager.setAdapter(adapter);        tabLayout.setupWithViewPager(viewPager);        tabLayout.getTabAt(0).setText("首页");        tabLayout.getTabAt(1).setText("消息");        tabLayout.getTabAt(2).setText("视频");        tabLayout.getTabAt(3).setText("我的");    }    private class PagerAdapter extends FragmentPagerAdapter {        public PagerAdapter(FragmentManager fm) {            super(fm);        }        @Override        public Fragment getItem(int position) {            return fragments[position];        }        @Override        public int getCount() {            return fragments.length;        }    }

2.TabLayout+Fragment实现页面切换效果:

核心代码:

@Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_frag);        tabLayout = (TabLayout) findViewById(R.id.tab_layout);        fragments[0] = new HomeFragment();        fragments[1] = new MessageFragment();        fragments[2] = new PlayerFragment();        fragments[3] = new MineFragment();        tabLayout.addTab(tabLayout.newTab().setCustomView(R.layout.item_tablayout));        tabLayout.addTab(tabLayout.newTab().setCustomView(R.layout.item_tablayout));        tabLayout.addTab(tabLayout.newTab().setCustomView(R.layout.item_tablayout));        tabLayout.addTab(tabLayout.newTab().setCustomView(R.layout.item_tablayout));        tabLayout.addOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {            @Override            public void onTabSelected(TabLayout.Tab tab) {                onItemSelected(tab.getPosition());                onItemSelectedState(tab.getPosition());            }            @Override            public void onTabUnselected(TabLayout.Tab tab) {            }            @Override            public void onTabReselected(TabLayout.Tab tab) {            }        });        setTabTitles();        onItemSelected(0);        onItemSelectedState(0);    }    private void onItemSelected(int position) {        FragmentManager manager = getSupportFragmentManager();        FragmentTransaction transaction = manager.beginTransaction();        transaction.replace(R.id.container, fragments[position]);        transaction.commit();    }    private void onItemSelectedState(int position) {        clearTabItemSelectedState();        View itemView = tabLayout.getTabAt(position).getCustomView();        ImageView imageView = (ImageView)itemView.findViewById(R.id.item_image);        TextView name = (TextView)itemView.findViewById(R.id.item_name);        imageView.setImageResource(drawablesSelected[position]);        name.setTextColor(getResources().getColor(R.color.colorSelected));    }    private void clearTabItemSelectedState() {        for (int i = 0; i < tabLayout.getTabCount(); i++) {            View itemView = tabLayout.getTabAt(i).getCustomView();            ImageView imageView = (ImageView) itemView.findViewById(R.id.item_image);            TextView name = (TextView)itemView.findViewById(R.id.item_name);            imageView.setImageResource(drawables[i]);            name.setTextColor(getResources().getColor(R.color.colorNormal));        }    }    private void setTabTitles() {        for (int i = 0; i < 4; i++) {            View itemView = tabLayout.getTabAt(i).getCustomView();            ImageView imageView = (ImageView) itemView.findViewById(R.id.item_image);            TextView tvName = (TextView) itemView.findViewById(R.id.item_name);            tvName.setText(names[i]);            imageView.setImageResource(drawables[i]);        }    }

完整代码：http://download.csdn.net/detail/y472360651/9842376