网站建立的seo研究中心超逸seo
这是一个用于 Android 的自定义 View，模拟蓝牙扫描时的多波浪扩散动画效果。每个波浪的半径逐渐增大，透明度逐渐降低，形成连续的波纹扩散效果。通过调整动画的延迟时间和时长，确保波浪之间的间隙较小，动画流畅且美观。
主要特性：
多波浪扩散：
支持多个圆圈（波浪）依次扩散，形成连续的波纹效果。
每个圆圈的半径逐渐增大，透明度逐渐降低。
间隙较小：
通过调整动画的延迟时间和动画时长，确保波浪之间的间隙较小。
自定义View：
使用 Canvas 和 Paint 实现自定义绘制。
使用 ValueAnimator 实现平滑的动画效果。
适用场景：
蓝牙扫描界面。
雷达扫描效果。
其他需要波纹扩散动画的场景。
使用方法：
将 BluetoothScanView 添加到布局文件中。
在 Activity 中调用 startScan() 启动动画，调用 stopScan() 停止动画。
实现步骤
1. 自定义View
BluetoothScanView.kt
import android.animation.ValueAnimator
import android.content.Context
import android.graphics.Canvas
import android.graphics.Color
import android.graphics.Paint
import android.util.AttributeSet
import android.view.Viewclass BluetoothScanView @JvmOverloads constructor(context: Context, attrs: AttributeSet? = null, defStyleAttr: Int = 0
) : View(context, attrs, defStyleAttr) {private val scanPaint = Paint().apply {color = Color.BLUEstyle = Paint.Style.STROKEstrokeWidth = 5fisAntiAlias = true}private val circles = mutableListOf<Circle>()private val animators = mutableListOf<ValueAnimator>()private fun init() {// 初始化圆圈和动画列表circles.clear()animators.clear()}override fun onDraw(canvas: Canvas) {super.onDraw(canvas)val centerX = width / 2val centerY = height / 2// 绘制所有圆圈for (circle in circles) {scanPaint.alpha = circle.alphacanvas.drawCircle(centerX.toFloat(), centerY.toFloat(), circle.radius.toFloat(), scanPaint)}}fun startScan() {if (animators.isNotEmpty()) returninit()// 初始化3个圆圈repeat(3) { circles.add(Circle(0, 255))}// 为每个圆圈创建独立的动画for ((i, circle) in circles.withIndex()) {val animator = ValueAnimator.ofFloat(0f, 1f).apply {duration = 1500startDelay = i * 500LrepeatCount = ValueAnimator.INFINITErepeatMode = ValueAnimator.RESTARTaddUpdateListener {val progress = animatedValue as Floatcircle.radius = (progress * width / 2).toInt()circle.alpha = (255 * (1 - progress)).toInt()invalidate()}}animators.add(animator)animator.start()}}fun stopScan() {animators.forEach { it.cancel() }animators.clear()circles.clear()invalidate()}// 圆圈类，用于存储半径和透明度private data class Circle(var radius: Int, var alpha: Int)
}
注意：在Kotlin中，我们使用了@JvmOverloads注解来支持Java中的多构造函数特性。同时，通过使用apply、let、repeat等作用域函数简化了代码，并利用Kotlin的数据类（data class）特性定义了Circle类。此外，也对一些变量声明进行了调整，使其更符合Kotlin的习惯用法。
Activity代码：
import android.os.Bundle
import androidx.appcompat.app.AppCompatActivityclass MainActivity : AppCompatActivity() {private lateinit var bluetoothScanView: BluetoothScanViewoverride fun onCreate(savedInstanceState: Bundle?) {super.onCreate(savedInstanceState)setContentView(R.layout.activity_main)// 初始化自定义ViewbluetoothScanView = findViewById(R.id.bluetoothScanView)// 确保View尺寸已确定后启动动画bluetoothScanView.post {bluetoothScanView.startScan() // 启动扫描动画}}override fun onDestroy() {super.onDestroy()bluetoothScanView.stopScan() // 停止扫描动画}
}
布局文件
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="match_parent"android:layout_height="match_parent"android:padding="16dp"><!-- 自定义蓝牙扫描View --><com.example.BluetoothScanViewandroid:id="@+id/bluetoothScanView"android:layout_width="300dp"android:layout_height="300dp"android:layout_centerInParent="true" /></RelativeLayout>运行效果
波浪扩散：
页面加载后，第一个圆圈开始扩散，随后第二个、第三个圆圈依次开始。
每个圆圈的半径逐渐增大，透明度逐渐降低。
间隙较小：
每个波浪之间的启动间隔为 500 毫秒，动画时长为 1500 毫秒，波浪之间的间隙较小。
连续波纹效果：
当一个圆圈的动画结束时，下一个圆圈的动画立即开始，形成连续的波纹效果。
动画循环：
动画无限循环，波纹效果持续不断。