Fügen Sie im CoordinatorLayout Ansichten unterhalb der Symbolleiste hinzu


176

Ich habe folgendes Layout:

<android.support.design.widget.CoordinatorLayout
    android:id="@+id/main_content"
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <android.support.design.widget.AppBarLayout
        android:id="@+id/appBar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:theme="@style/ThemeOverlay.AppCompat.ActionBar">

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:background="?attr/colorPrimary"
            app:layout_scrollFlags="scroll|enterAlways"
            app:popupTheme="@style/ThemeOverlay.AppCompat.Light"/>

    </android.support.design.widget.AppBarLayout>

    <FrameLayout
        android:id="@+id/content"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        />
</android.support.design.widget.CoordinatorLayout>

Ich füge Fragments hinzu FrameLayoutund ersetze sie. Eine meiner FragmentListen ist eine Liste mit folgendem Layout:

<android.support.v7.widget.RecyclerView
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/recyclerView"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"/>

Mein Problem hier ist, dass die Symbolleiste über die Liste gezogen wird . Ich habe versucht, das zu lösen, indem ich den Inhalt des CoordinatorLayoutin ein verpackt habe LinearLayout, das das Überziehen gelöst hat, aber auf diese Weise funktioniert das Scrollverhalten der App-Leiste nicht mehr.

Jede Hilfe wird sehr geschätzt!

Antworten:


355

Nimm das Attribut

app:layout_behavior="@string/appbar_scrolling_view_behavior"

aus dem RecyclerViewund setzen Sie es auf das FrameLayout, das Sie versuchen, unter dem zu zeigen Toolbar.

Ich habe festgestellt, dass das Verhalten der Bildlaufansicht das Layout der Komponente unterhalb der Symbolleiste wichtig macht. Da der FrameLayouteinen Nachkommen hat, der scrollt ( RecyclerView), CoordinatorLayouterhält der diese Bildlaufereignisse zum Verschieben des Toolbar.


Eine andere Sache, die Sie beachten sollten: Dieses Layoutverhalten bewirkt, dass die FrameLayoutGröße so bemessen wird, als ob die Toolbarbereits gescrollt wäre , und bei Toolbarvollständiger Anzeige wird die gesamte Ansicht einfach nach unten gedrückt, sodass sich der untere Rand der Ansicht unter dem unteren Rand des befindet CoordinatorLayout.

Das war eine Überraschung für mich. Ich hatte erwartet, dass die Größe der Ansicht dynamisch geändert wird, wenn die Symbolleiste nach oben und unten gescrollt wird. Wenn Sie also eine Bildlaufkomponente mit einer festen Komponente am unteren Rand Ihrer Ansicht haben, wird diese untere Komponente erst angezeigt, wenn Sie die Bildlaufkomponente vollständig gescrollt haben Toolbar.

Als ich also eine Schaltfläche am unteren Rand der Benutzeroberfläche verankern wollte, habe ich dies umgangen, indem ich die Schaltfläche am unteren Rand von CoordinatorLayout( android:layout_gravity="bottom") platziert und der Ansicht unter der Symbolleiste einen unteren Rand hinzugefügt habe, der der Höhe der Schaltfläche entspricht.


1
Vielen Dank, das funktioniert wirklich! Mein einziges Problem danach, wenn die Symbolleiste verschoben wurde, kehrte sie nicht zurück, nachdem das FragmentEnthalten durch eine Liste durch eine andere ersetzt wurde Fragment. Ich habe es geschafft, die Symbolleiste auf diese Weise manuell anzuzeigen .
WonderCsabo

Beeindruckend. Ich habe immer gedacht, dass Fragment's eigenes Layout den FrameLayout "Platzhalter" vollständig ersetzt, aber ich sehe, dass dies überhaupt nicht der Fall ist. Danke für diese Antwort! Es hat mir sehr geholfen.
Aspiring Dev

@Surendar D bitte überprüfen Sie dies, wenn Sie stackoverflow.com/questions/42968587/…
Mohamed Rihan

Nett. Danke dir!
Razvan

86

Ich konnte dies beheben, indem ich hinzufügte:

android: layout_marginTop = "? android: attr / actionBarSize"

zum FrameLayout wie folgt:

 <FrameLayout
        android:id="@+id/content"
        android:layout_marginTop="?android:attr/actionBarSize"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
       />

9
Anstatt marginTop hinzuzufügen, füge eine App hinzu: layout_behavior = "@ string / appbar_scrolling_view_behavior"
Naveed Ahmad

3
Perfekte Lösung, wenn @ string / appbar_scrolling_view_behavior nicht verfügbar ist
Julius

Bitte verwenden Sieandroid:layout_marginTop="?android:attr/actionBarSize"
Martin Pfeffer

6
Dies ist ein bisschen hacky, das Hinzufügen eines Randes von der Größe, die sein könnte (vorausgesetzt, Sie haben immer eine Symbolleiste dieser Größe) wird irgendwann brechen
Kenny

0

Ab Android Studio 3.4 müssen Sie diese Zeile in Ihr Layout einfügen, das die enthält RecyclerView.

app:layout_behavior="android.support.design.widget.AppBarLayout$ScrollingViewBehavior"

0

So verwenden Sie oben ToolBar kollabiert oder mit ScrollFlags Ihrer Wahl können wir auf diese Weise tun: Vom Material Design loswerden FrameLayout

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">

<androidx.coordinatorlayout.widget.CoordinatorLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <com.google.android.material.appbar.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <com.google.android.material.appbar.CollapsingToolbarLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:contentScrim="?attr/colorPrimary"
            app:expandedTitleGravity="top"
            app:layout_scrollFlags="scroll|enterAlways">


        <androidx.appcompat.widget.Toolbar
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            app:layout_collapseMode="pin">

            <ImageView
                android:id="@+id/ic_back"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@drawable/ic_arrow_back" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="back"
                android:textSize="16sp"
                android:textStyle="bold" />

        </androidx.appcompat.widget.Toolbar>


        </com.google.android.material.appbar.CollapsingToolbarLayout>
    </com.google.android.material.appbar.AppBarLayout>

        <androidx.recyclerview.widget.RecyclerView
            android:id="@+id/post_details_recycler"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical"
            android:padding="5dp"
            app:layout_behavior="@string/appbar_scrolling_view_behavior"
            />

</androidx.coordinatorlayout.widget.CoordinatorLayout>

Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.