Подтвердить что ты не робот

Заголовок RecyclerView под элементами в Android

Я не могу найти решение для такого поведения:

LinkedIn Pulse

Это заголовок RecyclerView немного по элементам. Конечно, я думаю, что это RecyclerView.

Как я могу это достичь?

ИЗМЕНИТЬ

То, что я сделал, просто добавляет украшение для просмотра ресайклеров.

Это мой простой декоратор:

public class HeaderItemDeceration extends RecyclerView.ItemDecoration {

    public HeaderItemDeceration() {
    }

    @Override
    public void getItemOffsets(Rect outRect, View view, RecyclerView parent, RecyclerView.State state) {
        if (parent.getChildAdapterPosition(view) == 0) {
            outRect.bottom = -100;
        }
    }
}

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

РЕДАКТИРОВАТЬ 2

Я не все объясняю, поэтому я объясняю.

В моем случае я не хочу иметь ActionBar. Я хочу только изображение под RecyclerView, как в примере выше, но без сбрасывания панели инструментов. Просто скажите, что моя активность имеет стиль, родительский Theme.AppCompat.Light.NoActionBar.

Принимая во внимание мои объяснения и ответы ниже, я пытаюсь достичь цели с помощью такого макета:

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
    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:fitsSystemWindows="true">

    <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="300dp"
        android:fitsSystemWindows="true">

        <android.support.design.widget.CollapsingToolbarLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:fitsSystemWindows="true"
            app:layout_scrollFlags="scroll|exitUntilCollapsed">

        <ImageView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:fitsSystemWindows="true"
            android:scaleType="fitXY"
            android:src="@drawable/header"/>

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

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

    <android.support.v7.widget.RecyclerView
        android:id="@+id/recycler_view_items"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior"
        app:behavior_overlapTop="24dp"/>

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

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

Плохо зафиксированный эффект

Я предполагаю, что с моей целью использование CollapsingToolbarLayout может быть неправильным.

4b9b3361

Ответ 1

Я достиг этого эффекта, когда я написал главный главный экран для приложения для ухода за газонами для Scotts. Вот изображение того, как это выглядит.

Это достигается с помощью CoordinatorLayout, AppBarLayout, CollapsingToolbarLayout и RecyclerView. Ключ - это поведение просмотра прокрутки, которое необходимо установить для атрибутов app:behavior_overlapTop и app:layout_behavior="@string/appbar_scrolling_view_behavior" в RecyclerView (которые работают только в том случае, если это представление для дочернего узла AppBarLayout).

В моем сценарии у меня был заголовок отдельно от RecyclerView. В зависимости от того, как управляется ваш контент, это решение может не сработать для вас (хотя для меня намного проще хранить заголовок вне RV - для этого менее ограниченный тип просмотра/просмотр)!

Суть выглядит следующим образом:

<android.support.design.widget.CoordinatorLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true"
    >
  <android.support.design.widget.AppBarLayout
      android:layout_height="300dp" // fixed height of your header container
      android:layout_width="match_parent"
      android:fitsSystemWindows="true"
      >
    <android.support.design.widget.CollapsingToolbarLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:fitsSystemWindows="true"
        app:layout_scrollFlags="scroll|exitUntilCollapsed|snap" // snap/exitUntilCollapsed are optional. See more info on scroll flags here: https://developer.android.com/reference/android/support/design/widget/AppBarLayout.LayoutParams.html#setScrollFlags(int)
        >
      <ImageView // This is where you'd put your header backdrop
          android:layout_width="match_parent"
          android:layout_height="match_parent"
          android:fitsSystemWindows="true"
          app:layout_collapseMode="parallax" // not essential, but most people want the parallax scrolling effect with their image header in this setup. this is how you would do it.
          />
    </CollapsingToolbarLayout>
  </AppBarLayout>
  <RecyclerView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:overScrollMode="never"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    app:behavior_overlapTop="64dp" // This is what you're looking for!
    />
</CoordinatorLayout>

Ответ 2

Это комбинация из двух представлений, а не только просмотр ресайклеров.

Android-ObservableScrollView поможет вам достичь желаемого.

Фокус в том, что есть фон в фоновом режиме и ресайклинг впереди. В представлении recycler есть заголовок, который делает желаемый промежуток от вершины. Всякий раз, когда вы прокручиваете ресайклеров, вы будете уведомлены слушателем, который вы использовали, и тем, что вы будете вручную прокручивать нижний макет,

Ответ 3

попробуйте все возможные комбинации layout_scrollFlags AppBarLayout, это поможет в улучшении прокрутки

  • app: layout_scrollFlags = "scroll | snap" // попробуйте, это сработает для вас

  • app: layout_scrollFlags = "scroll | exitUntilCollapsed" // текущий текущий прокрутка

  • Приложение: layout_scrollFlags = "свиток | enterAlwaysCollapsed"

  • Приложение: layout_scrollFlags = "Спиральные | enterAlways"

и прочитайте scrolling-techniques-for-material-design