android - 在TextView中播放/暂停选取框并平稳运行

Question

我正在创建TikTok之类的视频应用，并且需要在TextView中实现文本字幕。我也录制了像这样的视频

所以我创建了TextView代码:

<LinearLayout
    android:id="@+id/llSoundDesc"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_marginStart="20dp"
    android:layout_marginBottom="5dp"
    android:orientation="horizontal"
    app:layout_constraintBottom_toTopOf="@+id/tabLayout"
    app:layout_constraintEnd_toStartOf="@+id/layoutSound"
    app:layout_constraintStart_toStartOf="parent"
    tools:ignore="UseCompoundDrawables">

    <ImageView
        android:layout_width="15dp"
        android:layout_height="15dp"
        android:layout_gravity="center"
        android:contentDescription="@string/app_name"
        android:src="@mipmap/ic_music" />

    <TextView
        android:id="@+id/tvSoundDesc"
        android:layout_width="100dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="10dp"
        android:layout_marginBottom="2dp"
        android:ellipsize="marquee"
        android:focusable="true"
        android:focusableInTouchMode="true"
        android:marqueeRepeatLimit="marquee_forever"
        android:scrollHorizontally="true"
        android:singleLine="true"
        android:text="@string/orignal_soun_by"
        android:textColor="@color/white" />
</LinearLayout>

从 HomeActivity.kt:

class HomeActivity : AppCompatActivity() {
    private lateinit var mBinding: ActivityHomeBinding
    private var isPlay = false

    @SuppressLint("ClickableViewAccessibility")
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        mBinding = ActivityHomeBinding.inflate(layoutInflater)
        setContentView(mBinding.root)

        mBinding.tvSoundDesc.isSelected = true
    }
}

因此，此代码将在字幕中冻结几个毫秒后连续显示字幕中的文本，但显示不平稳，然后再次开始，还有另一个问题是我该如何像TikTok应用程序一样播放/暂停？

我也尝试过:

btn.setOnClickListener {
    if (isPlay) {
        isPlay = false
        mBinding.tvSoundDesc.isSelected = false
    } else {
        isPlay = true
        mBinding.tvSoundDesc.isSelected = true
    }
}

但是它是从第一个位置开始的，而不是从当前位置开始的，例如TikTok App!我还尝试了 <marquee>Your text</marquee>的 HTML并将其设置为 TextView，但它也无法正常工作。那么，还有其他方法可以像这样设置 marquee吗？

Answer 1

您可以将ObjectAnimator用于字幕效果，并可以根据需要控制动画。这是您的用例的ObjectAnimator的示例实现:

activity_main.xml

<?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">

    <TextView
        android:id="@+id/tvText"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Hello World!"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <Button
        android:id="@+id/btn_resume"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Resume"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toStartOf="@+id/btn_pause"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toStartOf="parent" />

    <Button
        android:id="@+id/btn_pause"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Pause"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toEndOf="@+id/btn_resume" />

</androidx.constraintlayout.widget.ConstraintLayout>

MainActivity.kt

import android.animation.ObjectAnimator
import android.animation.ValueAnimator
import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.view.animation.LinearInterpolator
import org.imaginativeworld.experimentapp.databinding.ActivityMainBinding

class MainActivity : AppCompatActivity() {

    private lateinit var binding: ActivityMainBinding

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        binding = ActivityMainBinding.inflate(layoutInflater)
        setContentView(binding.root)


        binding.root.post {
            val halfViewWidth = (binding.root.width + binding.tvText.width) / 2f

            val animator = ObjectAnimator.ofFloat(
                binding.tvText,
                "translationX",
                -halfViewWidth,
                halfViewWidth
            ).apply {
                duration = 5000
                repeatCount = ValueAnimator.INFINITE
                interpolator = LinearInterpolator()
                start()
            }

            binding.btnResume.setOnClickListener {
                animator.resume()
            }

            binding.btnPause.setOnClickListener {
                animator.pause()
            }
        }

    }
}

该代码是不言自明的。

更多帮助: https://developer.android.com/guide/topics/graphics/prop-animation#object-animator