VectorDrawable 图像在 ImageView 中看起来缩小了答案

【问题标题】：VectorDrawable image looks shrunken in ImageViewVectorDrawable 图像在 ImageView 中看起来缩小了
【发布时间】：2018-03-13 10:44:24
【问题描述】：

VectorDrawable 图像在 ImageView 中看起来太小了。请务必查看 Imageview 周围的空间

这是我的 foreground VectorDrawable 图像的 xml 文件，保存在 drawable 文件夹中

 <vector xmlns:android="http://schemas.android.com/apk/res/android"
            android:width="108dp"
            android:height="108dp"
            android:viewportWidth="91.83673"
            android:viewportHeight="91.83673">
        <group android:translateX="0.9183673"
                android:translateY="38.918365">
            <path
                android:pathData="M49.245,0l0,13.057l-3.88,0l0,-8.612l-4.026,8.731l-2.396,0l-3.872,-8.731l0,8.612l-2.806,0l0,-13.057l5.074,0l3.464,7.993l3.624,-7.993z"
                android:strokeColor="#00000000"
                android:fillType="evenOdd"
                android:fillColor="#FFFFFF"
                android:strokeWidth="1"/>
            <path
                android:pathData="M61.856,0l0,2.435l-6.074,0l0,2.922l5.297,0l0,2.196l-5.297,0l0,3.067l6.199,0l0,2.556l-10.189,0l0,-13.176z"
                android:strokeColor="#00000000"
                android:fillType="evenOdd"
                android:fillColor="#FFFFFF"
                android:strokeWidth="1"/>
            <path
                android:pathData="M76.415,0l0,13.176l-4.309,0l-4.836,-8.451l0,8.451l-2.741,0l0,-13.176l4.435,0l4.711,8.306l0,-8.306z"
                android:strokeColor="#00000000"
                android:fillType="evenOdd"
                android:fillColor="#FFFFFF"
                android:strokeWidth="1"/>
        </group>
    </vector>

这是 xml 代码和视图（宽度和高度作为 wrap_content）

代码：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/inner_circle_light_blue">

    <ImageView
        android:layout_marginTop="50dp"
        android:id="@+id/imageview"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:src="@drawable/foreground" />

</RelativeLayout>

这是 xml 代码和视图（我从 dimens.xml 获取的宽度和高度）

代码：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/inner_circle_light_blue">

    <ImageView
        android:layout_marginTop="50dp"
        android:id="@+id/imageview"
        android:layout_width="@dimen/width"
        android:layout_height="@dimen/height"
        android:layout_centerHorizontal="true"
        android:src="@drawable/foreground" />

</RelativeLayout>

【问题讨论】：

标签： android android-vectordrawable

【解决方案1】：

我假设您的 VectorDrawable 以 SVG 开始。

您的问题是您的 SVG 被设计为位于更大的方形画布中间的一小段文本。转换为 VectorDrawable 后，仍保留了过大的画布尺寸。 VectorDrawable 中的viewportWidth 和viewportHeight 属性描述了文档区域。它们大约为 92x92，但您的文本只有大约 44x13 大小。

您需要确保：

您的文本适合文档的大小，或者
在保存之前将文档的大小调整为对象（文本）的大小

如果您使用 Inkscape，有一个简单的方法来执行选项 #2。在保存并转换为 VectorDrawable 之前，从菜单中选择 Edit -> Resize Page to Selection。

其他编辑器应该有类似的功能。如果没有，那么您总是可以在转换之前通过 Inkscape 运行它。

【讨论】：