para - navigation view android studio tutorial

Obteniendo DrawerLayout para deslizar sobre la barra de acción

Question

Tengo un menú de cajón deslizante en una actividad, que tiene una barra de acción con algunas pestañas.

Me gustaría que el cajón deslizante se deslice sobre las pestañas, no debajo de ellas.

Esto es lo que parece ahora ...

¿Alguna idea sobre cómo se podría hacer esto?

Nota: entiendo que podría estar rompiendo algunas convenciones y patrones de UI aquí, y si no funciona en absoluto, buscaré alternativas. Pero me gustaría que esto funcione primero.

EDITAR: vea la siguiente captura de pantalla de la aplicación Google Play Music que hace exactamente lo que necesito. Vea la respuesta de @ CommonsWare a continuación donde él acepta que podría estar rompiendo una convención. Pero luego, dada la aplicación Play Music, puede que no sea tan raro tampoco.

Answer 1

¿Alguna idea sobre cómo se podría hacer esto?

Realice cualquiera de las siguientes acciones:

• Cambie las pestañas de la barra de acción, tal vez a ViewPager y un indicador de pestañas ( PagerTabStrip , TabPageIndicator de ViewPageIndicator)

• Vea si una implementación existente de un cajón de terceros aún no se ha actualizado a los nuevos estándares de UI

• Tenedor del DrawerLayout y DrawerLayout a tu medida.

• Rueda tu propio cajón de navegación desde cero

Entiendo que podría estar rompiendo algunas convenciones y patrones de UI aquí

Correct

Answer 2

Actionbar Navigaton Drawer y SwipeTabs no se pueden usar simultáneamente. Debe implementar Navigation Drawer utilizando Actionbar y swipetabs con Tabhosts simples. Puede usar Tabhost para pestañas y fragmentos para la vista interna de cada pestaña. Los fragmentos se deben utilizar a través de viewpager para proporcionar un efecto de desplazamiento / desplazamiento. Conecte las pestañas y el viewpager entre sí a través de sus métodos

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >

<TabHost
    android:id="@+id/tabHost"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical" >

        <HorizontalScrollView
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:fillViewport="true"
            android:scrollbars="none" >

            <TabWidget
                android:id="@android:id/tabs"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content" >
            </TabWidget>
        </HorizontalScrollView>

        <FrameLayout
            android:id="@android:id/tabcontent"
            android:layout_width="match_parent"
            android:layout_height="match_parent" >

            <android.support.v4.view.ViewPager
                android:id="@+id/viewPager_home"
                android:layout_width="match_parent"
                android:layout_height="match_parent" />
        </FrameLayout>
    </LinearLayout>
</TabHost>

Answer 3

Consulte también esta biblioteca http://www.androidviews.net/2013/04/pager-sliding-tabstrip/ El chico hizo un gran trabajo. Puedes usarlo con un cajón de navegación y funciona perfectamente.

Answer 4

Esto se puede hacer SIN una biblioteca de terceros. Echa un vistazo a las muestras de Google Sliding Tabs

     SlidingTabsBasic:   http://developer.android.com/samples/SlidingTabsBasic/project.html
     SlidingTabsColors:  http://developer.android.com/samples/SlidingTabsColors/project.html

Además, echa un vistazo a este enlace impresionante: http://manishkpr.webheavens.com/android-sliding-tabs-example/ Trabajó como un encanto para mí. :)

Answer 5

Finalmente, una forma limpia de lograr un cajón de navegación sobre las pestañas deslizantes en este blog http://www.paulusworld.com/technical/android-navigationdrawer-sliding-tabs

Answer 6

Logré alcanzar este requisito configurando el modo de navegación dentro de las funciones OnDrawerClosed y onDrawerOpened. Es una solución temporal ya que las pestañas en realidad no desaparecen inmediatamente.

  public void onDrawerClosed(View view) {
          getActionBar().setTitle(mTitle);
          if(getActionBar().getTabCount()>0) //Add tabs when the fragment has it
          getActionBar().setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);               
                        ...
                    }

   public void onDrawerOpened(View drawerView) {
            getActionBar().setTitle(mDrawerTitle);
            getActionBar().setNavigationMode(ActionBar.NAVIGATION_MODE_STANDARD);              
                    ..

                    }

Si tiene algunos fragmentos con pestañas y otros sin ella, no olvide eliminar las pestañas en Crear un fragmento que no tenga pestañas.

 getActionBar().removeAllTabs();

Answer 7

Play music no utiliza ActionBar.Tab estándar. Luego, puede implementar su propio contenedor de pestañas extendiendo HorizontalScrollView y trabajar junto con ViewPager.

Answer 8

Tengo pestañas de uso dentro del fragmento de cajón. Resuelvo este problema añadiendo

getActionBar().setNavigationMode(ActionBar.NAVIGATION_MODE_TABS); 

en onDrawerClosed() y getActionBar().setNavigationMode(ActionBar.NAVIGATION_MODE_STANDARD); en el método onDrawerOpend()

Espero que esto ayude.

Answer 9

Tuve el mismo problema, pero la única solución que encontré fue usar pestañas dentro del fragmento interno (no fragmentActivity). No sé si fue la mejor solución, el único problema que tuve fue diseñar estas pestañas, para el resto, funciona perfectamente

Answer 10

puede usar las bibliotecas de abajo para obtener un modelo de navegación similar a la aplicación Google Play Music.

• ActionBarSherlock (github)
• fragmentos anidados (github)
• PagerSlidingTabStrip (github)
• NavigationDrawer (sitio de desarrolladores de Android)
• La última biblioteca de soporte v4

He creado un cajón de navegación de proyectos con Tab Strip Ejemplo en github, échale un vistazo.

A continuación se muestra la captura de pantalla de la misma.