在特定时间段内为 TextView 着色 Android

有没有办法在特定时间段内为文本TextView或其他内容着色Android。所以它会从全白文本开始,然后coloring从左到右移动并在某个时间填充它duration
因此,例如,如果duration将是10那么整条线应该在10几秒钟内着色,但它也应该以相同的速度移动。

看起来像这样:

http://img4.mukewang.com/61c2da4b0001bf9903600053.jpg

有一种方法可以IOS使用CATextLayer,但我还没有找到一种方法来使用Android


慕侠2389804
浏览 144回答 3
3回答

UYOU

我去年刚刚创建了一个自定义的 TextView,这是我的课public class AKChangeColorTextView extends TextView {&nbsp; &nbsp; public AKChangeColorTextView(Context context) {&nbsp; &nbsp; &nbsp; &nbsp; this(context,null);&nbsp; &nbsp; }&nbsp; &nbsp; String TAG = "AKChangeColorTextView";&nbsp; &nbsp; public AKChangeColorTextView(Context context, AttributeSet attrs) {&nbsp; &nbsp; &nbsp; &nbsp; this(context, attrs,0);&nbsp; &nbsp; }&nbsp; &nbsp; RectF mRectF;&nbsp; &nbsp; float mX;&nbsp; &nbsp; float mY;&nbsp; &nbsp; public AKChangeColorTextView(Context context, AttributeSet attrs, int defStyleAttr) {&nbsp; &nbsp; &nbsp; &nbsp; super(context, attrs, defStyleAttr);&nbsp; &nbsp; &nbsp; &nbsp; mPaint = new Paint();&nbsp; &nbsp; &nbsp; &nbsp; mPaint.setAntiAlias(true);&nbsp; &nbsp; &nbsp; &nbsp; mPaint.setColor(Color.BLUE);&nbsp; &nbsp; &nbsp; &nbsp; PorterDuffXfermode mode = new PorterDuffXfermode(PorterDuff.Mode.SRC_IN);&nbsp; &nbsp; &nbsp; &nbsp; mPaint.setXfermode(mode);&nbsp; &nbsp; &nbsp; &nbsp; float x = 60;&nbsp; &nbsp; &nbsp; &nbsp; float y = 10;&nbsp; &nbsp; &nbsp; &nbsp; mY =&nbsp; &nbsp; 0;&nbsp; &nbsp; &nbsp; &nbsp; mRectF = new RectF(x, y, x + 50, y + 50);&nbsp; &nbsp; &nbsp; &nbsp; mTPaint = getPaint();&nbsp; &nbsp; &nbsp; &nbsp; mX = 0;&nbsp; &nbsp; }&nbsp; &nbsp; Paint mPaint;&nbsp; &nbsp; TextPaint mTPaint;&nbsp; &nbsp; Bitmap shadowBitmap ;&nbsp; &nbsp; Rect bounds = new Rect();&nbsp; &nbsp; Canvas textCanvas;&nbsp; &nbsp; @Override&nbsp; &nbsp; protected void onDraw(Canvas canvas) {//&nbsp; &nbsp; &nbsp; &nbsp; super.onDraw(canvas);&nbsp; &nbsp; &nbsp; &nbsp; if (shadowBitmap == null) {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; shadowBitmap = Bitmap.createBitmap(getMeasuredWidth(),getMeasuredHeight(), Bitmap.Config.ARGB_8888);&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; if (textCanvas == null) {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; textCanvas = new Canvas(shadowBitmap);&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; textCanvas.drawColor(Color.TRANSPARENT, PorterDuff.Mode.CLEAR);&nbsp; &nbsp; &nbsp; &nbsp; if (mTPaint == null) {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; mTPaint = getPaint();&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; String content&nbsp; = getText().toString();&nbsp; &nbsp; &nbsp; &nbsp; mTPaint.getTextBounds(content,0,content.length(),bounds);&nbsp; &nbsp; &nbsp; &nbsp; textCanvas.drawText(content,0,bounds.height(),mTPaint);&nbsp; &nbsp; &nbsp; &nbsp; mRectF.set(colorLeft,mY,colorRight,mY+bounds.height()+10);&nbsp; &nbsp; &nbsp; &nbsp; textCanvas.drawRect(mRectF,mPaint);&nbsp; &nbsp; &nbsp; &nbsp; canvas.drawBitmap(shadowBitmap,0,0,null);&nbsp; &nbsp; }&nbsp; &nbsp; float colorLeft;&nbsp; &nbsp; float colorRight;&nbsp; &nbsp; public void setXOffset(float left,float right){&nbsp; &nbsp; &nbsp; &nbsp; colorLeft = left;&nbsp; &nbsp; &nbsp; &nbsp; colorRight = right;&nbsp; &nbsp; &nbsp; &nbsp; invalidate();&nbsp; &nbsp; }}我的演示代码:class MainActivity : AppCompatActivity() {&nbsp; &nbsp; val TAG = "MainActivity"&nbsp; &nbsp; lateinit var countDownTimer:CountDownTimer&nbsp; &nbsp; var currentOffsetx = 0&nbsp; &nbsp; var textWidth = 0&nbsp; &nbsp; var isIncrease = true&nbsp; &nbsp; lateinit var txt:AKChangeColorTextView&nbsp; &nbsp; override fun onCreate(savedInstanceState: Bundle?) {&nbsp; &nbsp; &nbsp; &nbsp; super.onCreate(savedInstanceState)&nbsp; &nbsp; &nbsp; &nbsp; setContentView(R.layout.activity_main)&nbsp; &nbsp; &nbsp; &nbsp; setSupportActionBar(toolbar)&nbsp; &nbsp; &nbsp; &nbsp; (findViewById<View>(R.id.tv_hello) as AKChangeColorTextView).apply{&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; txt = this&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; countDownTimer = object:CountDownTimer(300000,200){&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; override fun onFinish() {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; override fun onTick(millisUntilFinished: Long) {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; if (textWidth == 0) {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; textWidth = txt.width&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; if (currentOffsetx <= textWidth) {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; if (isIncrease) {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; currentOffsetx += 10&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; currentOffsetx = min(currentOffsetx, textWidth)&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; } else {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; currentOffsetx -= 10&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; currentOffsetx = max(currentOffsetx, 0)&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; if (currentOffsetx == textWidth) {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; isIncrease = false&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }else if (currentOffsetx == 0) {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; isIncrease = true&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; txt.setXOffset(0f,currentOffsetx.toFloat())&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; Log.w(TAG,"check current tick:$millisUntilFinished,offsetx:$currentOffsetx,txtWidth:$textWidth")&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; countDownTimer.start()&nbsp; &nbsp; }}我的 xml 布局:<com.example.administrator.myapplication.AKChangeColorTextView&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; android:id="@+id/tv_hello"&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; android:layout_width="wrap_content"&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; android:layout_height="wrap_content"&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; android:text="I Found a Love For Aolphn"&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; android:textColor="#000000"&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; app:layout_constraintBottom_toBottomOf="parent"&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; app:layout_constraintLeft_toLeftOf="parent"&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; app:layout_constraintRight_toRightOf="parent"&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; app:layout_constraintTop_toTopOf="parent"/>以下是效果

繁星点点滴滴

有一种方法可以优化、简单、流畅和美观:矢量动画可绘制对象 (API21+)。有很多教程(例如这个视频)展示了如何制作漂亮的动画。基本上步骤如下:为您的文本创建两个 SVG 矢量图像,一个是普通颜色,另一个是彩色字母。例如,您可以在 Adobe Illustrator 中轻松完成此操作。将两者导入shapeshifter.design。根据您的喜好为第二个(彩色层)创建动画。将生成的 xml 文件复制到您的 drawable 中,您就完成了!祝你好运!

慕的地10843

您可以使用文本跨度和前景色跨度并一次为一个字符设置动画
打开App,查看更多内容
随时随地看视频慕课网APP

相关分类

Java