简体   繁体   中英

Icon color as gradient in android studio

I want my icon to have a gradient color . I found how to make a gradient background, but it doesn't help in my case.

Here's my icon code:

<vector xmlns:android="http://schemas.android.com/apk/res/android"
        android:width="24dp"
        android:height="24dp"
        android:viewportWidth="24.0"
        android:viewportHeight="24.0">
    <path
        android:strokeColor="#000"
        android:fillColor="#000"
        android:pathData="M12,12m-3.2,0a3.2,3.2 0,1 1,6.4 0a3.2,3.2 0,1 1,-6.4 0"/>
    <path
        android:fillColor="#FF000000"
        android:pathData="M9,2L7.17,4L4,4c-1.1,0 -2,0.9 -2,2v12c0,1.1 0.9,2 2,2h16c1.1,0 2,-0.9 2,-2L22,6c0,-1.1 -0.9,-2 -2,-2h-3.17L15,2L9,2zM12,17c-2.76,0 -5,-2.24 -5,-5s2.24,-5 5,-5 5,2.24 5,5 -2.24,5 -5,5z"/>
</vector>

So far I made this to get a gradient text:

mPicGallery = (Button) getView().findViewById(R.id.get_picture_gallery);
Shader textShader_8 = new LinearGradient(200, 20, 50, 10, new int[]{Color.parseColor("#01579b"),Color.parseColor("#006064")}, new float[]{0, 1}, Shader.TileMode.CLAMP);
mPicGallery.getPaint().setShader(textShader_8);

It's very dirty, but I couldn't find a better way of doing it.

So my question is: How can I make an icon with gradient in the color.

Example of what I mean:

我的意思的例子

Try to do it in VectorDrawable like below

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

<path
    android:fillType="evenOdd"
    android:pathData="M12,12m-3.2,0a3.2,3.2 0,1 1,6.4 0a3.2,3.2 0,1 1,-6.4 0">
    <aapt:attr name="android:fillColor">
        <gradient
            android:gradientRadius="22"
            android:type="radial">
            <item
                android:color="#000000"
                android:offset="0.0" />
            <item
                android:color="#FFFFFFFF"
                android:offset="1.0" />
        </gradient>
    </aapt:attr>
</path>
<path
    android:fillColor="#FF000000"
    android:pathData="M9,2L7.17,4L4,4c-1.1,0 -2,0.9 -2,2v12c0,1.1 0.9,2 2,2h16c1.1,0 2,-0.9 2,-2L22,6c0,-1.1 -0.9,-2 -2,-2h-3.17L15,2L9,2zM12,17c-2.76,0 -5,-2.24 -5,-5s2.24,-5 5,-5 5,2.24 5,5 -2.24,5 -5,5z" />

You will find more details in the docs

https://developer.android.com/reference/android/graphics/drawable/GradientDrawable

and probably many more tutorials if You ask uncle google :)

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM