java - 如何在渐变中制作 vector 图像？

Question

有一个 vector 图像文件代码。正在转换为渐变图像。我想要这个 vector 图像作为渐变两个圆圈。

<?xml version="1.0" encoding="utf-8"?>
<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:width="1024.000000dp"
    android:height="1024.000000dp"
    android:viewportWidth="1024.000000"
    android:viewportHeight="1024.000000">

    <group
            android:translateY="1024.000000"
            android:scaleX="0.100000"
            android:scaleY="-0.100000">
        <path
            android:fillColor="#000000"
            android:strokeWidth="1"
            android:pathData="M4750 10229 c-1481 -111 -2824 -843 -3722 -2029 -327 -433 -603 -959 -772 -1475 -238 -726 -312 
-1503 -216 -2260 128 -1003 543 -1931 1210 -2705 100 -117 372 -392 490 -495 431 -380 954 -700 1484 -910 433 -170 829 -271
 1311 -331 173 -22 813 -31 1010 -15 859 72 1667 349 2383 817 577 378 1079 875 1456 1444 154 232 221 349 341 591 274 555 440 
1143 500 1773 17 185 21 736 5 916 -84 969 -426
 1868 -1004 2640 -192 257 -509 597 -746 801 -856 736 -1890 1161 -3008 1238 -177 13 -554 12 -722 0z" />
    </group>
</vector>

Answer 1

我们可以通过合并 vector 和形状来制作 vector 渐变。要合并 vector 和形状，我们必须如下创建图层列表:

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <vector xmlns:android="http://schemas.android.com/apk/res/android"
            android:width="1024.000000dp"
            android:height="1024.000000dp"
            android:viewportWidth="1024.000000"
            android:viewportHeight="1024.000000">

            <group
                android:translateY="1024.000000"
                android:scaleX="0.100000"
                android:scaleY="-0.100000">
                <path
                    android:fillColor="#000000"
                    android:strokeWidth="1"
                    android:pathData="M4750 10229 c-1481 -111 -2824 -843 -3722 -2029 -327 -433 -603 -959 -772 -1475 -238 -726 -312
-1503 -216 -2260 128 -1003 543 -1931 1210 -2705 100 -117 372 -392 490 -495 431 -380 954 -700 1484 -910 433 -170 829 -271
 1311 -331 173 -22 813 -31 1010 -15 859 72 1667 349 2383 817 577 378 1079 875 1456 1444 154 232 221 349 341 591 274 555 440
1143 500 1773 17 185 21 736 5 916 -84 969 -426
 1868 -1004 2640 -192 257 -509 597 -746 801 -856 736 -1890 1161 -3008 1238 -177 13 -554 12 -722 0z" />
            </group>
        </vector>
    </item>

    <item>
        <shape xmlns:android="http://schemas.android.com/apk/res/android"
            android:shape="oval">
            <solid android:color="#8df"/>
            <size
                android:width="48dp"
                android:height="48dp"
                />
            <gradient android:centerColor="@android:color/holo_purple"
                android:startColor="@android:color/holo_red_dark"
                android:endColor="@android:color/holo_green_dark"
                />
        </shape>
    </item>

</layer-list>

您好，如果您想要上面没有图标的图片，那么这里是更新后的答案:

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:width="1024dp"
        android:height="1024dp">
        <shape xmlns:android="http://schemas.android.com/apk/res/android"
            android:shape="oval">
            <gradient
                android:startColor="@color/color1"
                android:centerColor="@color/color2"
                android:endColor="@color/color3"
                />
        </shape>
    </item>

    <item
        android:width="900dp"
        android:height="900dp"
        android:gravity="center">
        <shape xmlns:android="http://schemas.android.com/apk/res/android"
            android:shape="oval">
            <gradient
                android:startColor="@color/color4"
                android:centerColor="@color/color5"
                android:endColor="@color/color6"
                />
        </shape>
    </item>

</layer-list>