Android仿打字机打字效果
Posted 冷不冷
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了Android仿打字机打字效果相关的知识,希望对你有一定的参考价值。
最近不太忙,看了看JS方面的知识,偶然看到一个打字机打字的效果,感觉挺棒的,就打算用android搞一个试试.为了不造重复的轮子,先在度娘上找了找,果然有前辈已经写过这方面的文章.所以参考了一下,并且加入了一些自己的想法,做了一些优化.先来看一下效果吧:
图片可能有点掉帧,实际效果更好一些.
一、简单分析
看到这个效果,想一想其实并不太难,做一个定时器,然后一点一点的把文字显示出来就可以了,为了更加像打字机的效果,可以在每一个字显示出来时在后边加上一些修饰的符号比如” _ “或者” | ” 这些.下边就来实现一下.
二、具体实现
比较简单,先看一下代码:
package com.example.junweiliu.printertextview;
import android.content.Context;
import android.util.AttributeSet;
import android.widget.TextView;
import java.util.Timer;
import java.util.TimerTask;
/**
* Created by junweiliu on 16/12/29.
*/
public class PrinterTextView extends TextView
/**
* TAG
*/
private static final String TAG = "PrinterTextView";
/**
* 默认打字字符
*/
private final String DEFAULT_INTERVAL_CHAR = "_";
/**
* 默认打字间隔时间
*/
private final int DEFAULT_TIME_DELAY = 80;
/**
* 计时器
*/
private Timer mTimer;
/**
* 需要打字的文字
*/
private String mPrintStr;
/**
* 间隔时间
*/
private int intervalTime = DEFAULT_TIME_DELAY;
/**
* 间隔时间
*/
private String intervalChar = DEFAULT_INTERVAL_CHAR;
/**
* 打字进度
*/
private int printProgress = 0;
public PrinterTextView(Context context)
super(context);
public PrinterTextView(Context context, AttributeSet attrs)
super(context, attrs);
public PrinterTextView(Context context, AttributeSet attrs, int defStyleAttr)
super(context, attrs, defStyleAttr);
/**
* 设置要打字的文字
*
* @param str
*/
public void setPrintText(String str)
setPrintText(str, DEFAULT_TIME_DELAY);
/**
* 设置需要打字的文字及打字间隔
*
* @param str 打字文字
* @param time 打字间隔(ms)
*/
public void setPrintText(String str, int time)
setPrintText(str, time, DEFAULT_INTERVAL_CHAR);
/**
* 设置需要打字的文字,打字间隔,间隔符号
*
* @param str 打字文字
* @param time 打字间隔(ms)
* @param intervalChar 间隔符号("_")
*/
public void setPrintText(String str, int time, String intervalChar)
if (strIsEmpty(str) || 0 == time || strIsEmpty(intervalChar))
return;
this.mPrintStr = str;
this.intervalTime = time;
this.intervalChar = intervalChar;
/**
* 开始打字
*/
public void startPrint()
// 判空处理
if (strIsEmpty(mPrintStr))
if (!strIsEmpty(getText().toString()))
this.mPrintStr = getText().toString();
else
return;
// 重置相关信息
setText("");
stopPrint();
printProgress = 0;
mTimer = new Timer();
mTimer.schedule(new PrinterTimeTask(), intervalTime, intervalTime);
/**
* 停止打字
*/
public void stopPrint()
if (null != mTimer)
mTimer.cancel();
mTimer = null;
/**
* 判断str是否为空
*
* @param str
* @return
*/
private boolean strIsEmpty(String str)
if (null != str && !"".equals(str))
return false;
else
return true;
/**
* 打字计时器任务
*/
class PrinterTimeTask extends TimerTask
@Override
public void run()
// 需要刷新页面,必须在UI线程,使用post方法
post(new Runnable()
@Override
public void run()
// 如果未显示完,继续显示
if (printProgress < mPrintStr.length())
printProgress++;
// (printProgress & 1) == 1 等价于printProgress%2!=0
setText(mPrintStr.substring(0, printProgress) + ((printProgress & 1) == 1 ? intervalChar : ""));
else
// 如果完成打字,显示完整文字
setText(mPrintStr);
stopPrint();
);
注释比较全,也比较简单,需要注意的就几点,首先需要注意的是在PrinterTimeTask中,在线程中执行操作时,要使用post方法,因为不能在子线程中直接更新UI,post方法用来处理这种需求(不了解的童鞋,可以看一下View的post方法,这里就不详细写了),然后在处理每次的显示的时候,为了更加像打字机的效果,在显示时做了一些处理,这里做的处理是当前显示的文字是奇数位时则在后边加上一个符号” _ “,当然也可以自己去设置,是偶数位时则不去处理.这样看起来就比较形象了.相关代码((printProgress & 1) == 1 ? intervalChar : “”)这里用了位运算,是因为效率应该会高一些,当然也可以用printProgress%2!=0来判断当前位置是奇数位还是偶数位,效果是一样的.
三、完整代码
MainActivity:
package com.example.junweiliu.printertextview;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
public class MainActivity extends AppCompatActivity
/**
* 打印view
*/
private PrinterTextView mPrinterTextView;
@Override
protected void onCreate(Bundle savedInstanceState)
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
mPrinterTextView = (PrinterTextView) findViewById(R.id.pt_my);
/**
* 开始打印
*
* @param view
*/
public void startPrint(View view)
mPrinterTextView.setPrintText("草原上有对狮子母子。小狮子问母狮子:“妈,幸福在哪里?”母狮子说:“幸福就在你的尾巴上。”\\n" +
" 于是小狮子不断追着尾巴跑,但始终咬不到。母狮子笑道:“傻瓜!幸福不是这样得到的!只要你昂首向前走,幸福就会一直跟随着你!”。", 100, "|");
mPrinterTextView.startPrint();
布局文件activity_main:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context="com.example.junweiliu.printertextview.MainActivity">
<!--android:text="某日,女秘书神色凝重地说:王总,我怀孕了。 王继续低头看文件,然后淡淡一笑:我早结扎了。 女秘书楞了一会媚笑道:我和您开玩笑呢! 王抬起头看了她一眼,喝了口茶说:我也是。"-->
<com.example.junweiliu.printertextview.PrinterTextView
android:id="@+id/pt_my"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textColor="#999999"
android:textSize="15sp"
/>
<Button
android:id="@+id/btn_start"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:layout_marginTop="16dp"
android:onClick="startPrint"
android:text="开始"
/>
</RelativeLayout>
源码地址
以上是关于Android仿打字机打字效果的主要内容,如果未能解决你的问题,请参考以下文章