Question

我在尝试使用工具栏按钮在dbpingToolbarLayout展开时保持在底部并向上移动并在折叠collaTingToolbarLayout时固定。它现在的行为方式总是固定在最前面。这就是我所拥有的：

<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/col"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/colorPrimaryDark"
android:fitsSystemWindows="true">

<android.support.design.widget.AppBarLayout
    android:id="@+id/appbar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
    app:elevation="4dp"
    android:transitionName="@string/pic_transition_name"
    app:layout_collapseMode="parallax">

    <android.support.design.widget.CollapsingToolbarLayout
        android:id="@+id/clpsToolbarLayout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:collapsedTitleTextAppearance="@style/CollapsedText"
        app:contentScrim="@color/colorPrimary"
        app:expandedTitleTextAppearance="@style/ExpandedText"
        app:layout_scrollFlags="scroll|exitUntilCollapsed|snap"
        > 

        <ImageView
            android:id="@+id/iv_gallery"
            android:layout_width="match_parent"
            android:layout_height="320dp"
            android:layout_gravity="center_horizontal"
            app:layout_collapseMode="parallax"
            />

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

            <Button
                android:id="@+id/mmv_toggle_detail"
                android:layout_width="60dp"
                android:layout_height="60dp"
                android:layout_gravity="right"
                />

        </android.support.v7.widget.Toolbar>

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

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

切换按钮始终位于顶部位置，我希望它在组展示工具栏布局时上下移动时，在组细节中的行为类似于WhatsApp编辑按钮。

Answer 1

通过从工具栏中取出按钮解决它，并将其作为CollapsingToolbarLayout的子项，边距为底部，折叠模式为pin

<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/col"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/colorPrimaryDark"
android:fitsSystemWindows="true">

<android.support.design.widget.AppBarLayout
    android:id="@+id/appbar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
    app:elevation="4dp"
    android:transitionName="@string/pic_transition_name"
    app:layout_collapseMode="parallax">

    <android.support.design.widget.CollapsingToolbarLayout
        android:id="@+id/clpsToolbarLayout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:collapsedTitleTextAppearance="@style/CollapsedText"
        app:contentScrim="@color/colorPrimary"
        app:expandedTitleTextAppearance="@style/ExpandedText"
        app:layout_scrollFlags="scroll|exitUntilCollapsed|snap"
        >

        <ImageView
            android:id="@+id/iv_gallery"
            android:layout_width="match_parent"
            android:layout_height="320dp"
            android:layout_gravity="center_horizontal"
            app:layout_collapseMode="parallax"
            />

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

        <Button
            android:id="@+id/mmv_toggle_detail"
            android:layout_width="60dp"
            android:layout_height="60dp"
            android:layout_gravity="right|bottom" 
            app:layout_collapseMode="pin"
            />

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

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

Answer 2

对于复杂的行为，您需要在行为类

中对此进行编码

步骤1：

创建自定义行为

public class BottomBarBehavior extends CoordinatorLayout.Behavior<LinearLayout> {

    private int defaultDependencyTop = -1;


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

    public BottomBarBehavior() {
    }

    @Override
    public boolean layoutDependsOn(CoordinatorLayout parent, LinearLayout child, View dependency) {
        return dependency instanceof AppBarLayout;
    }


    @Override
    public boolean onDependentViewChanged(CoordinatorLayout parent, LinearLayout child, View dependency) {

        //do something with the layout. see commented
        return true;
    }

}

第2步

将行为分配给工具栏。通过xml：

 <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:gravity="center"
            **app:layout_behavior=".BottomBarBehavior"**
            app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

            <Button
                android:id="@+id/mmv_toggle_detail"
                android:layout_width="60dp"
                android:layout_height="60dp"
                android:layout_gravity="right"
                />

        </android.support.v7.widget.Toolbar>

此处有更多信息：https://developer.android.com/reference/android/support/design/widget/CoordinatorLayout.Behavior.html

Answer 3

试试这个，我希望它能帮到你......

<android.support.design.widget.CoordinatorLayout 
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/col"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/colorPrimaryDark"
    android:fitsSystemWindows="true">

  <android.support.design.widget.AppBarLayout
       android:id="@+id/appbar"
       android:layout_width="match_parent"
       android:layout_height="wrap_content"
       android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
       app:elevation="4dp"
       android:transitionName="@string/pic_transition_name"
       app:layout_collapseMode="parallax">

<android.support.design.widget.CollapsingToolbarLayout
    android:id="@+id/clpsToolbarLayout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:collapsedTitleTextAppearance="@style/CollapsedText"
    app:contentScrim="@color/colorPrimary"
    app:expandedTitleTextAppearance="@style/ExpandedText"
    app:layout_scrollFlags="scroll|exitUntilCollapsed|snap"
    >

    <ImageView
        android:id="@+id/iv_gallery"
        android:layout_width="match_parent"
        android:layout_height="320dp"
        android:layout_gravity="center_horizontal"
        app:layout_collapseMode="parallax"
        />

    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:gravity="center"
        app:layout_collapseMode="pin"
        app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">
    </android.support.v7.widget.Toolbar>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
         <Button
           android:id="@+id/mmv_toggle_detail"
           android:layout_width="60dp"
           android:layout_height="60dp"
           android:layout_gravity="center|bottom"
           app:layout_anchor="@id/appbar"
           app:layout_anchorGravity="bottom|center" />
</android.support.design.widget.CoordinatorLayout>

在JavaClass中，您将添加以下代码。

appBarLayout.addOnOffsetChangedListener(new AppBarLayout.OnOffsetChangedListener() {
        @Override
        public void onOffsetChanged(AppBarLayout appBarLayout, int verticalOffset) {
            if (Math.abs(verticalOffset) == appBarLayout.getTotalScrollRange()) {
                // Collapsed
            } else if (verticalOffset == 0) {
                // Expanded
                if (yourBtn.getVisibility()==View.VISIBLE) {
                    yourBtn.setVisibility(View.INVISIBLE);
                }
            } else {
                // Somewhere in between
                if (yourBtn.getVisibility()==View.VISIBLE) {
                    yourBtn.setVisibility(View.INVISIBLE);
                }
            }
        }
    });

在CollapsingToolbarLayout中移动按钮

3 个答案: