collapsingToolbarLayout
创建自定义的contentScrim。我的collapsingToolbarLayout内部有一个imageview
。理论上,当它滚动时,imageview应该淡出,我的scrim颜色应该淡入。我们都知道可以像这样创建一个scrim:
<android.support.design.widget.CollapsingToolbarLayout
android:id="@+id/collapsing_toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:contentScrim="?attr/colorPrimary"
android:background="@color/white"
app:expandedTitleMarginStart="48dp"
app:expandedTitleMarginEnd="64dp"
android:fitsSystemWindows="true"
app:expandedTitleTextAppearance="@color/transparent"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
>
然而,安卓默认的遮罩只有在屏幕滚动到3/4以上时才开始起作用。在此之前,ImageView仍将完全显示。当你滚动到屏幕的3/4位置时,遮罩会自动改变CollapsingToolbarLayout的颜色为你设置的遮罩颜色。
当你滚动屏幕到3/4位置并且还没达到工具栏之前,我希望它能够渐渐变淡,而不是充满整个屏幕。
如果你想看一个我想要创建的效果的例子,请查看Facebook应用程序。这是完全展开时的collapsingToolbarLayout:
当您滚动到页面的约3/4处时,collapsingToolbarLayout会呈现出淡蓝色,并且蓝色并不完全饱和。所以我在我的collapsingToolbarLayout
中创建了以下内容:
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/frame_picture">
<com.customshapes.SquareImageView
android:id="@+id/backdrop"
android:contentDescription="@string/photo"
android:transitionName="@string/transition"
android:layout_width="match_parent"
android:layout_height="240dp"
android:scaleType="centerCrop"
android:fitsSystemWindows="true"
/>
<com.customshapes.SquareImageView
android:id="@+id/fading_backdrop"
android:layout_width="match_parent"
android:background="?attr/colorPrimary"
android:layout_height="240dp"
android:alpha="0"
android:fitsSystemWindows="true"
/>
</FrameLayout>
FrameLayout由背景imageview
组成,它持有在我的CollapsingToolbarLayout中显示的图片,并且在其前面是一个ImageView,它仅持有带有alpha 0的'scrimColor' ?attr/colorPrimary,以便背景imageview
可以透过它发光。
然后我实现了AppBarLayout的onOffsetChangedListener:
@Override
public void onOffsetChanged(AppBarLayout appBarLayout, int verticalOffset) {
fading_backdrop.setImageAlpha(verticalOffset);
fading_backdrop.invalidate();
}
我们正在设置fading_backdrop的alpha值,以便在向上滚动时出现。我试图人工创建一个遮罩。
然而,这似乎并不起作用。当我运行这段代码时,根本没有任何淡入效果。有人知道我做错了什么吗?
f
的计算中。 - advice