代码之家  ›  专栏  ›  技术社区  ›  Bleaker

选项卡文本随viewpager消失

  •  1
  • Bleaker  · 技术社区  · 9 年前

    一个非常简单的例子。我认为大多数人都是这样实现标签的。但是选项卡文本丢失了。

    设计支持库的版本是最新的24.2.0。

    这是我的布局代码:

    <android.support.design.widget.TabLayout
        android:id="@+id/tabs"
        app:tabTextColor="@android:color/darker_gray"
        app:tabSelectedTextColor="@android:color/white"
        android:background="@color/colorPrimary"
        android:minHeight="?attr/actionBarSize"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
    
        <android.support.design.widget.TabItem
            android:text="@string/tab_domain"
            android:layout_width="match_parent"
            android:layout_height="wrap_content" />
    
        <android.support.design.widget.TabItem
            android:text="@string/tab_upload"
            android:layout_width="match_parent"
            android:layout_height="wrap_content" />
    
        <android.support.design.widget.TabItem
            android:text="@string/tab_download"
            android:layout_width="match_parent"
            android:layout_height="wrap_content" />
    
    </android.support.design.widget.TabLayout>
    
    <android.support.v4.view.ViewPager
        android:id="@+id/pager"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />
    

    我使用ButterKnife 8.2.1绑定视图对象。下面是我在onCreate()中的活动代码:

        final DiagnosePagerAdapter adapter = new DiagnosePagerAdapter(getSupportFragmentManager(),
                tabs.getTabCount());
        tabs.setupWithViewPager(pager);
        pager.setAdapter(adapter);
        pager.addOnPageChangeListener(new TabLayout.TabLayoutOnPageChangeListener(tabs));
    

    这是我的适配器:

        class DiagnosePagerAdapter extends FragmentStatePagerAdapter {
        int mNumOfTabs;
        List<Fragment> fragments = new ArrayList<>();
    
        public DiagnosePagerAdapter(FragmentManager fm, int numberOfTabs) {
            super(fm);
            this.mNumOfTabs = numberOfTabs;
            fragments.add(new DomainFragment());
            fragments.add(new UploadFragment());
            fragments.add(new DownloadFragment());
        }
    
        @Override
        public Fragment getItem(int position) {
            return fragments.get(position);
        }
    
        @Override
        public int getCount() {
            return mNumOfTabs;
        }
    }
    

    Using TabLayout inside a Fragment; tab text invisible

    回答这个问题的人说,这个问题在23.0.0中得到了解决,所有的解决方法都无法在我的手机上使用,包括小米HM 2A和华为设备。

    4 回复  |  直到 9 年前
        1
  •  10
  •   Monish Kamble    9 年前

    您必须覆盖 getPageTitle() 如下(我认为这将解决您的问题):

    @Override
        public CharSequence getPageTitle(int position) {
            switch (position) {
                case 0:
                    return "Domain";
                case 1:
                    return "Upload";
                case 2:
                    return "Download";
            }
            return null;
        }
    

    此外,由于选项卡的数量是固定的,因此应该使用 FragmentPagerAdapter 而不是 FragmentStatePagerAdapter 。然后更改xml布局,如下所示:

    <android.support.design.widget.TabLayout
        android:id="@+id/tabs"
        app:tabTextColor="@android:color/darker_gray"
        app:tabSelectedTextColor="@android:color/white"
        android:background="@color/colorPrimary"
        android:minHeight="?attr/actionBarSize"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"/>
    
    <android.support.v4.view.ViewPager
        android:id="@+id/pager"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />
    

    class DiagnosePagerAdapter extends FragmentPagerAdapter {
    
        public DiagnosePagerAdapter(FragmentManager fm) {
            super(fm);
        }
    
        @Override
        public Fragment getItem(int position) {
            Fragment fragment = null;
            switch (position) {
                case 0:
                    fragment = new DomainFragment();
                    break;
                case 1:
                    fragment = new UploadFragment();
                    break;
                case 2:
                    fragment = new DownloadFragment();
                    break;
            }
            return fragment;
        }
    
        @Override
        public int getCount() {
            return 3;
        }
    
        @Override
        public CharSequence getPageTitle(int position) {
            switch (position) {
                case 0:
                    return "Domain";
                case 1:
                    return "Upload";
                case 2:
                    return "Download";
            }
            return null;
        }
    
    }
    

    并更改您的 onCreate() 如下:

    final DiagnosePagerAdapter adapter = new DiagnosePagerAdapter(getSupportFragmentManager());
    pager.setAdapter(adapter);//call setAdapter() before setupWithViewPager()
    tabs.setupWithViewPager(pager);
    
        2
  •  0
  •   Bobin    5 年前

    选项卡的文本被覆盖,因为Android不使用您在布局xml中定义的选项卡。相反,它会创建全新的选项卡。

    但是,如果你想添加一个图标,或对选项卡做一些其他事情,那么你必须在第一个创建的片段中执行以下操作。

    public void onCreateView(...) {
        ...
        TabLayout tabLayout = getActivity().findViewById(R.id.tabLayout);
        PagerAdapter.setTitle(tabLayout);
    

    然后在PagerAdapter中。。。

    public static void setTitle(TabLayout tabLayout) {
        TabLayout.Tab tab;
    
        tab = tabLayout.getTabAt(0);
        tab.setIcon(R.drawable.home_icon);
        tab.setText(R.string.my);
    
        tab = tabLayout.getTabAt(1);
        tab.setIcon(R.drawable.icon_search);
        tab.setText(R.string.search);
    
        tab = tabLayout.getTabAt(2);
        tab.setIcon(R.drawable.icon_settings);
        tab.setText(R.string.settings);
    }
    

    我觉得这有点乱,但我没有找到其他方法。

        3
  •  0
  •   Sahil Bansal    5 年前

    使tablayout可滚动为true,以便显示文本的完整名称。 您可以使用以下代码作为参考。

     <androidx.viewpager.widget.ViewPager
        android:id="@+id/view_pager"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        app:layout_constraintTop_toBottomOf="@+id/tb_socialMedia_fragment">
    
        <com.google.android.material.tabs.TabLayout
            android:id="@+id/tab_layout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:tabInlineLabel="true"
            app:tabMode="scrollable"
            />
    </androidx.viewpager.widget.ViewPager>
    
        4
  •  0
  •   Suraj Rao Raas Masood    5 年前

    如果要将名称添加到tablayout并添加类,可以使用以下代码

    class SocialMediaVpAdapter(
        var fragmentManager: FragmentManager, var context :Context) : FragmentPagerAdapter(fragmentManager) {
        override fun getCount(): Int {
            return 4
        }
    
        override fun getPageTitle(position: Int): CharSequence? {
             return when (position) {
                0 -> {
                    context.getString(R.string.social_all)
                }
                1 -> {
                    context.getString(R.string.social_facebook)
                }
                2 -> {
                    context.getString(R.string.social_Instagram)
                }
                3 ->{
                    context.getString(R.string.social_tiktok)
                }
    
                else ->context.getString(R.string.social_all)
             }
        }
    
        override fun getItem(position: Int): Fragment {
            return when (position) {
                0 -> {
                    AllSocialMedia()
                }
                1 -> {
                    FbSocialMediaActivity()
                }
                2 -> {
                    InstagramSocialMedia()
                }
                3 ->{
                    TikTokSocialMedia()
                }
    
                else -> AllSocialMedia()
            }
        }
    }