显示包含 SVG 的全宽 ImageView 会扭曲它

Question

我的目标是在 ConstraintLayout 中显示填充整个屏幕宽度的 SVG 背景图像。 Button 叠加到此背景图像上，这就是为什么您可以在下面的模型中看到：

背景图片是包含星星的图片。它的开始和结束边将被限制在根部 GroupView，这样它将完全填满屏幕的宽度。

问题如下：无论我是否将bottom side绑定到屏幕的bottom side，背景图像都出现了失真，如下图：

这是我写的代码：

<ImageView
    android:id="@+id/imageView16"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    android:background="@drawable/ic_background_stars"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintTop_toBottomOf="@id/linearLayout4"  // "linearLayout4" is just a widget shown above, it's not an important element for this Whosebug question
    />

<Button
    android:id="@+id/button_home_share"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_margin="24dp"
    android:background="@color/colorRoyalRedLight"
    android:text="TextView"
    android:textAllCaps="false"
    android:textColor="@color/white"
    app:layout_constraintStart_toStartOf="@+id/imageView16"
    app:layout_constraintEnd_toEndOf="@+id/imageView16"
    app:layout_constraintTop_toTopOf="@+id/imageView16"
    app:layout_constraintBottom_toBottomOf="@+id/imageView16"
    />

我的问题

我怎样才能将我的 SVG 图像用作背景图像，使其看起来没有任何失真，并填满整个屏幕的宽度？高度当然可以自行调整（以保持良好的比例），但不应比按钮短（在 Y 和 X 方向）。

Answer 1

对于 ImageView 尝试设置 android:scaleType="centerCrop"。参见 ImageView.ScaleType。

CENTER_CROP

Scale the image uniformly (maintain the image's aspect ratio) so that both dimensions (width and height) of the image will be equal to or larger than the corresponding dimension of the view (minus padding). The image is then centered in the view. From XML, use this syntax: android:scaleType="centerCrop".

显示包含 SVG 的全宽 ImageView 会扭曲它

Showing a full-width ImageView containing a SVG distorts it

android

android-imageview

androidsvg

android-constraintlayout

我的问题