Drawer con Tabs

¿Cómo crear menu de lateral drawer con tablayout y viewpage?

VIDEO ¿Cómo crear menu de lateral drawer con tablayout y viewpage?

Para crear un drawer con tabs integraremos en un fragmento inicial el componente tablayout e inflaremos un adapter con pagerAdapter

Implementación de una aplicación Android con los siguientes componentes:

  • Menu Drawer
  • TabLayout
  • ViewPage
  • PagerAdapter

Al fragmento home_fragment integraremos el tablayout para incluir tres fragmentos, el componente Tablayout nos permitirá un desplazamiento entre cada fragmento.

Desarrollo con Android Studio con el lenguaje Java y XML.

Algo muy importante para la compatibilidad es que estamos en Android Legacy antes de AndroidX.

Veamos parte del código:

public class HomeFragment extends Fragment {

    private HomeViewModel homeViewModel;
    private ViewPager _pages;
    private TabLayout _tabs;
    private PagerAdapter _adapter;

    public View onCreateView(@NonNull LayoutInflater inflater,
                             ViewGroup container, Bundle savedInstanceState) {
        homeViewModel =
                ViewModelProviders.of(this).get(HomeViewModel.class);
        View root = inflater.inflate(R.layout.fragment_home, container, false);

        _tabs = root.findViewById(R.id.menutabs);
        _pages =    root.findViewById(R.id.pagetabs);

        _tabs.addTab(_tabs.newTab().setIcon(R.drawable.ic_menu_camera).setText("FRUTAS"));
        _tabs.addTab(_tabs.newTab().setIcon(R.drawable.ic_menu_camera).setText("VERDURAS"));
        _tabs.addTab(_tabs.newTab().setIcon(R.drawable.ic_menu_camera).setText("MENESTRAS"));

        _adapter = new PagerAdapter(getActivity().getSupportFragmentManager(),_tabs.getTabCount());
        _pages.setAdapter(_adapter);
        _pages.addOnPageChangeListener(new TabLayout.TabLayoutOnPageChangeListener(_tabs));
        _tabs.setOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
            @Override
            public void onTabSelected(TabLayout.Tab tab) {
                _pages.setCurrentItem(tab.getPosition());
            }

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

            }

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

            }
        });
        return root;
    }
    public  class PagerAdapter extends FragmentPagerAdapter{

        int _numerodetabs;
        public PagerAdapter(FragmentManager fm, int numerodetabs) {
            super(fm);
            this._numerodetabs = numerodetabs;
        }

        @Override
        public Fragment getItem(int i) {
            Fragment fragment = null;
            switch (i){
                case 0: fragment = new FrutasFragment(); break;
                case 1: fragment = new VerdurasFragment(); break;
                case 2: fragment = new MenestrasFragment(); break;
            }
            return fragment;
        }

        @Override
        public int getCount() {
            return _numerodetabs;
        }
    }
}

 

Compártelo...talvez alguién lo necesite!

Whatsapp Messenger Facebook Twitter

Visitado 343 veces | Publicado hace 3 meses

Curso Flutter y Laravel Tienda Abarrotes con Delivery

Mira el temario del curso en el siguiente link
VER MÁS DETALLES DEL CURSO

Logo Codea App

Develop your code

© Todos los derechos reservados CODEA APP | Cursos de programación avanzados con proyectos reales | 2020