android中的循环渐变

Question

我正在尝试制作一个从屏幕中间以白色发出的渐变,并在向屏幕边缘移动时变为黑色.

当我制作像这样的"普通"渐变时,我一直在尝试不同的形状:

<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <gradient android:startColor="#E9E9E9" android:endColor="#D4D4D4"
        android:angle="270"/>
</shape>

当使用"椭圆形"形状时,我至少得到了圆形,但没有渐变效果.我怎么能做到这一点？'

Answer 1

你可以使用android:type="radial"以下方法获得圆形渐变:

<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <gradient android:type="radial" android:gradientRadius="250"
        android:startColor="#E9E9E9" android:endColor="#D4D4D4" />
</shape>

Answer 2

在学习新概念时,我总能找到有用的图像,所以这是一个补充答案.

这%p意味着父母的百分比,即我们设定的任何视图的最窄维度的百分比.上面的图像是通过更改gradientRadius此代码生成的

my_gradient_drawable

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <gradient
        android:type="radial"
        android:gradientRadius="10%p"
        android:startColor="#f6ee19"
        android:endColor="#115ede" />
</shape>

可以background像这样在视图的属性上设置

<View
    android:layout_width="200dp"
    android:layout_height="100dp"
    android:background="@drawable/my_gradient_drawable"/>

中央

您可以使用更改半径的中心

android:centerX="0.2"
android:centerY="0.7"

其中小数是宽度和高度的级分x和y分别.

文档

以下是文档中的一些注释,可以解释更多内容.

android:gradientRadius

渐变的半径,仅用于径向渐变.可以是相对于形状的最小尺寸的显式尺寸或小数值.

可能是浮点值,例如"1.2".

可以是维值,它是附加有诸如"14.5sp"的单位的浮点数.可用单位为:px(像素),dp(与密度无关的像素),sp(基于首选字体大小的缩放像素),in(英寸)和mm(毫米).

可以是小数值,它是附加%或%p的浮点数,例如"14.5%".%后缀总是表示基本大小的百分比; 可选的%p后缀提供相对于某个父容器的大小.

Answer 3

如果您需要更多控制，例如多种颜色和定位，您也可以在代码中进行。这是我创建可绘制径向渐变的 Kotlin 片段：

object ShaderUtils {
    private class RadialShaderFactory(private val colors: IntArray, val positionX: Float,
                                      val positionY: Float, val size: Float): ShapeDrawable.ShaderFactory() {

        override fun resize(width: Int, height: Int): Shader {
            return RadialGradient(
                    width * positionX,
                    height * positionY,
                    minOf(width, height) * size,
                    colors,
                    null,
                    Shader.TileMode.CLAMP)
        }
    }

    fun radialGradientBackground(vararg colors: Int, positionX: Float = 0.5f, positionY: Float = 0.5f,
                                 size: Float = 1.0f): PaintDrawable {
        val radialGradientBackground = PaintDrawable()
        radialGradientBackground.shape = RectShape()
        radialGradientBackground.shaderFactory = RadialShaderFactory(colors, positionX, positionY, size)
        return radialGradientBackground
    }
}

基本用法（但可以随意调整其他参数）：

view.background = ShaderUtils.radialGradientBackground(Color.TRANSPARENT, BLACK)