android - 在我的 VectorDrawable 图像周围创建细矩形边框线

Question

我想在我当前使用的 VectorDrawable 图像文件周围创建一个矩形边框，但到目前为止我做不到。

这是我的图像 xml 文件:

<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:width="24dp"
    android:height="24dp"
    android:viewportHeight="24"
    android:viewportWidth="24">


        <path
            android:fillColor="@color/white_white"
            android:pathData="M17,8c0.552,0 1,0.449 1,1s-0.448,1 -1,1 -1,-0.449 -1,-1 0.448,-1 1,-1zM17,6c-1.657,0 -3,1.343 -3,3s1.343,3 3,3 3,-1.343 3,-3 -1.343,-3 -3,-3zM7,12c-1.657,0 -3,1.343 -3,3s1.343,3 3,3 3,-1.343 3,-3 -1.343,-3 -3,-3zM17,4c0.343,0 0.677,0.035 1,0.101v-2.101c0,-0.552 -0.447,-1 -1,-1s-1,0.448 -1,1v2.101c0.323,-0.066 0.657,-0.101 1,-0.101zM7,10c0.343,0 0.677,0.035 1,0.101v-8.101c0,-0.552 -0.447,-1 -1,-1s-1,0.448 -1,1v8.101c0.323,-0.066 0.657,-0.101 1,-0.101zM17,14c-0.343,0 -0.677,-0.035 -1,-0.101v8.101c0,0.552 0.447,1 1,1s1,-0.448 1,-1v-8.101c-0.323,0.066 -0.657,0.101 -1,0.101zM7,20c-0.343,0 -0.677,-0.035 -1,-0.101v2.101c0,0.552 0.447,1 1,1s1,-0.448 1,-1v-2.101c-0.323,0.066 -0.657,0.101 -1,0.101z" />

</vector>

这是我到目前为止尝试过的:

<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:width="24dp"
    android:height="24dp"
    android:viewportHeight="24"
    android:viewportWidth="24">

    <group android:name="groupName">

        <path
            android:strokeWidth="2"
            android:strokeColor="@color/white_white"/>

        <path
            android:fillColor="@color/white_white"
            android:pathData="M17,8c0.552,0 1,0.449 1,1s-0.448,1 -1,1 -1,-0.449 -1,-1 0.448,-1 1,-1zM17,6c-1.657,0 -3,1.343 -3,3s1.343,3 3,3 3,-1.343 3,-3 -1.343,-3 -3,-3zM7,12c-1.657,0 -3,1.343 -3,3s1.343,3 3,3 3,-1.343 3,-3 -1.343,-3 -3,-3zM17,4c0.343,0 0.677,0.035 1,0.101v-2.101c0,-0.552 -0.447,-1 -1,-1s-1,0.448 -1,1v2.101c0.323,-0.066 0.657,-0.101 1,-0.101zM7,10c0.343,0 0.677,0.035 1,0.101v-8.101c0,-0.552 -0.447,-1 -1,-1s-1,0.448 -1,1v8.101c0.323,-0.066 0.657,-0.101 1,-0.101zM17,14c-0.343,0 -0.677,-0.035 -1,-0.101v8.101c0,0.552 0.447,1 1,1s1,-0.448 1,-1v-8.101c-0.323,0.066 -0.657,0.101 -1,0.101zM7,20c-0.343,0 -0.677,-0.035 -1,-0.101v2.101c0,0.552 0.447,1 1,1s1,-0.448 1,-1v-2.101c-0.323,0.066 -0.657,0.101 -1,0.101z" />
    </group>

</vector>

但是没有用。

Answer 1

如果我没理解错的话，你有一些可绘制的矢量，你希望给它一个白色的矩形边框。在这种情况下，我建议使用 layerdrawable，它可以通过编程方式完成，但也可以通过制作以下图层列表 xml 文件来完成:

yourvector_withbackground.xml

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/yourvector"
    android:left="5dp"
    android:top="5dp"
    android:right="5dp"
    android:bottom="5dp"></item>
    <item android:drawable="@drawable/background"></item>
</layer-list>

这个 layer-list xml 只是将两个 drawable 放在彼此之上，项目的顺序决定了哪个在前台，哪个在后台。 '5dp' 为可绘制对象提供填充，帮助您将矢量定位在边框内。可绘制对象 yourvector.xml 是您的原始矢量可绘制对象，background.xml 包含边框并显示在下面的代码中:

<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle" >
    <stroke android:width="1dip" android:color="@color/white"/>
</shape>