Android SlidingTabLayout底部选项卡槽Tab水平居中

蔚落 2024-02-17 16:22 108阅读 0赞



Android SlidingTabLayout底部选项卡槽Tab水平居中

Android SlidingTabLayout默认情况下添加的选项卡是如图1样式:

Center

实际的开发需求中,通常UI设计师会将这些Tab平均分配位置,以达到如图2所示效果:

Center 1

这样以实现相对较好的外观样式,但可惜的是原生的Android SlidingTabLayout代码中并不支持这样的属性设置,为实现此目标,需要自己动手修改Android SlidingTabLayout源代码以实现开发需求。
找到Android SlidingTabLayout源代码,在Android SlidingTabLayout源代码中有一个方法:
private void populateTabStrip();

  1. private void populateTabStrip() {
  2. final PagerAdapter adapter = mViewPager.getAdapter();
  3. final View.OnClickListener tabClickListener = new TabClickListener();
  4. for (int i = 0; i < adapter.getCount(); i++) {
  5. View tabView = null;
  6. TextView tabTitleView = null;
  7. if (mTabViewLayoutId != 0) {
  8. // If there is a custom tab view layout id set, try and inflate
  9. // it
  10. tabView = LayoutInflater.from(getContext()).inflate(mTabViewLayoutId, mTabStrip, false);
  11. tabTitleView = (TextView) tabView.findViewById(mTabViewTextViewId);
  12. }
  13. if (tabView == null) {
  14. tabView = createDefaultTabView(getContext());
  15. }
  16. if (tabTitleView == null && TextView.class.isInstance(tabView)) {
  17. tabTitleView = (TextView) tabView;
  18. }
  19. tabTitleView.setText(adapter.getPageTitle(i));
  20. tabView.setOnClickListener(tabClickListener);
  21. mTabStrip.addView(tabView);
  22. }
  23. }

这是谷歌官方实现的Android SlidingTabLayout添加底部选项卡Tab的代码,如果为了实现前文所述的将Tab均分水平位置空间,则需要修改此方法,在此方法中添加如下代码:

  1. LinearLayout.LayoutParams layoutParams= new LinearLayout.LayoutParams(0, LayoutParams.WRAP_CONTENT, 1.0f);
  2. tabView.setLayoutParams(layoutParams);

这两段代码将tab view水平均分放置。

最终将private void populateTabStrip()改进成这样:

  1. private void populateTabStrip() {
  2. final PagerAdapter adapter = mViewPager.getAdapter();
  3. final View.OnClickListener tabClickListener = new TabClickListener();
  4. for (int i = 0; i < adapter.getCount(); i++) {
  5. View tabView = null;
  6. TextView tabTitleView = null;
  7. if (mTabViewLayoutId != 0) {
  8. // If there is a custom tab view layout id set, try and inflate
  9. // it
  10. tabView = LayoutInflater.from(getContext()).inflate(mTabViewLayoutId, mTabStrip, false);
  11. tabTitleView = (TextView) tabView.findViewById(mTabViewTextViewId);
  12. }
  13. if (tabView == null) {
  14. tabView = createDefaultTabView(getContext());
  15. }
  16. if (tabTitleView == null && TextView.class.isInstance(tabView)) {
  17. tabTitleView = (TextView) tabView;
  18. }
  19. tabTitleView.setText(adapter.getPageTitle(i));
  20. tabView.setOnClickListener(tabClickListener);
  21. //添加by Zhang Phil
  22. LinearLayout.LayoutParams layoutParams= new LinearLayout.LayoutParams(0, LayoutParams.WRAP_CONTENT, 1.0f);
  23. tabView.setLayoutParams(layoutParams);
  24. //添加by Zhang Phil
  25. mTabStrip.addView(tabView);
  26. }
  27. }

即可实现如图2所示的底部选项卡中的子元素水平均分选项栏目的样式。

发表评论

表情:
评论列表 (有 0 条评论,108人围观)

还没有评论,来说两句吧...

相关阅读

    相关 tab选项

    tab选项卡 tab选项卡 tab选项卡可以说是一个可以在一个·规定的位置中可以嵌套多个页面或小页面,也可以说是一本笔记本可以有很多张纸,那么多纸都封装在笔记本里面,可以