web-dev-qa-db-ja.com

TabLayout（material design）androidのタブを動的に追加および削除します

TabLayoutがあり、その中にViewPagerがあります。 tablayout（material design）で動的にタブを追加および削除する必要があります。タブを動的に追加できますが、タブを削除している間、タブは正しく削除されます。ただし、viewpagerの最後のアイテムは削除されます。そのため、タブには特定のフラグメントが表示されていません。参考までにFragmentPagerAdapterを使用しました。

私はこのチュートリアルに従ってこれを実装しました

https://androidbelieve.com/navigation-drawer-with-swipe-tabs-using-design-support-library

public class TabFragment extends Fragment {

    public static TabLayout tabLayout;
    public static ViewPager viewPager;
    public static int int_items = 2;
    private MyNewsFragment mMyNewsFragment;
    private ArrayList<TabFragmentModelClass> mFragmentArrayList;
    private TabLayoutAdapter mTabLayoutAdapter;

    @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {

        mMyNewsFragment = new MyNewsFragment();
        /**
         *Inflate tab_layout and setup Views.i;;a
         */
        View x = inflater.inflate(R.layout.tab_layout, null);
        tabLayout = (TabLayout) x.findViewById(R.id.tabs);
        tabLayout.setTabMode(TabLayout.MODE_SCROLLABLE);  // scorllable tab
        tabLayout.setTabGravity(TabLayout.GRAVITY_FILL);  // tab name fill parent
        viewPager = (ViewPager) x.findViewById(R.id.viewpager);
        mFragmentArrayList = new ArrayList<>();
        mFragmentArrayList.add(new TabFragmentModelClass(new MyNewsSelectionFragment(), "", ""));
        mFragmentArrayList.add(new TabFragmentModelClass(mMyNewsFragment, "", getResources().getString(R.string.mynews)));
        mFragmentArrayList.add(new TabFragmentModelClass(new BreakingNewsFragment(), "", getResources().getString(R.string.breakingnews)));

        // Selected news from shared preference
        ArrayList<MyNewsSharedPreferenceModelClass> tempSharedPreferenceModelClass = new MyNewsSharedPreferenceClass().loadFavorites(getActivity());
        for (int i = 0; i < tempSharedPreferenceModelClass.size(); i++) {
            mFragmentArrayList.add(new TabFragmentModelClass(new CategoreyNewsFragment(tempSharedPreferenceModelClass.get(i).getmCatID()), tempSharedPreferenceModelClass.get(i).getmCatID(),
                    tempSharedPreferenceModelClass.get(i).getmCatName()));
        }


 }


        /**
         *Set an Apater for the View Pager
         */
        mTabLayoutAdapter = new TabLayoutAdapter(getChildFragmentManager(), mFragmentArrayList);
        viewPager.setAdapter(mTabLayoutAdapter);
        viewPager.setOffscreenPageLimit(mFragmentArrayList.size());
        tabLayout.setupWithViewPager(viewPager);


        viewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
            @Override
            public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
            }

            @Override
            public void onPageSelected(int position) {
                tabLayout.getTabAt(position);
            }

            @Override
            public void onPageScrollStateChanged(int state) {
                if (state == 1) {
                    updateMyNewsFragment();
                }
            }
        });

        /**
         * Now , this is a workaround ,
         * The setupWithViewPager dose't works without the runnable .
         * Maybe a Support Library Bug .
         */

        tabLayout.post(new Runnable() {
            @Override
            public void run() {

                tabLayout.getTabAt(0).setIcon(R.mipmap.mynewselection);

                tabLayout.setOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
                    @Override
                    public void onTabSelected(TabLayout.Tab tab) {
                        viewPager.setCurrentItem(tab.getPosition());
                        switch (tab.getPosition()) {
                            case 1:

                                System.out.println("000000000000000000000 ");
                                updateMyNewsFragment();
                                break;
                        }
                    }

                    @Override
                    public void onTabUnselected(TabLayout.Tab tab) {
                    }


                    @Override
                    public void onTabReselected(TabLayout.Tab tab) {
                    }
                });

            }
        });
        return x;
    }

    /**
     * update the mynews selection
     * this method trigger from the MainNewsActivity
     */
    public void updateMyNewsFragment() {
        if (ApplicationController.getInstance().getBoolPref(CommonVariableInterFace.isNewsSelected)) {
            mMyNewsFragment.sendMyNewsRequest();
            ApplicationController.getInstance().setBoolPref(CommonVariableInterFace.isNewsSelected, false);
        }
    }

    /**
     * update the tab values
     * this method trigger from the MainNewsActivity
     * if value is zero need to add in tab
     * if value is one need to remove in tab
     */
    public void updateTabvalue(String catId, String catName, int value) {

            if (value == 0) { // add the value in tab

                mFragmentArrayList.add(new TabFragmentModelClass(new CategoreyNewsFragment(catId), catId,
                        catName));
            }  else {      // Removing the tab
                for (int i = 0; i < mFragmentArrayList.size(); i++) {
                    if (mFragmentArrayList.get(i).getmCatID().equalsIgnoreCase(catId)) {

                        Log.i("-----same id ", catId);
                        mFragmentArrayList.remove(i);
                        mTabLayoutAdapter = new TabLayoutAdapter(getChildFragmentManager(), mFragmentArrayList);
                        viewPager.setAdapter(mTabLayoutAdapter);
                    }
                }
            }

            mTabLayoutAdapter.notifyDataSetChanged();
            viewPager.setOffscreenPageLimit(mFragmentArrayList.size());
            tabLayout.getTabAt(0).setIcon(R.mipmap.mynewselection);
             tabLayout.setupWithViewPager(viewPager);


            tabLayout.post(new Runnable() {
                @Override
                public void run() {

                    tabLayout.getTabAt(0).setIcon(R.mipmap.mynewselection);

                    tabLayout.setOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
                        @Override
                        public void onTabSelected(TabLayout.Tab tab) {
                            viewPager.setCurrentItem(tab.getPosition());
                            switch (tab.getPosition()) {
                                case 1:
                                    updateMyNewsFragment();
                                    break;
                            }
                        }

                        @Override
                        public void onTabUnselected(TabLayout.Tab tab) {
                        }


                        @Override
                        public void onTabReselected(TabLayout.Tab tab) {
                        }
                    });

                }
            });
    }

    public void openSpecificTab() {

//        tabLayout.settab
//        tabLayout.se
    }
}

アダプターコード：

public class TabLayoutAdapter extends FragmentPagerAdapter {

    private long baseId = 0;
    ArrayList<TabFragmentModelClass> fragmentAdapterArrayList;

    public TabLayoutAdapter(FragmentManager fm, ArrayList<TabFragmentModelClass> fragmentArrayList) {
        super(fm);
        fragmentAdapterArrayList = fragmentArrayList;
    }

    @Override
    public Fragment getItem(int position) {

        if (position == 0)
            return fragmentAdapterArrayList.get(position).getmFragment();
        if (position == 1)
            return fragmentAdapterArrayList.get(position).getmFragment();
        if (position == 2)
            return fragmentAdapterArrayList.get(position).getmFragment();

        return new CategoreyNewsFragment().newInstance(fragmentAdapterArrayList.get(position).getmCatID());
    }

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


    //this is called when notifyDataSetChanged() is called
    @Override
    public int getItemPosition(Object object) {
        // refresh all fragments when data set changed
        return TabLayoutAdapter.POSITION_NONE;
    }


    @Override
    public long getItemId(int position) {
        // give an ID different from position when position has been changed
        return baseId + position;
    }

    /**
     * Notify that the position of a fragment has been changed.
     * Create a new ID for each position to force recreation of the fragment
     *
     * @param n number of items which have been changed
     */
    public void notifyChangeInPosition(int n) {
        // shift the ID returned by getItemId outside the range of all previous fragments
        baseId += getCount() + n;
    }

    /**
     * //     * This method returns the title of the tab according to the position.
     * //
     */

    @Override
    public CharSequence getPageTitle(int position) {
        return fragmentAdapterArrayList.get(position).getmCatName();
    }
}
androidandroid-viewpagerandroid-design-libraryandroid-tablayout
38
Ruban

TabLayoutからタブを削除します

...
public void removeTab(int position) {
    if (mTabLayout.getTabCount() >= 1 && position<mTabLayout.getTabCount()) {
          mTabLayout.removeTabAt(position);
          mPagerAdapter.removeTabPage(position);
    }
}
...

removeTabPageメソッドをPagerAdapterに追加します

...
public void removeTabPage(int position) {
    if (!tabItems.isEmpty() && position<tabItems.size()) {
          tabItems.remove(position);
          notifyDataSetChanged();
    }
}
...

Tabを追加します

...
private void addTab(String title) {
        mTabLayout.addTab(mTabLayout.newTab().setText(title));
        mPagerAdapter.addTabPage(title);
}
...

addTabPageメソッドをPagerAdapterに追加します

...
public void addTabPage(String title) {
      tabItems.add(title);
      notifyDataSetChanged();
}
...

完全な例については、このサンプルコードをご覧ください。 ... samples/SupportDesignDemos/src/com/example/Android/support/design/widget/TabLayoutUsage.Java

41
TouchBoarder

新しいサポートライブラリ（私は23.2.1を使用しています）では、TabLayoutではなくViewpagerにのみ追加する必要があります（そうしないと、ダブルタブやその他のファンキーな動作になります）。更新するには TouchBoarderの答え ：

RemoveTabPageメソッドをPagerAdapterに追加します

public void removeTabPage(int position) {
    if (!tabItems.isEmpty() && position<tabItems.size()) {
          tabItems.remove(position);
          notifyDataSetChanged();
    }
}

AddTabPageメソッドをPagerAdapterに追加します

public void addTabPage(String title) {
      tabItems.add(title);
      notifyDataSetChanged();
}
10
MidasLefko

既存の回答に加えて、tabLayoutからすべてのタブを削除します。

tabLayout.removeAllTabs();
0
Shahbaz Hashmi