Android 控件背景实现发光效果

主要实现的那种光晕效果：中间亮，四周逐渐变淡的。

这边有三种发光效果，先上效果图。

第一种、圆形发光体

实现代码：新建shape_light.xml，导入以下代码。使用时，直接给view设置为background。

XML 复制代码

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">
    <gradient
        android:centerColor="@color/transparent"
        android:centerX="0.5"
        android:centerY="0.5"
        android:gradientRadius="180dp"
        android:startColor="@color/yellow"
        android:type="radial" />
</shape>

第二种、矩形发光体

代码实现：通过自定义view实现。

Kotlin 复制代码

package com.fht.testproject

import android.annotation.SuppressLint
import android.content.Context
import android.graphics.Canvas
import android.graphics.Color
import android.graphics.Paint
import android.graphics.RectF
import android.util.AttributeSet
import android.view.View

/**
 * @author fenghaitao
 * @time 2023/11/1 16:40
 */
class RectLightView @JvmOverloads constructor(
    context: Context, attributeSet: AttributeSet, defStyleAttr: Int = 0
) : View(context, attributeSet, defStyleAttr) {
    private val paint: Paint = Paint()
    private val corner = 50f
    private val count = 200

    init {
        paint.isAntiAlias = false
        paint.style = Paint.Style.FILL
        paint.color = Color.YELLOW
    }

    @SuppressLint("DrawAllocation")
    override fun onDraw(canvas: Canvas?) {
        super.onDraw(canvas)
        val w = width / count
        val h = height / count
        for (i in 0..count) {
            paint.alpha = (255 / count) * i
            if (((width - 2 * (w * i)) > 0) && ((height - 2 * (h * i)) > 0)) {
                val rectF = RectF().apply {
                    left = (w * i).toFloat()
                    top = (h * i).toFloat()
                    right = (width - w * i).toFloat()
                    bottom = (height - h * i).toFloat()
                }
                canvas?.drawRoundRect(rectF, corner, corner, paint)
            }
        }
    }
}

第三种、矩形发光体，比上一种更透明

这种有点瑕疵，中间有一点空白，不过稍微修改一下代码也可以去掉，这里就不做修改了。

代码实现：通过自定义view实现。

Kotlin 复制代码

package com.fht.testproject

import android.annotation.SuppressLint
import android.content.Context
import android.graphics.Canvas
import android.graphics.Color
import android.graphics.Paint
import android.graphics.RectF
import android.util.AttributeSet
import android.view.View

/**
 * @author fenghaitao
 * @time 2023/11/1 16:40
 */
class LightView @JvmOverloads constructor(
    context: Context, attributeSet: AttributeSet, defStyleAttr: Int = 0
) : View(context, attributeSet, defStyleAttr) {
    private val paint: Paint = Paint()
    private val corner = 1f
    private val count = 100

    init {
        paint.isAntiAlias = false
        paint.style = Paint.Style.STROKE
        paint.color = Color.YELLOW
    }

    @SuppressLint("DrawAllocation")
    override fun onDraw(canvas: Canvas?) {
        super.onDraw(canvas)
        val w = width / count
        val h = height / count
        paint.strokeWidth = w.toFloat()
        for (i in 0..count) {
            paint.alpha = (255 / count) * i
            if (((width - 2 * (w * i)) > 0) && ((height - 2 * (w * i)) > 0)) {
                val rectF = RectF().apply {
                    left = (w * i).toFloat()
                    top = (w * i).toFloat()
                    right = (width - w * i).toFloat()
                    bottom = (height - w * i).toFloat()
                }
                canvas?.drawRect(rectF, paint)
            }
        }
    }
}