Implementowanie tabletu Gmail, takiego jak szuflada nawigacji,

Question

Sprawdzałem wygląd tabletu w aplikacji Gmail. W tej implementacji Navigation Drawer implementacja różni się od innych. Załączam obraz w celach informacyjnych.

A także kiedy rozwinąć szufladę powinno się zdarzyć, jak normalne zachowanie szuflady nawigacji.

chciałbym realizować w taki sam sposób. Szukałem, ale znalazłem tylko ten link Który nie jest tak pomocny. Czy ktoś może dać mi sugestie, jak mogę to zrobić!

Answer 1

Możesz użyć SlidingPaneLayout z marginesem na głównym panelu i niestandardowym detektorem dla przejścia poprzecznego.

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

Podklasa SlidingPaneLayout i znaleźć szyby częściowe i pełne w 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); 
} 

Zmiana alfa pełnego panelu i częściowe szyby z detektorem:

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

Również ukrycia panel częściowy po otwarciu układu.

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

Więcej informacji: http://blog.sqisland.com/2015/01/partial-slidingpanelayout.html

Answer 2

Jest niesamowity biblioteki dla tej https://github.com/mikepenz/MaterialDrawer

(Korzystanie MiniDrawer z tej biblioteki)