Android TabLayout首次未选中状态分析

最新推荐文章于 2025-09-19 11:33:40 发布

原创最新推荐文章于 2025-09-19 11:33:40 发布 · 1.2k 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#android #TabLayout

android 专栏收录该内容

58 篇文章

订阅专栏

在学习Android TabLayout时遇到一个问题，即首次加载时，所有tab未显示选中状态。经过源码分析发现，当尝试设置选中某个tab，而该tab已经为当前选中状态时，会触发onTabReselected方法。因此，需要在onTabReselected中设置选中状态，以确保正确显示。通过完善代码，解决了这个问题。

最近在学习TabLayout的时候，发现个问题，刚进入的时候，第一个tab并没有变成我们想要的选中状态。
设置选中的状态如下：

tabLayout.addOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
            @Override
            public void onTabSelected(TabLayout.Tab tab) {
                View customView = tab.getCustomView();
                TextView tabItem = customView.findViewById(R.id.tv_tab_item);
                tabItem.setBackgroundColor(Color.parseColor("#ff5500"));
                pager.setCurrentItem(tab.getPosition());
            }

            @Override
            public void onTabUnselected(TabLayout.Tab tab) {
                View customView = tab.getCustomView();
                TextView tabItem = customView.findViewById(R.id.tv_tab_item);
                tabItem.setBackgroundColor(Color.parseColor("#ffffff"));
            }

            @Override
            public void onTabReselected(TabLayout.Tab tab) {               
            }
        });
        tabLayout.getTabAt(0).select();

在这里插入图片描述
就是这种情形，只是将textview的背景色设为橙色，但是如果上面代码设置的话，刚进入的时候是都没有选中的。虽然设置了tabLayout.getTabAt(0).select();，但是会发现是没有效果的，后面跟进源码发现

public void select() {
            if (this.parent == null) {
                throw new IllegalArgumentException("Tab not attached to a TabLayout");
            } else {
                this.parent.selectTab(this);
            }
        }

进入到父布局的设置选中

    void selectTab(TabLayout.Tab tab) {
        this.selectTab(tab, true);
    }

    void selectTab(TabLayout.Tab tab, boolean updateIndicator) {
        TabLayout.Tab currentTab = this.selectedTab;
        if (currentTab == tab) {
            if (currentTab != null) {
                this.dispatchTabReselected(tab);
                this.animateToTab(tab.getPosition());
            }
        } else {
            int newPosition = tab != null ? tab.getPosition() : -1;
            if (updateIndicator) {
                if ((currentTab == null || currentTab.getPosition() == -1) && newPosition != -1) {
                    this.setScrollPosition(newPosition, 0.0F, true);
                } else {
                    this.animateToTab(newPosition);
                }

                if (newPosition != -1) {
                    this.setSelectedTabView(newPosition);
                }
            }

            this.selectedTab = tab;
            if (currentTab != null) {
                this.dispatchTabUnselected(currentTab);
            }

            if (tab != null) {
                this.dispatchTabSelected(tab);
            }
        }

    }

会发现如果当前选中的布局和设置选中的布局是同一个的时候，就会调用dispatchTabReselected(tab)；

private void dispatchTabReselected(@NonNull TabLayout.Tab tab) {
        for(int i = this.selectedListeners.size() - 1; i >= 0; --i) {
            ((TabLayout.BaseOnTabSelectedListener)this.selectedListeners.get(i)).onTabReselected(tab);
        }

    }

就会回调new TabLayout.OnTabSelectedListener() 中的onTabReselected方法，但是我们没有在这个方法内部进行选中设置，所以才会导致刚进入时候三个选项卡都没有选中，这里只要把onTabReselected中设置选中状态即可
完整的代码如下：

tabLayout.addOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
            @Override
            public void onTabSelected(TabLayout.Tab tab) {
                View customView = tab.getCustomView();
                TextView tabItem = customView.findViewById(R.id.tv_tab_item);
                tabItem.setBackgroundColor(Color.parseColor("#ff5500"));
                pager.setCurrentItem(tab.getPosition());
            }

            @Override
            public void onTabUnselected(TabLayout.Tab tab) {
                View customView = tab.getCustomView();
                TextView tabItem = customView.findViewById(R.id.tv_tab_item);
                tabItem.setBackgroundColor(Color.parseColor("#ffffff"));
            }

            @Override
            public void onTabReselected(TabLayout.Tab tab) {
                View customView = tab.getCustomView();
                TextView tabItem = customView.findViewById(R.id.tv_tab_item);
                tabItem.setBackgroundColor(Color.parseColor("#ff5500"));
                pager.setCurrentItem(tab.getPosition());
            }
        });
        tabLayout.getTabAt(0).select();

这样就没有问题了。