从方形矢量资产中删除填充或强制拟合或删除空 space 以适合矩形按钮？
Delete padding or Force fitting or Delete empty space from square Vector asset to Fit a Rectangular button?
我正在尝试将 all_inclusive svg image 调整为我的矩形按钮。形状本身也是矩形，但矢量资产是正方形 (24x24)，形状上下都有空白。这些空间迫使形状本身非常小。如何通过删除顶部和底部的填充来制作全包 svg 矩形？
在此图片中，图像设置为符合左侧、顶部和右侧的准则：
<ImageView
android:id="@+id/imgInfinity"
app:srcCompat="@drawable/ic_infinity"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintDimensionRatio="1:1"
app:layout_constraintTop_toTopOf="0.75"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toEndOf="0.75"
app:layout_constraintEnd_toEndOf="0.25" />
无效的事情：
- 枢轴向量资产
-> 我无法在不弄乱原始形状的情况下计算出尺寸。与 scaleX/Y 或 translateX/Y 相同。不过，我让它在我的其他形状更简单的按钮上工作。
- 调整android:viewportheight或android:height -> 将图片变形为奇怪的形式
- 在线裁剪 svg --> 由于 Google 的原始 SVG 路径数据已经有 580 个字符长，裁剪工具只能让它变大 android 来处理（超过 1000 个字符）
- 用 word 裁剪 svg 图片并从 zip 文件中提取-> 它不压缩 svg 图像，因此它保持矩形，上下都有空白。
- 为图片顶部设置单独的水平辅助线。它可以解决问题，但每张图片的一个或多个指南会变得非常混乱。一定有更好的方法吧？..
已接受的解决方案（使用 InkShape 编辑）：
- 安装InkShape
- 打开 SVG
- 点击图片一次select它
- 转到文件->文档属性并单击'Resize pager to drawing or selection'（此按钮隐藏在第一个选项卡上，单击+Resize page to content 以显示该选项）；
- 节省
- 从保存的文件中提取路径数据和（视口）width/heights。
使用 Inkscape 版本 1.1 更新：
很遗憾，最新版本的 Inkscape (1.1) 不再直接导入矢量绘图文件，所以原答案不是 100% 正确。该答案可能适用于其他可以处理矢量可绘制文件的编辑器。
这是对该答案的更新，可与更高版本的 Inkscape 一起使用，以从矢量可绘制对象中删除所有填充。
将矢量图转换为缩放矢量图形 (SVG)：
- 打开 Alex Lockwood 的 Shape Shifter site
- 将矢量可绘制文件从 Android Studio 拖到 Shape Shifter。
- 将图像作为 SVG 导出到本地文件
现在我们有了一个 SVG 文件，我们可以用 Inkscape 编辑它：
- 如果尚未安装 Inkscape，请安装。
- 在 Inkscape 中打开 SVG 文件。
- 点击图片select即可。
- 将图像调整为 selection（Shift+Ctrl+R 或编辑->调整页面大小以选择）。如果您需要一些填充，您还可以指定其他尺寸。
- 将图像保存为 SVG 文件。
图像现在在 SVG 文件中被裁剪。我们需要将其转换回矢量可绘制对象。
- 在 Android Studio 中将 SVG 文件导入为矢量可绘制对象。 (File->New->Vector Asset) Asset Type = "本地文件(SVG, PSD).
导入后，矢量可绘制对象不再有任何填充。
使用可以处理 SVG 文件的图像编辑器裁剪图像。我使用了 InkScape，但还有其他的。裁剪图像后，您可以将其作为 XML 文件导入 Android Studio。
这是关于这个主题的新更新：
https://code.google.com/p/android/issues/detail?id=202019
看起来使用 android:scaleType="fitXY" 会使其在 Lollipop 上正确缩放。
来自 Google 工程师：
Hi, Let me know if scaleType='fitXY' can be a workaround for you , in
order to get the image look sharp.
The marshmallow Vs Lollipop is due to a special scaling treatment
added into marshmallow.
Also, for your comments: " Correct behavior: The vector drawable
should scale without quality loss. So if we want to use the same asset
in 3 different sizes in our application, we don't have to duplicate
vector_drawable.xml 3 times with different hardcoded sizes. "
Even though I totally agree this should be the case, in reality, the
Android platform has performance concern such that we have not reach
the ideal world yet. So it is actually recommended to use 3 different
vector_drawable.xml for better performance if you are sure you want to
draw 3 different size on the screen at the same time.
The technical detail is basically we are using a bitmap under the hook
to cache the complex path rendering, such that we can get the best
redrawing performance, on a par with redrawing a bitmap drawable.
viewportHeight 属性定义绘制路径的 "canvas" 的大小（即，它定义路径数据中实际 "mean" 的坐标）。
height 属性定义可绘制对象的固有大小。
原始矢量在顶部和底部有 6.5 个单位（在视口中）的白色 space。这意味着您可以查找任何使用大写字母的 pathData 命令，并从 y 坐标中减去 6.5。这给你留下了这个：
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="24dp"
android:height="13dp"
android:viewportWidth="24.0"
android:viewportHeight="13.0">
<path
android:fillColor="#FF000000"
android:pathData="M18.6,0.12c-1.44,0 -2.8,0.56 -3.77,1.53L12,4.16 10.48,5.5h0.01L7.8,7.89c-0.64,0.64 -1.49,0.99 -2.4,0.99 -1.87,0 -3.39,-1.51 -3.39,-3.38S3.53,2.12 5.4,2.12c0.91,0 1.76,0.35 2.44,1.03l1.13,1 1.51,-1.34L9.22,1.7C8.2,0.68 6.84,0.12 5.4,0.12 2.42,0.12 0,2.54 0,5.5s2.42,5.38 5.4,5.38c1.44,0 2.8,-0.56 3.77,-1.53l2.83,-2.5 0.01,0.01L13.52,5.5h-0.01l2.69,-2.39c0.64,-0.64 1.49,-0.99 2.4,-0.99 1.87,0 3.39,1.51 3.39,3.38s-1.52,3.38 -3.39,3.38c-0.9,0 -1.76,-0.35 -2.44,-1.03l-1.14,-1.01 -1.51,1.34 1.27,1.12c1.02,1.01 2.37,1.57 3.82,1.57 2.98,0 5.4,-2.41 5.4,-5.38s-2.42,-5.37 -5.4,-5.37z"/>
</vector>
然后，一旦整个形状移动 "up" 6.5 个单位，您就可以从视口和固有高度中减去 11 (6.5 * 2)。
最终结果是一个 24x13dp 的形状，在广角视图中应该会更好地缩放。
我正在尝试将 all_inclusive svg image 调整为我的矩形按钮。形状本身也是矩形，但矢量资产是正方形 (24x24)，形状上下都有空白。这些空间迫使形状本身非常小。如何通过删除顶部和底部的填充来制作全包 svg 矩形？
在此图片中，图像设置为符合左侧、顶部和右侧的准则：
<ImageView
android:id="@+id/imgInfinity"
app:srcCompat="@drawable/ic_infinity"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintDimensionRatio="1:1"
app:layout_constraintTop_toTopOf="0.75"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toEndOf="0.75"
app:layout_constraintEnd_toEndOf="0.25" />
无效的事情：
- 枢轴向量资产
- 调整android:viewportheight或android:height -> 将图片变形为奇怪的形式
- 在线裁剪 svg --> 由于 Google 的原始 SVG 路径数据已经有 580 个字符长，裁剪工具只能让它变大 android 来处理（超过 1000 个字符）
- 用 word 裁剪 svg 图片并从 zip 文件中提取-> 它不压缩 svg 图像，因此它保持矩形，上下都有空白。
- 为图片顶部设置单独的水平辅助线。它可以解决问题，但每张图片的一个或多个指南会变得非常混乱。一定有更好的方法吧？..
已接受的解决方案（使用 InkShape 编辑）：
- 安装InkShape
- 打开 SVG
- 点击图片一次select它
- 转到文件->文档属性并单击'Resize pager to drawing or selection'（此按钮隐藏在第一个选项卡上，单击+Resize page to content 以显示该选项）；
- 节省
- 从保存的文件中提取路径数据和（视口）width/heights。
使用 Inkscape 版本 1.1 更新：
很遗憾，最新版本的 Inkscape (1.1) 不再直接导入矢量绘图文件，所以原答案不是 100% 正确。该答案可能适用于其他可以处理矢量可绘制文件的编辑器。
这是对该答案的更新，可与更高版本的 Inkscape 一起使用，以从矢量可绘制对象中删除所有填充。
将矢量图转换为缩放矢量图形 (SVG)：
- 打开 Alex Lockwood 的 Shape Shifter site
- 将矢量可绘制文件从 Android Studio 拖到 Shape Shifter。
- 将图像作为 SVG 导出到本地文件
现在我们有了一个 SVG 文件，我们可以用 Inkscape 编辑它：
- 如果尚未安装 Inkscape，请安装。
- 在 Inkscape 中打开 SVG 文件。
- 点击图片select即可。
- 将图像调整为 selection（Shift+Ctrl+R 或编辑->调整页面大小以选择）。如果您需要一些填充，您还可以指定其他尺寸。
- 将图像保存为 SVG 文件。
图像现在在 SVG 文件中被裁剪。我们需要将其转换回矢量可绘制对象。
- 在 Android Studio 中将 SVG 文件导入为矢量可绘制对象。 (File->New->Vector Asset) Asset Type = "本地文件(SVG, PSD).
导入后，矢量可绘制对象不再有任何填充。
使用可以处理 SVG 文件的图像编辑器裁剪图像。我使用了 InkScape，但还有其他的。裁剪图像后，您可以将其作为 XML 文件导入 Android Studio。
这是关于这个主题的新更新：
https://code.google.com/p/android/issues/detail?id=202019
看起来使用 android:scaleType="fitXY" 会使其在 Lollipop 上正确缩放。
来自 Google 工程师：
Hi, Let me know if scaleType='fitXY' can be a workaround for you , in order to get the image look sharp.
The marshmallow Vs Lollipop is due to a special scaling treatment added into marshmallow.
Also, for your comments: " Correct behavior: The vector drawable should scale without quality loss. So if we want to use the same asset in 3 different sizes in our application, we don't have to duplicate vector_drawable.xml 3 times with different hardcoded sizes. "
Even though I totally agree this should be the case, in reality, the Android platform has performance concern such that we have not reach the ideal world yet. So it is actually recommended to use 3 different vector_drawable.xml for better performance if you are sure you want to draw 3 different size on the screen at the same time.
The technical detail is basically we are using a bitmap under the hook to cache the complex path rendering, such that we can get the best redrawing performance, on a par with redrawing a bitmap drawable.
viewportHeight 属性定义绘制路径的 "canvas" 的大小（即，它定义路径数据中实际 "mean" 的坐标）。
height 属性定义可绘制对象的固有大小。
原始矢量在顶部和底部有 6.5 个单位（在视口中）的白色 space。这意味着您可以查找任何使用大写字母的 pathData 命令，并从 y 坐标中减去 6.5。这给你留下了这个：
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="24dp"
android:height="13dp"
android:viewportWidth="24.0"
android:viewportHeight="13.0">
<path
android:fillColor="#FF000000"
android:pathData="M18.6,0.12c-1.44,0 -2.8,0.56 -3.77,1.53L12,4.16 10.48,5.5h0.01L7.8,7.89c-0.64,0.64 -1.49,0.99 -2.4,0.99 -1.87,0 -3.39,-1.51 -3.39,-3.38S3.53,2.12 5.4,2.12c0.91,0 1.76,0.35 2.44,1.03l1.13,1 1.51,-1.34L9.22,1.7C8.2,0.68 6.84,0.12 5.4,0.12 2.42,0.12 0,2.54 0,5.5s2.42,5.38 5.4,5.38c1.44,0 2.8,-0.56 3.77,-1.53l2.83,-2.5 0.01,0.01L13.52,5.5h-0.01l2.69,-2.39c0.64,-0.64 1.49,-0.99 2.4,-0.99 1.87,0 3.39,1.51 3.39,3.38s-1.52,3.38 -3.39,3.38c-0.9,0 -1.76,-0.35 -2.44,-1.03l-1.14,-1.01 -1.51,1.34 1.27,1.12c1.02,1.01 2.37,1.57 3.82,1.57 2.98,0 5.4,-2.41 5.4,-5.38s-2.42,-5.37 -5.4,-5.37z"/>
</vector>
然后，一旦整个形状移动 "up" 6.5 个单位，您就可以从视口和固有高度中减去 11 (6.5 * 2)。
最终结果是一个 24x13dp 的形状，在广角视图中应该会更好地缩放。