如何创建这样的图像视图背景？

Question

我想显示从 Internet 加载到此 bg 形状的图像。但是我尝试在 drawable 文件夹中创建 bg drawables 文件

    <?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="rectangle">
            <corners android:radius="20dp" />
            <size
                android:width="150dp"
                android:height="100dp" />
            <gradient
                android:endColor="@color/purple_500"
                android:startColor="@color/purple_200" />

        </shape>
    </item>

</layer-list>

但我只能为背景视图设置角半径。我想调整左上角宽度和右上角宽度之类的东西。提前致谢！

Answer 1

像这样尝试VectorDrawable：

<vector xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:aapt="http://schemas.android.com/aapt"
android:width="632dp"
android:height="880dp"
android:viewportWidth="632"
android:viewportHeight="880">
<path
    android:fillType="evenOdd"
    android:pathData="M631.712,22.645L519.757,861.891C518.432,871.826 509.956,879.246 499.933,879.246L113.343,879.246C103.15,879.246 94.588,871.58 93.465,861.449L0.461,22.203C-0.756,11.224 7.157,1.338 18.136,0.122C18.867,0.041 19.603,0 20.339,0L611.888,0C622.934,0 631.888,8.954 631.888,20C631.888,20.884 631.829,21.768 631.712,22.645Z"
    android:strokeWidth="1"
    android:strokeColor="#00000000">
    <aapt:attr name="android:fillColor">
        <gradient
            android:endX="315.566"
            android:endY="879.246"
            android:startX="315.566"
            android:startY="0"
            android:type="linear">
            <item
                android:color="@color/purple_500"
                android:offset="0" />
            <item
                android:color="@color/purple_200"
                android:offset="1" />
        </gradient>
    </aapt:attr>
</path>

或者没有gradient:

    <vector xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:aapt="http://schemas.android.com/aapt"
android:width="632dp"
android:height="880dp"
android:viewportWidth="632"
android:viewportHeight="880">
<path
    android:fillType="evenOdd"
    android:pathData="M631.712,22.645L519.757,861.891C518.432,871.826 509.956,879.246 499.933,879.246L113.343,879.246C103.15,879.246 94.588,871.58 93.465,861.449L0.461,22.203C-0.756,11.224 7.157,1.338 18.136,0.122C18.867,0.041 19.603,0 20.339,0L611.888,0C622.934,0 631.888,8.954 631.888,20C631.888,20.884 631.829,21.768 631.712,22.645Z"
    android:strokeWidth="1"
    android:fillColor="#FF9DC6FF"
    android:strokeColor="#00000000"/>

Svg 文件：

<svg width="632px" height="880px" viewBox="0 0 632 880" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<defs>
    <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-1">
        <stop stop-color="#9DC6FF" offset="0%"></stop>
        <stop stop-color="#9DC6FF" offset="100%"></stop>
    </linearGradient>
</defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
    <path d="M631.71243,22.6445699 L519.757152,861.890517 C518.431753,871.826058 509.956322,879.245947 499.932767,879.245947 L113.343313,879.245947 C103.150125,879.245947 94.5877291,871.580012 93.465002,861.448844 L0.460505474,22.2028969 C-0.756120891,11.2244089 7.15743152,1.33831544 18.1359195,0.121689075 C18.8674201,0.04062482 19.6028377,3.56623339e-14 20.3388164,3.55271368e-14 L611.888044,3.55271368e-15 C622.933739,6.038694e-14 631.888044,8.954305 631.888044,20 C631.888044,20.8844366 631.829377,21.7678993 631.71243,22.6445699 Z" id="Polygon" fill="url(#linearGradient-1)"></path>
</g>

<svg width="632px" height="880px" viewBox="0 0 632 880" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
    <defs>
        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-1">
            <stop stop-color="#9DC6FF" offset="0%"></stop>
            <stop stop-color="#9DC6FF" offset="100%"></stop>
        </linearGradient>
    </defs>
    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
        <path d="M631.71243,22.6445699 L519.757152,861.890517 C518.431753,871.826058 509.956322,879.245947 499.932767,879.245947 L113.343313,879.245947 C103.150125,879.245947 94.5877291,871.580012 93.465002,861.448844 L0.460505474,22.2028969 C-0.756120891,11.2244089 7.15743152,1.33831544 18.1359195,0.121689075 C18.8674201,0.04062482 19.6028377,3.56623339e-14 20.3388164,3.55271368e-14 L611.888044,3.55271368e-15 C622.933739,6.038694e-14 631.888044,8.954305 631.888044,20 C631.888044,20.8844366 631.829377,21.7678993 631.71243,22.6445699 Z" id="Polygon" fill="url(#linearGradient-1)"></path>
    </g>
</svg>