android 如何从这个PNG图像创建一个可绘制的xml？

wfypjpf4 于 2023-03-16 发布在 Android

关注(0)|答案(2)|浏览(225)

我有这个PNG图像上面（我从Figma导出）。我如何使用drawable xml重新创建它？我想尝试使用layer-list，但我不知道如何做。我需要使用drawable，因为我需要设置自定义颜色给它。
下面是我的可绘制代码：
background.xml

<?xml version="1.0" encoding="utf-8"?>
    <layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:drawable="@drawable/background_color"/>
    <item>
        <shape android:shape="rectangle">
            <!-- I'm suppose I need to add some code here but I'm not sure what it is -->
        </shape>
    </item>
</layer-list>

背景颜色.xml：

<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
    <gradient
        android:angle="90"
        android:endColor="@color/primary"
        android:startColor="@color/secondary" />
</shape>

colors.xml:

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="primary">#001A6E</color>
    <color name="secondary">#0070C0</color>
    ...
</resources>

有没有其他更好的方法来重新创建这个PNG图像？

android

来源：https://stackoverflow.com/questions/75729031/how-to-create-a-drawable-xml-from-this-png-image

2条答案

按热度按时间

6xfqseft1#

希望它有帮助...我不使用导出的图像在这里，因为我得到了从您的资源渐变颜色。
您可以根据需要调整bottomLeftRadius或bottomRightRadius。它的高级解决方案用于此目的。

<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <gradient
        android:angle="90"
        android:endColor="#001A6E"
        android:startColor="#0070C0" />

    <padding
        android:bottom="1dp"
        android:left="1dp"
        android:right="1dp"
        android:top="1dp" />

    <corners
        android:bottomLeftRadius="40dp"
        android:bottomRightRadius="40dp"
        android:topLeftRadius="0dp"
        android:topRightRadius="0dp" />

</shape>

赞(0）回复(0）举报 2023-03-16

flmtquvp2#

我希望它能帮助你创建三个不同的可绘制的xml文件，以实现你想要的。我也使用了你的颜色资源。
image.xml

<?xml version="1.0" encoding="UTF-8"?>
    <layer-list xmlns:android="http://schemas.android.com/apk/res/android">
      <item
         android:drawable="#001A6E"/>
      <item>
         <shape android:shape="rectangle">
         </shape>
      </item>
    </layer-list>

image_background_white.xml

<?xml version="1.0" encoding="UTF-8"?>
      <layer-list xmlns:android="http://schemas.android.com/apk/res/android">
         <item
            android:drawable="#ffffff"/>
         <item>
            <shape android:shape="rectangle">
            </shape>
         <item>
      </layer-list>

image_with_roundcorner.xml

<shape xmlns:android="http://schemas.android.com/apk/res/android">
 <gradient
     android:angle="90"
     android:endColor="#001A6E"
     android:startColor="#0070C0" />

 <corners
     android:bottomLeftRadius="50dp"
     android:bottomRightRadius="50dp"
     android:topLeftRadius="0dp"
     android:topRightRadius="0dp" />

</shape>

在你的主xml中使用上面的三个drawable，如下所示：

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

<ImageView
    android:layout_width="match_parent"
    android:layout_height="100dp"
    android:src="@drawable/image" />

<ImageView
    android:layout_width="match_parent"
    android:layout_height="100dp"
    android:src="@drawable/image_background_white" />

<ImageView
    android:layout_width="match_parent"
    android:layout_height="150dp"
    android:src="@drawable/image_with_roundcorner" />

</LinearLayout>

赞(0）回复(0）举报 2023-03-16

我来回答

android 如何从这个PNG图像创建一个可绘制的xml？

2条答案

相关问题

热门标签

最新问答