web-dev-qa-db-ja.com

Google Design Libraryを使用しているときに、ツールバーを表示または非表示にする方法

WhatsAppのような効果を達成しようとしています。ツールバーをスクロールすると、磁石のように見えたり、磁石のように見えなくなったりします。

MainActivity XMLにあるもの：

  • DrawerLayout-基本レイアウト
  • CoordinatorLayout-Appbar、ツールバー、タブのレイアウト
  • AppBarLayout-ツールバーとタブを保持するため
  • ツールバー-このフラグがあります：app:layout_scrollFlags="scroll|enterAlways"
  • SlidingTabLayout-タブを表示します
  • ViewPager-タブ用
  • RecyclerView-コーディネーターのレイアウト用

誤解しないでください、ツールバーを下にスクロールすると表示されなくなりますが、途中でスクロールを停止すると言うと、ツールバーはそこに座って見えなくなり、残りの半分は表示されません。

この問題を解決するには、どのようにすればよいのでしょうか？.

androidscrolltoolbarappbar
20
Linxy

この機能は23.1.0バージョンのAndroidサポートライブラリに追加されました。リリースノートから：

SCROLL_FLAG_SNAP定数を追加して、AppBarLayoutクラスにエッジスナップのサポートを追加しました。スクロールが終了すると、ビューが部分的にしか表示されない場合、ビューはスナップされ、最も近いエッジにスクロールされます。

<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

37
Abhishek V

編集：サポート23.1.0以降、これは不要になりました。代わりに this answer を参照してください。

これを解決する1つの方法は、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と一緒にスナップすることです。私は実際にこの方法が好きですが、それがあなたが望むものかどうかはわかりません。

7
tdevaux

メインアクティビティでアクションバーのレイアウトを非表示にし、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>
0
Zahra.HY