可以使用GradientColor完全以XML定义填充或笔触的渐变吗? [英] Can GradientColor be used to define a gradient for a fill or stroke entirely in XML?

问题描述

我正在查看GradientColor https://developer的文档. android.com/reference/android/R.styleable.html#GradientColor .如何在XML中定义渐变颜色并将其应用于XML矢量可绘制对象?

I was looking at the documentation for GradientColor https://developer.android.com/reference/android/R.styleable.html#GradientColor . How can I define a gradient color in XML and apply it to an XML vector drawable?

我已经尝试过在color.xml，styles.xml以及可绘制的XML向量中使用.

I have tried in color.xml, styles.xml and within an XML vector drawable.

我收到以下错误:

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

    <path
        android:name="play_triangle"
        android:pathData="M 30 30 L 30 90 L 80 60 z"
        android:strokeColor="@id/gradclor"
        android:strokeWidth="5"/>

    <color
        android:name="@+id/gradclor"
        android:startColor="#FFFFFF"
        android:endColor="#00FFFF"
        android:angle="145"/>

</vector>

或 使用以下方法时:无法将#FFFFFFFF#00FFFFFF 145转换为ColorStateList"

or "Failed to convert #FFFFFFFF #00FFFFFF 145 into a ColorStateList" when using:

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

    <path
        android:name="play_triangle"
        android:pathData="M 30 30 L 30 90 L 80 60 z"
        android:strokeColor="@color/GradientStrokeBorder"
        android:strokeWidth="5"/>

</vector>

在color.xml中具有以下内容:

with the following in color.xml:

<color name="GradientStrokeBorder">
    <item name="android:startColor">#FFFFFF</item>
    <item name="android:endColor">#00FFFF</item>
    <item name="android:angle">145</item>
</color>

推荐答案

我终于使它起作用了. Android Studio(当前版本为2.2)尚不支持渐变颜色功能，因此它无法帮助您完成自动填充，而是将渐变标记标记为错误.不过，该功能确实有效，我已经在Nexus 5X/API 24上成功进行了测试.当然，您必须使用API​​ 24+设备，因为否则操作系统不支持此功能.

I've finally made it work. Gradient color feature is not supported yet in Android Studio (current ver is 2.2) so it doesn't help you with autocomplete but marks gradient tag as error instead. Nevertheless, the feature does actually work, I've tested it successfully on Nexus 5X / API 24. Of course, you have to use an API 24+ device because otherwise this feature is not supported by OS.

首先，您需要像这样添加色彩资源文件:

First, you need to add color resource file like this:

<?xml version="1.0" encoding="utf-8"?>
<gradient xmlns:android="http://schemas.android.com/apk/res/android"
    android:startColor="#FFFFFF"
    android:centerColor="#0000FF"
    android:endColor="#00FFFF"
    android:angle="145"
    android:startX="30"
    android:endX="70"
    android:startY="30"
    android:endY="70"
    android:type="linear"/>

请注意开始/结束参数，因为我发现它们对于矢量渐变至关重要.

Please pay attention to start/end parameters as I found they are essential for vector gradients.

将此文件以某个名称放置到res/color文件夹中.我已将其命名为gradient.xml，因此完整路径为res/color/gradient.xml.之后，您可以在颜色属性(包括矢量路径颜色)中引用此资源:

Place this file into res/color folder under some name. I've named it gradient.xml so the full path is res/color/gradient.xml. After that you can refer to this resource in color attributes, including vector path colors:

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

    <path
        android:name="play_triangle"
        android:pathData="M 30 30 L 30 90 L 80 60 z"
        android:strokeWidth="10"
        android:strokeColor="@color/gradient"/>

</vector>

请注意笔触颜色中对渐变颜色资源的引用.希望这会有所帮助！

Notice the reference to gradient color resource in strokeColor. Hope this helps!

这篇关于可以使用GradientColor完全以XML定义填充或笔触的渐变吗?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！