Question

在博客Design Support Library: Collapsing Toolbar Layout博客文章中，有一个标题图像具有很好的视差效果：

在a simple test project at GitHub我试图达到类似的效果 - 但由于某种原因，图像被压扁了：

在activity_main.xml我尝试了scaleType的所有可能值，但图片仍然失真：

        <ImageView
            android:id="@+id/header_image_view"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="@drawable/header"
            android:scaleType="centerCrop"
            app:layout_collapseMode="parallax" />

我在这里想念的是什么？

更新

我试图改为match_parent，因为Apurva建议（谢谢+1）：

        <ImageView
            android:id="@+id/header_image_view"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@drawable/header2"
            android:scaleType="centerCrop"
            app:layout_collapseMode="parallax" />

但这没有用 - 标题图像被压扁了：

Answer 1

默认情况下，背景会拉伸以适合。您应该在android:src上设置android:background而不是ImageView。

<ImageView
    android:id="@+id/header_image_view"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:src="@drawable/header2"
    android:scaleType="centerCrop"
    app:layout_collapseMode="parallax" />

Answer 2

你有没有提到教程中作者使用SquareImageView？

他凌驾于onMeasure方法：

@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
    super.onMeasure(widthMeasureSpec, heightMeasureSpec);

    int width = getMeasuredWidth();
    setMeasuredDimension(width, width);
}

类已实现here

折叠工具栏的视差效果不起作用，标题中的图像被压扁

2 个答案: