Android中通过属性动画实现文字轮播效果

news2024/12/30 2:49:11

前些天发现了一个蛮有意思的人工智能学习网站,8个字形容一下"通俗易懂，风趣幽默"，感觉非常有意思,忍不住分享一下给大家。
👉点击跳转到教程

一、创建一个自定义ProvinceView类,具体代码如下

/**
 * @Author: ly
 * @Date: 2024/2/22
 * @Description:
 */
private val provinces = listOf(
    "中原区",
    "二七区",
    "管城回族区",
    "金水区",
    "上街区",
    "惠济区",
    "中牟县",
    "巩义市",
    "荥阳市",
    "新密市",
    "新郑市",
    "登封市"
)

class ProvinceView(context: Context, attrs: AttributeSet) : View(context, attrs) {
    private val paint = Paint(Paint.ANTI_ALIAS_FLAG).apply {
        textSize = 30.dp
        textAlign = Paint.Align.CENTER
    }
    var province = "中原区"
        set(value) {
            field = value
            invalidate()
        }

    init {
        paint.color = Color.parseColor("#FF0000")
        setLayerType(LAYER_TYPE_SOFTWARE, null)
    }

    override fun onDraw(canvas: Canvas) {
        super.onDraw(canvas)
        canvas.drawText(province, width / 2f, height / 2f, paint)
    }
}

class ProvinceEvaluator : TypeEvaluator<String> {
    override fun evaluate(fraction: Float, startValue: String, endValue: String): String {
        val startIndex = provinces.indexOf(startValue)
        val endIndex = provinces.indexOf(endValue)
        val currentIndex = startIndex + ((endIndex - startIndex) * fraction).toInt()
        return provinces[currentIndex]
    }
}

二、在对应的xml中引入该自定义View

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <com.example.customviewanimation.view.ProvinceView
        android:id="@+id/view"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

</androidx.constraintlayout.widget.ConstraintLayout>

三、在Activity中通过属性动画来实现文字轮播效果

class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
                val animator = ObjectAnimator.ofObject(view, "province", ProvinceEvaluator(), "登封市")
        animator.startDelay = 1000
        animator.duration = 8000
        animator.start()
    }
}