我有一个带有折叠工具栏的布局,以及头像图像的平滑过渡以及通过行为设置的标题。但是,当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);
}
}