Как сделать панель инструментов видимой или скрытой при использовании Google Design Library?

Я пытаюсь добиться такого же эффекта, как в WhatsApp, когда панель инструментов (при прокрутке) будет отображаться в виде магнита или вне поля зрения магнита.

Что у меня есть в моем MainActivity XML:

  • DrawerLayout — базовый макет
  • CoordinatorLayout — макет панели приложений, панели инструментов и вкладок
  • AppBarLayout — для хранения панели инструментов и вкладок
  • Панель инструментов - имеет ЭТОТ флаг: app:layout_scrollFlags="scroll|enterAlways"
  • SlidingTabLayout — отображает вкладки
  • ViewPager — для вкладок
  • RecyclerView — для макета координатора

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

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


person Linxy    schedule 05.08.2015    source источник
comment
То же самое! Я только нашел этот пост, но я еще не там...mzgreen.github.io/2015/06/23/   -  person Entreco    schedule 06.08.2015


Ответы (3)


Эта функция была добавлена ​​в 23.1.0 версии библиотеки поддержки Android. Из примечаний к выпуску:

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

<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="wrap_content"
            android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

           <android.support.v7.widget.Toolbar
                    android:id="@+id/toolbar"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    app:layout_scrollFlags="scroll|enterAlways|snap" />
           -----
           -----

Для получения дополнительной информации: http://android-developers.blogspot.in/2015/10/android-support-library-231.html

person Abhishek V    schedule 16.10.2015
comment
С момента выпуска библиотеки поддержки дизайна Android 23.1.0 это должен быть правильный ответ. - person Anjz; 16.10.2015
comment
Намного легче! Действительно, сейчас должен быть правильный ответ. - person tdevaux; 18.10.2015
comment
Это работает, но почему Android Studio выделяет флаг привязки красным текстом? Затем, когда вы наводите курсор, чтобы увидеть предупреждение, оно говорит: «Не удается разрешить флаг». - person toobsco42; 09.11.2015
comment
@toobsco42 toobsco42 В моей студии Android нет предупреждений. Попробуйте очистить проект один раз. - person Abhishek V; 09.11.2015
comment
@AbhishekV Ты прав. Теперь он не показывает предупреждение после того, как я закрыл и снова открыл проект. - person toobsco42; 10.11.2015
comment
см. этот вопрос stackoverflow.com/questions/33737589/ - person penduDev; 16.11.2015
comment
есть ли способ изменить анимацию привязки - person Jinu; 07.09.2016

РЕДАКТИРОВАТЬ: начиная с поддержки 23.1.0 в этом больше нет необходимости. Вместо этого см. этот ответ.

Один из возможных способов решить эту проблему — настроить набор Behavior на свой AppBarLayout.

<android.support.design.widget.AppBarLayout
    app:layout_behavior="com.myapp.AppBarLayoutSnapBehavior"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
    ...

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

package com.myapp;

public class AppBarLayoutSnapBehavior extends AppBarLayout.Behavior {

    private ValueAnimator mAnimator;
    private boolean mNestedScrollStarted = false;

    public AppBarLayoutSnapBehavior(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    @Override
    public boolean onStartNestedScroll(CoordinatorLayout coordinatorLayout, AppBarLayout child,
                                       View directTargetChild, View target, int nestedScrollAxes) {
        mNestedScrollStarted = super.onStartNestedScroll(coordinatorLayout, child, directTargetChild, target, nestedScrollAxes);
        if (mNestedScrollStarted && mAnimator != null) {
            mAnimator.cancel();
        }
        return mNestedScrollStarted;
    }

    @Override
    public void onStopNestedScroll(CoordinatorLayout coordinatorLayout, AppBarLayout child, View target) {
        super.onStopNestedScroll(coordinatorLayout, child, target);

        if (!mNestedScrollStarted) {
            return;
        }

        mNestedScrollStarted = false;

        int scrollRange = child.getTotalScrollRange();
        int topOffset = getTopAndBottomOffset();

        if (topOffset <= -scrollRange || topOffset >= 0) {
            // Already fully visible or fully invisible
            return;
        }

        if (topOffset < -(scrollRange / 2f)) {
            // Snap up (to fully invisible)
            animateOffsetTo(-scrollRange);
        } else {
            // Snap down (to fully visible)
            animateOffsetTo(0);
        }
    }

    private void animateOffsetTo(int offset) {
        if (mAnimator == null) {
            mAnimator = new ValueAnimator();
            mAnimator.setInterpolator(new DecelerateInterpolator());
            mAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
                @Override
                public void onAnimationUpdate(ValueAnimator animation) {
                    setTopAndBottomOffset((int) animation.getAnimatedValue());
                }
            });
        } else {
            mAnimator.cancel();
        }

        mAnimator.setIntValues(getTopAndBottomOffset(), offset);
        mAnimator.start();
    }
}

Единственное, вид прокрутки (в моем случае RecyclerView) привязывается вместе с Toolbar. На самом деле мне это нравится, но я не уверен, что вы этого хотите.

person tdevaux    schedule 20.08.2015
comment
На самом деле это не дает такого же точного эффекта, как стиль WhatsApp. Даже на простой сенсорной панели инструментов гаснет экран. и при легком перетаскивании вниз фактически тянет панель инструментов вниз в любом месте (положение прокрутки) в recyclerview - person Rohit; 25.09.2015
comment
Как бы вы сделали так, чтобы RecyclerView не привязывался к панели инструментов? Ваше решение идеально, за исключением одной вещи. - person StackOverflowMaster; 01.10.2015

Я просто скрыл макет панели действий в основном действии и установил диапазон для CollapsingToolbarLayout. меня устраивает.

в основной деятельности

    setSupportActionBar(mToolbar);
    getSupportActionBar().setDisplayHomeAsUpEnabled(true);     
    getSupportActionBar().hide();

    CollapsingToolbarLayout collapsingToolbar =
            (CollapsingToolbarLayout) findViewById(R.id.collapsing_toolbar);
    collapsingToolbar.setTitle("Name");
    loadBackdrop();

и layout_activity_main

<android.support.design.widget.AppBarLayout
    android:id="@+id/appbar"
    android:layout_width="match_parent"
    android:layout_height="@dimen/detail_backdrop_height"
    android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
    android:fitsSystemWindows="true">

    <android.support.design.widget.CollapsingToolbarLayout
        android:id="@+id/collapsing_toolbar"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_scrollFlags="scroll|snap"
        android:fitsSystemWindows="true"
        app:contentScrim="?attr/colorPrimary"
        app:expandedTitleMarginStart="48dp"
        app:expandedTitleMarginEnd="64dp">

        <ImageView
            android:id="@+id/backdrop"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:scaleType="centerCrop"
            android:fitsSystemWindows="true"
            app:layout_collapseMode="parallax" />

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
            app:layout_collapseMode="pin" />

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

</android.support.design.widget.AppBarLayout>
person Zahra.HY    schedule 10.02.2016