Ich möchte das Muster "Flexibler Raum mit überlappendem Inhalt" aus den Bildlauftechniken für das Materialdesign implementieren , wie in diesem Video :
Mein XML-Layout sieht momentan so aus:
<android.support.design.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="192dp"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.design.widget.CollapsingToolbarLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<android.support.v7.widget.Toolbar
android:layout_height="?attr/actionBarSize"
android:layout_width="match_parent"
app:layout_collapseMode="pin"/>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<....>
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
</android.support.design.widget.CoordinatorLayout>
Gibt es eine einfache Möglichkeit, dies mithilfe der Designbibliothek zu erreichen? Oder muss ich ein benutzerdefiniertes CoordinatorLayout.Behavior erstellen , um dies zu tun?
android
android-design-library
android-collapsingtoolbarlayout
ianhanniballake
quelle
quelle
Antworten:
Das Überlagern der Bildlaufansicht mit dem AppBarLayout ist eine enthaltene Funktion der Android Design Support Library : Sie können das
app:behavior_overlapTop
Attribut in IhrerNestedScrollView
(oder einer beliebigen Ansicht mit ScrollingViewBehavior ) verwenden, um den Überlappungsbetrag festzulegen:Beachten Sie, dass dies
app:behavior_overlapTop
nur für Ansichten funktioniert, die dasapp:layout_behavior="@string/appbar_scrolling_view_behavior"
Verhalten haben, das das Attribut verwendet (nicht die Ansicht oder die übergeordnete Ansichtsgruppe, wie Attribute normalerweise gelten), daher dasbehavior_
Präfix.Oder setzen Sie es programmgesteuert über setOverlayTop () :
quelle
layout_behavior
und eingestellt habebehavior_overlapTop
) hinter seinem Geschwister AppBarLayout landet. Ich habe versucht, die Reihenfolge im XML zu ändern, aber es scheint keine Auswirkungen zu haben. Irgendwelche Ideen, woran es liegen könnte?error no resource identifier found for attribute behavior_overlayTop
behavior_overlapTop
abersetOverlayTop()
- Überlappung gegen Überlagerung. Stellen Sie sicher, dass Sie die richtige verwenden!Rufen Sie zusätzlich zur akzeptierten Antwort setTitleEnabled (false) in Ihrem CollapsingToolbarLayout auf, damit der Titel wie im Beispiel oben fixiert bleibt.
So was:
oder indem Sie es wie folgt in XML hinzufügen:
Andernfalls könnte der Titel hinter dem überlappenden Inhalt verschwinden, es sei denn, dies ist natürlich das gewünschte Verhalten.
quelle