自定义TabLayout：notifydatasetchanged将选项卡的自定义视图恢复为默认视图

Question

以下是我目前得到的结果。

预期结果应该是其中三个表现为第三个选项卡。

这是我设置选项卡布局的方式。

将片段添加到视图分页器/选项卡布局的可重用方法。

public void addFragmentToViewPager(Fragment fragment, String title, int imageRes) {

    FragmentViewPagerAdapter fragmentViewPagerAdapter =
            (FragmentViewPagerAdapter) mViewPager.getAdapter();

    int position = fragmentViewPagerAdapter.addFragment(fragment, title);

    fragmentViewPagerAdapter.notifyDataSetChanged();

    View tabItemView = LayoutInflater.from(getContext()).inflate(R.layout.tab_item_child, null);

    RoundedImageView roundImageView = (RoundedImageView) tabItemView.findViewById(R.id.childitem_riv);

    roundImageView.setImageResource(imageRes);

    TextView textView = (TextView) tabItemView.findViewById(R.id.childitem_tv_title);

    textView.setText(title);

    TabLayout.Tab tab = mTabLayout.getTabAt(position);

    if (tab != null) {
        Log.d(TAG,tab.getText()+"");
        tab.setCustomView(tabItemView);
    }
}

我如何添加片段：

    getView().addFragmentToViewPager(new ReusableMomentFragment(), "One", R.mipmap.ic_launcher);

    getView().addFragmentToViewPager(new ReusableMomentFragment(), "Two", R.mipmap.ic_launcher);

    getView().addFragmentToViewPager(new ReusableMomentFragment(), "Three", R.mipmap.ic_launcher);

我的FragmentViewPagerAdapter：

public class FragmentViewPagerAdapter extends FragmentPagerAdapter {

private final List<Fragment> mFragmentList = new ArrayList<>();
private final List<String> mFragmentTitleList = new ArrayList<>();

public FragmentViewPagerAdapter(FragmentManager manager) {
    super(manager);
}

@Override
public Fragment getItem(int position) {
    return mFragmentList.get(position);
}

@Override
public int getCount() {
    return mFragmentList.size();
}

public int addFragment(Fragment fragment, String title) {
    mFragmentList.add(fragment);
    mFragmentTitleList.add(title);

    return getCount() -1 ;
}

@Override
public CharSequence getPageTitle(int position) {
    return mFragmentTitleList.get(position);
}
}

在addFragmentToViewPager中Log.d的结果为：

04-27 06:49:39.874 14334-14334/com.zxc.zxczxc D/MomentFragment: One
04-27 06:49:39.877 14334-14334/com.zxc.zxczxc D/MomentFragment: Two
04-27 06:49:39.878 14334-14334/com.zxc.zxczxc D/MomentFragment: Three

更新：

我发现，在......之后。

fragmentViewPagerAdapter.notifyDataSetChanged();

“called，选项卡布局将更改为默认视图。有没有办法防止notifyDataSetChanged()影响选项卡布局的自定义视图？因为我的选项卡布局选项卡是动态设置的（应用程序将从服务器获取选项卡内容并设置），所以我的想法是先设置viewpager：”

FragmentViewPagerAdapter fragmentViewPagerAdapter =
            new FragmentViewPagerAdapter(getActivity().getSupportFragmentManager());

    mViewPager.setAdapter(fragmentViewPagerAdapter);

    mTabLayout.setupWithViewPager(mViewPager);

然后使用“：”添加片段。

    public void addFragmentToViewPager(Fragment fragment, String title, int imageRes) {

    FragmentViewPagerAdapter fragmentViewPagerAdapter =
            (FragmentViewPagerAdapter) mViewPager.getAdapter();

    int position = fragmentViewPagerAdapter.addFragment(fragment, title);

    View tabItemView = LayoutInflater.from(getContext()).inflate(R.layout.tab_item_child, null);

    RoundedImageView roundImageView = (RoundedImageView) tabItemView.findViewById(R.id.childitem_riv);

    roundImageView.setImageResource(imageRes);

    TextView textView = (TextView) tabItemView.findViewById(R.id.childitem_tv_title);

    textView.setText(title);

    TabLayout.Tab tab = mTabLayout.getTabAt(position);

    if (tab != null) {
        Log.d(TAG,tab.getText()+"");
        tab.setCustomView(tabItemView);
    }
}

提前感谢。

- wenyang9319

---

你找到解决方案了吗？ - Paul

是的，我已经在下面发布了解决方案。https://dev59.com/_QH3s4cB2Jgan1znooR8#48739721 - wenyang9319

如果我的回答对您有帮助，请毫不犹豫地点赞。提前感谢您的支持。 - wenyang9319

Answer 1

解决方案非常简单。

我们应该了解PagerAdapter.notifyDataSetChange()的工作方式。通过调用它，选项卡将重新加载。我发布的方法是在外部更改布局。这意味着自定义布局将恢复为默认设置。

因此，解决方案是先将片段添加到fragmentViewPager中，然后调用notifyDataSetChanged，并自定义您的布局。

只有在调用notifyDataSetChanged之后才应自定义您的布局。

- wenyang9319

Answer 2

尝试使用 Material Design 的 TabLayout

在 gradle 中：

 compile 'com.android.support:appcompat-v7:23.0.1'
compile 'com.android.support:design:23.0.1'

在代码中：

 public class MainActivity extends AppCompatActivity {

    private Toolbar toolbar;
    private TabLayout tabLayout;
    private ViewPager viewPager;
    private int[] tabIcons = {
            R.drawable.ic_tab_favourite,
            R.drawable.ic_tab_call,
            R.drawable.ic_tab_contacts
    };

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        toolbar = (Toolbar) findViewById(R.id.toolbar);
        setSupportActionBar(toolbar);
        getSupportActionBar().setDisplayHomeAsUpEnabled(true);

        viewPager = (ViewPager) findViewById(R.id.viewpager);
        setupViewPager(viewPager);

        tabLayout = (TabLayout) findViewById(R.id.tabs);
        tabLayout.setupWithViewPager(viewPager);
        setupTabIcons();
    }

    private void setupTabIcons() {

        TextView tabOne = (TextView) LayoutInflater.from(this).inflate(R.layout.custom_tab, null);
        tabOne.setText("ONE");
        tabOne.setCompoundDrawablesWithIntrinsicBounds(0, R.drawable.ic_tab_favourite, 0, 0);
        tabLayout.getTabAt(0).setCustomView(tabOne);

        TextView tabTwo = (TextView) LayoutInflater.from(this).inflate(R.layout.custom_tab, null);
        tabTwo.setText("TWO");
        tabTwo.setCompoundDrawablesWithIntrinsicBounds(0, R.drawable.ic_tab_call, 0, 0);
        tabLayout.getTabAt(1).setCustomView(tabTwo);

        TextView tabThree = (TextView) LayoutInflater.from(this).inflate(R.layout.custom_tab, null);
        tabThree.setText("THREE");
        tabThree.setCompoundDrawablesWithIntrinsicBounds(0, R.drawable.ic_tab_contacts, 0, 0);
        tabLayout.getTabAt(2).setCustomView(tabThree);
    }

    private void setupViewPager(ViewPager viewPager) {
        ViewPagerAdapter adapter = new ViewPagerAdapter(getSupportFragmentManager());
        adapter.addFrag(new OneFragment(), "ONE");
        adapter.addFrag(new TwoFragment(), "TWO");
        adapter.addFrag(new ThreeFragment(), "THREE");
        viewPager.setAdapter(adapter);
    }

    class ViewPagerAdapter extends FragmentPagerAdapter {
        private final List<Fragment> mFragmentList = new ArrayList<>();
        private final List<String> mFragmentTitleList = new ArrayList<>();

        public ViewPagerAdapter(FragmentManager manager) {
            super(manager);
        }

        @Override
        public Fragment getItem(int position) {
            return mFragmentList.get(position);
        }

        @Override
        public int getCount() {
            return mFragmentList.size();
        }

        public void addFrag(Fragment fragment, String title) {
            mFragmentList.add(fragment);
            mFragmentTitleList.add(title);
        }

        @Override
        public CharSequence getPageTitle(int position) {
            return mFragmentTitleList.get(position);
        }
    }
}

布局：

activity_main.xml:

<android.support.design.widget.TabLayout
       android:id="@+id/tabs"
       android:layout_width="match_parent"
       android:layout_height="@dimen/custom_tab_layout_height"
       app:tabMode="fixed"
       app:tabGravity="fill"/>

输出：

这里是详细信息 实现

- rafsanahmad007

---

谢谢您的回答，但我需要将图像显示在圆形图像视图中，并且图像将在运行时由Picasso下载，因此我需要在自定义视图中设置选项卡视图，包括圆形图像视图。上面的答案是将图像设置在选项卡本身而不是自定义视图中（tab.setCompoundDrawablesWithIntrinsicBounds）。无论如何，感谢您的回复。 - wenyang9319