Inicio » Blog » Android

3 julio, 2020

Drawer con Tabs

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

Ver video en

Suscríbete a nuestro canal en Youtube

Suscríbirse

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;
        }
    }
}

 

 

build.gradle (actualizado 2021)

plugins {
    id 'com.android.application'
}

android {
    compileSdkVersion 30

    defaultConfig {
        applicationId "com.codea.drawertabs"
        minSdkVersion 16
        targetSdkVersion 30
        versionCode 1
        versionName "1.0"

        testInstrumentationRunner "androidx.test.runner.AndroidJUnitRunner"
    }

    buildTypes {
        release {
            minifyEnabled false
            proguardFiles getDefaultProguardFile('proguard-android-optimize.txt'), 'proguard-rules.pro'
        }
    }
    compileOptions {
        sourceCompatibility JavaVersion.VERSION_1_8
        targetCompatibility JavaVersion.VERSION_1_8
    }
}


Leido 3660 veces

Descarga el código fuente Android

Recurso descargado 52 veces

USD

Descargar Código Fuente

Compartir link del tutorial con tus amigos


Android PHP MySql App Restaurant Android PHP MySql App Restaurant

Curso Android, PHP y MySql App Restaurant con Pedidos Delivery

Descarga del código fuente

USD 27.00

Android PHP MySql Lector QR Android PHP MySql Lector QR

Curso Lector QR en Android con servicios web en PHP y MySql

Descarga del código fuente

USD 10.00

App Minimarket con Scanner QR App Minimarket con Scanner QR

Curso App Minimarket con Lector QR en Android, Flutter y Laravel

Descarga del código fuente

USD 200.00

Aprende más sobre Android

Cursos de programación

Codea Codea App

México, Colombia, España, Venezuela, Argentina, Bolivia, Perú

© Todos los derechos reservados Codea App | ...de frente al código!!! | 2020 - 2023