2015-09-30 15 views
6

Ich benutze ein Fragment, um die Kommentare und Bewertungen zu zeigen, ich möchte einen Effekt wie wenn wir das Fragment nach oben oder unten ziehen geschlossen oder verschwinden mit Animation, wie das Layout von Facebook kommentieren.Wie man ein Fragment beim Hochziehen oder Herunterziehen schließt?

Dies ist mein Layout, Es enthält eine Recyclerview.

enter image description here

Ich möchte, dass, wenn ich dieses Layout nach oben oder unten ziehen, es so schließt wie Facebook Kommentar Layout der Fall ist.

enter image description here

Können Sie mir bitte deuten auf eine Art und Weise, wie, wie kann ich diese Funktionalität erreichen.

Antwort

0

Ein einfacher Trick, der je nach Anwendungsfall funktionieren könnte, ist die Implementierung mit BottomSheetBehaviour.

Vorteile:

  • keine externen Bibliotheken erforderlich (außer Support-Design)
  • relativ leicht zu
  • Viele Beispiele
  • einfache Animationen zu optimieren, auf der Basis beginnen public void onSlide(@NonNull View bottomSheet, float slideOffset)

Sie würden structu Re Sie so etwas wie dieses Schnipsel xml:

<android.support.design.widget.CoordinatorLayout > 
<android.support.design.widget.AppBarLayout > 
    <android.support.design.widget.CollapsingToolbarLayout > 
     <android.support.v7.widget.Toolbar /> 
    </android.support.design.widget.CollapsingToolbarLayout > 
</android.support.design.widget.AppBarLayout > 
<include layout="@layout/content_layout" /> 
<FrameLayout 
    android:layout_width="match_parent" 
    android:layout_height="300dp" 
    android:fitsSystemWindows="true" 
    app:behavior_hideable="false" 
    app:behavior_peekHeight="0dp" 
    app:layout_behavior="@string/bottom_sheet_behavior"> 
    <include layout="@layout/bottom_sheet_content_view" /> 
</FrameLayout> 
</android.support.design.widget.CoordinatorLayout> 

Einige helfen, um loszulegen:

https://medium.com/@nullthemall/new-bottomsheet-caab21aff19b

https://code.tutsplus.com/articles/how-to-use-bottom-sheets-with-the-design-support-library--cms-26031

Verwandte Themen