web-dev-qa-db-ja.com

Android Design Support Libraryのあるスムーズなアニメーション化された折りたたみツールバー

とにかくAndroid Design Support Libraryのスクロール中の折りたたみアニメーションがスムーズになりますか？スクロールを解除すると、突然停止します。しかし、スクロールを停止してもアニメーションの折りたたみはスムーズに続行されます。 Android-ObservableScrollView および Scrollable は、スムーズに折りたたまれているライブラリです。

androidandroid-layoutmaterial-designandroid-design-libraryandroid-collapsingtoolbarlayout
41
metemet06

新しいlayout_scrollFlagスナップを使用して、AppBarLayout状態内でスムーズにスクロールできます。しかし、私が経験したことは、RecyclerViewが一番上に達すると、スクロールが停止するということです。つまり、CollapsingToolbarLayoutは、別のスクロールなしでは展開されません。 RecyclerViewをスムーズにスクロールしてCollapsingToolbarLayoutを展開するには、recyclerviewでScrollListenerを使用しました。

    recyclerView.addOnScrollListener(new RecyclerView.OnScrollListener() {
        int scrollDy = 0;
        @Override
        public void onScrolled(RecyclerView recyclerView, int dx, int dy) {
            scrollDy += dy;
        }

        @Override
        public void onScrollStateChanged(RecyclerView recyclerView, int newState) {
            super.onScrollStateChanged(recyclerView, newState);
            if(scrollDy==0&&(newState == AbsListView.OnScrollListener.SCROLL_STATE_IDLE))
            {
                AppBarLayout appBarLayout = ((AppBarLayout) view.findViewById(R.id.app_bar));

                appBarLayout.setExpanded(true);
            }
        }
    });

Layout_scrollFlagsとして「scroll | exitUntilCollapsed」を使用しました。

<Android.support.design.widget.CollapsingToolbarLayout
            Android:id="@+id/collapsing_toolbar_layout"
            Android:layout_width="match_parent"
            Android:layout_height="match_parent"
            Android:fitsSystemWindows="true"
            Android:minHeight="80dp"
            app:layout_collapseMode="none"
            app:layout_scrollFlags="scroll|exitUntilCollapsed">
10
Jossy Paul

これはかなり新しいものですが、AppBarLayoutは最近、 snap と呼ばれる新しいlayout_scrollFlagで探しているものを正確に処理するように更新されました。

使用法：

app:layout_scrollFlags="scroll|snap"

ソースを探して、回答を更新しようとします。

編集：もちろん、それは Android開発者ブログ からです。

6
josephus

私はAppBarLayoutを通してそれをやっています。 onNestedFlingとonNestedPreScrollをオーバーライドします。

トリックは、ScrollingViewの最上位の子がアダプタのデータの先頭に近い場合、flingイベントを再利用することです。

ソース RecyclerView + AppBarLayoutによるフリング

public final class FlingBehavior extends AppBarLayout.Behavior {
private static final int TOP_CHILD_FLING_THRESHOLD = 3;
private boolean isPositive;

public FlingBehavior() {
}

public FlingBehavior(Context context, AttributeSet attrs) {
    super(context, attrs);
}
@Override
public boolean onNestedFling(CoordinatorLayout coordinatorLayout, AppBarLayout child, View target, float velocityX, float velocityY, boolean consumed) {
    if (velocityY > 0 && !isPositive || velocityY < 0 && isPositive) {
        velocityY = velocityY * -1;
    }
    if (target instanceof RecyclerView && velocityY < 0) {
        final RecyclerView recyclerView = (RecyclerView) target;
        final View firstChild = recyclerView.getChildAt(0);
        final int childAdapterPosition = recyclerView.getChildAdapterPosition(firstChild);
        consumed = childAdapterPosition > TOP_CHILD_FLING_THRESHOLD;
    }
    return super.onNestedFling(coordinatorLayout, child, target, velocityX, velocityY, consumed);
}

@Override
public void onNestedPreScroll(CoordinatorLayout coordinatorLayout, AppBarLayout child, View target, int dx, int dy, int[] consumed) {
    super.onNestedPreScroll(coordinatorLayout, child, target, dx, dy, consumed);
    isPositive = dy > 0;
  }
}

次に、レイアウト動作をFlingBehaviorクラスとして設定します

<Android.support.design.widget.AppBarLayout
app:layout_behavior="package.FlingBehavior"
Android:id="@+id/appbar"
Android:layout_width="match_parent"
Android:layout_height="250dip"
Android:fitsSystemWindows="true">
3
S.R

コードを追加

 app:layout_scrollFlags="scroll|enterAlways"

appBarLayout内のビューで。これは、ツールバーをAndroid Design Support Libraryで折りたたみます。

  <Android.support.design.widget.AppBarLayout
        Android:layout_width="match_parent"
        Android:layout_height="wrap_content"
        Android:theme="@style/ThemeOverlay.AppCompat.Dark">
        <Android.support.v7.widget.Toolbar
            Android:id="@+id/toolbar"
            Android:layout_width="match_parent"
            Android:layout_height="?attr/actionBarSize"
            app:layout_scrollFlags="scroll|enterAlways">

            <bubee.inews.Items.ItemMenu
                Android:id="@+id/itemMenu"
                Android:layout_width="match_parent"
                Android:layout_height="wrap_content" />
        </Android.support.v7.widget.Toolbar>
    </Android.support.design.widget.AppBarLayout>
2
huu duy

私もこの問題に取り組んでおり、あまり最適化されていないソリューションを思いついていますが、あなたはそれを改善することができます。

public abstract class AppBarStateChangeListener implements AppBarLayout.OnOffsetChangedListener {
private static final String TAG = "app_AppBarStateChange";
public enum State {
    EXPANDED,
    COLLAPSED,
    IDLE
}

private State mCurrentState = State.IDLE;
private int mInitialPosition = 0;
private boolean mWasExpanded;
private boolean isAnimating;
@Override
public final void onOffsetChanged(AppBarLayout appBarLayout, int i) {
    if (i == 0) {
        if (mCurrentState != State.EXPANDED) {
            onStateChanged(appBarLayout, State.EXPANDED);
        }
        mCurrentState = State.EXPANDED;
        mInitialPosition = 0;
        mWasExpanded = true;
        Log.d(TAG, "onOffsetChanged 1");
        isAnimating = false;
        appBarLayout.setEnabled(true);
    } else if (Math.abs(i) >= appBarLayout.getTotalScrollRange()) {
        if (mCurrentState != State.COLLAPSED) {
            onStateChanged(appBarLayout, State.COLLAPSED);
        }
        mCurrentState = State.COLLAPSED;
        mInitialPosition = appBarLayout.getTotalScrollRange();
        mWasExpanded = false;
        Log.d(TAG, "onOffsetChanged 2");
        isAnimating = false;
        appBarLayout.setEnabled(true);
    } else {
        Log.d(TAG, "onOffsetChanged 3");
        int diff = Math.abs(Math.abs(i) - mInitialPosition);
        if(diff >= appBarLayout.getTotalScrollRange()/3 && !isAnimating) {
            Log.d(TAG, "onOffsetChanged 4");
            isAnimating = true;
            appBarLayout.setEnabled(false);
            appBarLayout.setExpanded(!mWasExpanded,true);
        }
        if (mCurrentState != State.IDLE) {
            onStateChanged(appBarLayout, State.IDLE);
        }
        mCurrentState = State.IDLE;
    }
}

public abstract void onStateChanged(AppBarLayout appBarLayout, State state);

public State getCurrentState() {
    return mCurrentState;
}

}

このクラスを作成し、次のコードを呼び出します

private AppBarStateChangeListener mAppBarStateChangeListener = new AppBarStateChangeListener() {
    @Override
    public void onStateChanged(AppBarLayout appBarLayout, State state) {
        Log.d(TAG, "ToBeDeletedActivity.onStateChanged :: " + state);
        if(state == State.EXPANDED || state == State.IDLE) {
            getSupportActionBar().setTitle("");
        } else {
            getSupportActionBar().setTitle("Hello World");
            if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.Lollipop) {
                mAppBarLayout.setElevation(0);
            }
        }
    }


};

mAppBarLayout.addOnOffsetChangedListener(mAppBarStateChangeListener);

これは弱参照として保持され、GCによって収集されるため、匿名クラスOffsetChangedListenerを設定しないことに注意してください。

親切にこのコードを調べて改善し（誰でも）、再共有してください。ありがとう

0
Gagandeep Singh

次のコードを追加してみてください。

   app:layout_scrollFlags="scroll|snap"
0
Leo Nguyen