Добавьте представления ниже панели инструментов в CoordinatorLayout


176

У меня есть следующий макет:

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

Я добавляю Fragments в FrameLayout, заменяя их. Одним из моих Fragmentсписков является список, который имеет следующий макет:

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

Моя проблема здесь в том, что панель инструментов нарисована поверх списка . Я попытался решить эту проблему, поместив содержимое CoordinatorLayoutв LinearLayout, что решило перерисовку, но таким образом поведение прокрутки панели приложений больше не работает.

Любая помощь высоко ценится!

Ответы:


355

Взять атрибут

app:layout_behavior="@string/appbar_scrolling_view_behavior"

выключить RecyclerViewи поставить его на FrameLayoutтом , что вы пытаетесь показать под Toolbar.

Я обнаружил, что одной из важных особенностей поведения представления с прокруткой является размещение компонента под панелью инструментов. Поскольку у FrameLayoutпотомка, который будет scroll ( RecyclerView), CoordinatorLayoutбудут те события прокрутки для перемещения Toolbar.


Еще одна вещь, о которой нужно знать: это поведение макета приведет к тому, что FrameLayoutвысота будет иметь размеры, как если бы Toolbarона уже прокручивалась , а при Toolbarполностью отображенном изображении весь вид просто сдвигается вниз, так что нижняя часть вида находится ниже нижней части окна. CoordinatorLayout,

Это было для меня неожиданностью. Я ожидал, что размер представления будет динамически изменяться при прокрутке панели инструментов вверх и вниз. Поэтому, если у вас есть прокручиваемый компонент с фиксированным компонентом внизу вашего представления, вы не увидите этот нижний компонент, пока не прокрутите полностью Toolbar.

Поэтому, когда я хотел закрепить кнопку в нижней части пользовательского интерфейса, я решил эту проблему, поместив кнопку в нижней части CoordinatorLayout( android:layout_gravity="bottom") и добавив нижнее поле, равное высоте кнопки, к виду под панелью инструментов.


1
Большое спасибо, это действительно работает! Моя единственная проблема после этого, если панель инструментов была перемещена, она не вернулась после замены Fragmentсодержимого списком на другое Fragment. Мне удалось вручную показать панель инструментов таким образом.
WonderCsabo

Вот это да. Я всегда думал, что собственный макет Fragment полностью заменил «заполнитель» FrameLayout, но я вижу, что это совсем не так. Спасибо за этот ответ! Это мне очень помогло.
Стремящийся Dev

@Surendar D, пожалуйста, проверьте это, если вы можете stackoverflow.com/questions/42968587/…
Мохамед

Ницца. Спасибо!
Разван

87

Мне удалось это исправить, добавив:

андроид: layout_marginTop = "андроид: атр / actionBarSize"

в FrameLayout так:

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

9
Вместо добавления marginTop добавьте приложение: layout_behavior = "@ string / appbar_scrolling_view_behavior"
Навид Ахмад,

3
Идеальное решение, когда @ string / appbar_scrolling_view_behavior недоступна
Julius,

Пожалуйста, используйтеandroid:layout_marginTop="?android:attr/actionBarSize"
Мартин Пфеффер

6
Это своего рода хакерство, добавление запаса того, какой размер МОЖЕТ быть (при условии, что у вас всегда будет панель инструментов такого размера) в какой-то момент сломается
Кенни,

0

Начиная с Android Studio 3.4, вам нужно поместить эту строку в свой макет, который содержит RecyclerView.

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

0

Чтобы использовать сворачивающуюся верхнюю панель инструментов или ScrollFlags по вашему выбору, мы можем сделать это следующим образом: Из Material Design избавьтесь от 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>

Используя наш сайт, вы подтверждаете, что прочитали и поняли нашу Политику в отношении файлов cookie и Политику конфиденциальности.
Licensed under cc by-sa 3.0 with attribution required.