自定义行为完成时工具栏重叠视图

时间:2016-03-10 04:04:55

标签: android toolbar behavior android-coordinatorlayout

我有一个带有折叠工具栏的布局,以及头像图像的平滑过渡以及通过行为设置的标题。但是,当CircleImageView到达顶部时,它突然被工具栏重叠。看起来工具栏在完全折叠时会在CircleImageView上重新绘制(并带有阴影)。

问题是:如何让CircleImageView保持在工具栏的顶部?

带有dropbox

的错误的Gif

这是xml代码:

<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:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/white">

<android.support.design.widget.AppBarLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:clickable="true"
    android:id="@+id/app_bar_layout"
    >

    <android.support.design.widget.CollapsingToolbarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:layout_scrollFlags="scroll|exitUntilCollapsed"
        android:id="@+id/collapsing_toolbar"
        app:contentScrim="?attr/colorPrimary"
        app:expandedTitleTextAppearance="@style/ExpandedTitleText"
        app:collapsedTitleTextAppearance="@style/CollapsedTitleText"
        app:expandedTitleMarginStart="112dp"
        app:expandedTitleMarginBottom="60dp">


        <LinearLayout
            android:orientation="horizontal"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:layout_collapseMode="parallax"
            android:paddingTop="?attr/actionBarSize"
            android:paddingLeft="16dip"
            android:paddingRight="16dip"
            android:paddingBottom="16dip"
            >

            <LinearLayout
                android:orientation="vertical"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:gravity="bottom">

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="group created by"
                    android:textColor="@color/text_secondary_white"
                    android:textSize="14sp"
                    />

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    tools:text="Admin name"
                    android:textColor="@color/text_secondary_white"
                    android:textSize="14sp"
                    android:id="@+id/admin"
                    />

            </LinearLayout>

        </LinearLayout>

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

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

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

<android.support.v7.widget.RecyclerView
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:scrollbars="vertical"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    android:id="@+id/recyclerView" />

<View
    android:id="@+id/viewstub"
    app:layout_anchor="@id/app_bar_layout"
    app:layout_anchorGravity="bottom"
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:background="@android:color/black"  />

<package.CustomView.CircleImageView
    android:layout_width="80dip"
    android:layout_height="80dip"
    android:layout_marginLeft="16dip"
    android:layout_marginTop="60dp"
    tools:background="@color/color_accent"
    android:id="@+id/get_avatar"
    app:layout_behavior="package.AvatarImageBehavior" />

<android.support.design.widget.FloatingActionButton
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_margin="@dimen/fab_margin"
    app:layout_anchor="@id/app_bar_layout"
    app:layout_anchorGravity="bottom|right|end"
    app:backgroundTint="@color/color_accent"
    app:borderWidth="0dp"
    android:src="@drawable/ic_mode_edit_24dp"
    android:id="@+id/fab" />

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

AvatarImageBehavior.java - 基本上将CircleImageView转换为工具栏。这取决于appbar底部的存根视图(不太好,我知道)

public class AvatarImageBehavior extends CoordinatorLayout.Behavior<CircleImageView> {

private final static float MIN_AVATAR_PERCENTAGE_SIZE   = 0.3f;
private final static int EXTRA_FINAL_AVATAR_PADDING     = 80;

private final static String TAG = "behavior";
private final Context mContext;
private float mAvatarMaxSize;

private float mFinalLeftAvatarPadding;
private float mStartPosition;
private int mStartXPosition;
private float mStartToolbarPosition;

public AvatarImageBehavior(Context context, AttributeSet attrs) {
    mContext = context;
    init();

    mFinalLeftAvatarPadding = context.getResources().getDimension(
        R.dimen.contact_space_left);
}

private void init() {
    bindDimensions();
}

private void bindDimensions() {
    mAvatarMaxSize = mContext.getResources().getDimension(R.dimen.contact_avatar);
}

private int mStartYPosition;

private int mFinalYPosition;
private int finalHeight;
private int mStartHeight;
private int mFinalXPosition;

@Override
public boolean layoutDependsOn(CoordinatorLayout parent, CircleImageView child, View dependency) {
    return dependency.getId() == R.id.viewstub;
}

@Override
public boolean onDependentViewChanged(CoordinatorLayout parent, CircleImageView child, View dependency) {
    maybeInitProperties(child, dependency);

    float toolbarY = parent.findViewById(R.id.toolbar).getY();
//        Log.w(TAG, "-----toolbar y: " + toolbarY);

    int toolbarHeight = parent.findViewById(R.id.toolbar).getHeight();
//        Log.w(TAG, "-----toolbar height: " + toolbarHeight);

//        Log.w(TAG, "dependency.getY(): " + dependency.getY());
    final int maxScrollDistance = (int)mStartToolbarPosition - toolbarHeight;
//        Log.w(TAG, "maxScrollDistance: " + maxScrollDistance);

    float expandedPercentageFactor = (dependency.getY()- toolbarHeight) / maxScrollDistance;
//        Log.w(TAG, "expandedPercentageFactor: " + expandedPercentageFactor);
    if(expandedPercentageFactor > 1f)expandedPercentageFactor = 1f;

    float distanceYToSubtract = ((mStartYPosition - mFinalYPosition)
        * (1f - expandedPercentageFactor));// + (child.getHeight()/2);
//        Log.w(TAG, "distanceYToSubtract: " + distanceYToSubtract);

    float distanceXToSubtract = ((mStartXPosition - mFinalXPosition)
        * (1f - expandedPercentageFactor)) + (child.getWidth()/2);
//        Log.w(TAG, "distanceXToSubtract: " + distanceXToSubtract);

    float heightToSubtract = ((mStartHeight - finalHeight) * (1f - expandedPercentageFactor));
//        Log.w(TAG, "heightToSubtract: " + heightToSubtract);

    child.setY(mStartYPosition - distanceYToSubtract);
//        Log.w(TAG, "child.setY: " + (mStartYPosition - distanceYToSubtract));
    child.setX(mStartXPosition - distanceXToSubtract);
//        Log.w(TAG, "child.setX: " + (mStartXPosition - distanceXToSubtract));

    int proportionalAvatarSize = (int) (mAvatarMaxSize * (expandedPercentageFactor));
//        Log.w(TAG, "proportionalAvatarSize: " + proportionalAvatarSize);

    CoordinatorLayout.LayoutParams lp = (CoordinatorLayout.LayoutParams) child.getLayoutParams();
    lp.width = (int) (mStartHeight - heightToSubtract);
//        Log.w(TAG, "lp.width: " + lp.width);
    lp.height = (int) (mStartHeight - heightToSubtract);
//        Log.w(TAG, "lp.height: " + lp.height);
    child.setLayoutParams(lp);

//        Log.w(TAG, "---------------------");
    return true;
}

private void maybeInitProperties(CircleImageView child, View dependency) {
    if (mStartYPosition == 0)
        mStartYPosition = (int) child.getY();
//        Log.w(TAG, "mStartYPosition: " + mStartYPosition);

    if (mFinalYPosition == 0)
        mFinalYPosition = mContext.getResources().getDimensionPixelOffset(R.dimen.contact_final_width);
//        Log.w(TAG, "mFinalYPosition: " + mFinalYPosition);

    if (mStartHeight == 0)
        mStartHeight = child.getMeasuredHeight();
//        Log.w(TAG, "mStartHeight: " + mStartHeight);

    if (finalHeight == 0)
        finalHeight = mContext.getResources().getDimensionPixelOffset(R.dimen.contact_final_width);
//        Log.w(TAG, "finalHeight: " + finalHeight);

    if (mStartXPosition == 0)
        mStartXPosition = (int) (child.getX() + (child.getWidth() / 2));
//        Log.w(TAG, "mStartXPosition: " + mStartXPosition);

    if (mFinalXPosition == 0)
        mFinalXPosition = mContext.getResources().getDimensionPixelOffset(R.dimen.abc_action_bar_content_inset_material) + (finalHeight*2);
//        Log.w(TAG, "mFinalXPosition: " + mFinalXPosition);

    if (mStartToolbarPosition == 0)
        mStartToolbarPosition = dependency.getY();// 456
//        Log.w(TAG, "mStartToolbarPosition: " + mStartToolbarPosition);
}
}

0 个答案:

没有答案