android - studio - Implementando Gmail Tablet como Navigation Drawer

navigation drawer android kotlin

Question

Estaba buscando en el diseño de la tableta de la aplicación Gmail. En esa aplicación del Navigation Drawer es diferente de los demás. He adjuntado la imagen para su referencia.

Y también cuando amplío el cajón, debería suceder como el comportamiento normal del cajón de navegación.

Me gustaría implementar de la misma manera. Estaba buscando pero solo encontré este link que no es tan útil. ¿Alguien puede darme sugerencias como puedo hacer esto?

Answer 1

Hay una biblioteca impresionante para este https://github.com/mikepenz/MaterialDrawer

(Utilice MiniDrawer de esta biblioteca)

Answer 2

Puede usar un SlidingPaneLayout con un margen en el panel principal y un escucha personalizado para el desvanecimiento cruzado.

<com.sqisland.android.CrossFadeSlidingPaneLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/sliding_pane_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
  <FrameLayout
      android:layout_width="240dp"
      android:layout_height="match_parent"
      android:background="@color/purple">
  <TextView
      android:layout_width="match_parent"
      android:layout_height="match_parent"
      android:text="@string/full"/>
  <TextView
      android:layout_width="64dp"
      android:layout_height="match_parent"
      android:background="@color/blue"
      android:text="@string/partial"/>
  </FrameLayout>
  <TextView
      android:layout_width="400dp"
      android:layout_height="match_parent"
      android:layout_weight="1"
      android:layout_marginLeft="64dp"
      android:background="@color/light_blue"
      android:text="@string/pane_2"/>
</com.sqisland.android.CrossFadeSlidingPaneLayout>

Subclase SlidingPaneLayout y encuentre los paneles parciales y completos en onFinishInflate :

protected void onFinishInflate() {
  super.onFinishInflate();

  if (getChildCount() < 1) {
    return;
  }

  View panel = getChildAt(0);
  if (!(panel instanceof ViewGroup)) {
    return;
  }

  ViewGroup viewGroup = (ViewGroup) panel;
  if (viewGroup.getChildCount() != 2) {
    return;
  }
  fullView = viewGroup.getChildAt(0);
  partialView = viewGroup.getChildAt(1);

  super.setPanelSlideListener(crossFadeListener);
}

Cambie el alfa del panel completo y parcial con un oyente:

private SimplePanelSlideListener crossFadeListener 
    = new SimplePanelSlideListener() {
  public void onPanelSlide(View panel, float slideOffset) {
    super.onPanelSlide(panel, slideOffset);
    if (partialView == null || fullView == null) {
      return;
    }

    partialView.setVisibility(isOpen() ? View.GONE : VISIBLE);
    partialView.setAlpha(1 - slideOffset);
    fullView.setAlpha(slideOffset);
  }
};

Además, oculte el panel parcial cuando se abre el diseño.

protected void onLayout(
    boolean changed, int l, int t, int r, int b) {
  super.onLayout(changed, l, t, r, b);

  if (partialView != null) {
    partialView.setVisibility(isOpen() ? View.GONE : VISIBLE);
  }
}

Más información: http://blog.sqisland.com/2015/01/partial-slidingpanelayout.html