Flash 交互打字效果(1)

0o傻猪闹闹o0

0o傻猪闹闹o0

2016-01-29 13:39

Flash 交互打字效果(1),Flash 交互打字效果(1)
 编者:虽然有人也许会说,这样的打字效果在Swish中可以很方便地实现……但是大家用Flash制作会有更多不同的体验,提醒大家注意:这里的初识文字是写在代码里面的,同时它还可以接受用户动态输入,完成交互显示。

  我们常常看见下面演示的打字效果:字符一个个地跳上屏幕,后面还跟着一个闪动的光标,很有意思。很多朋友觉得用swish制作FLASH新手对这个效果的制作还不甚清楚,现在我就将下面这个打字效果的制作过程提供给大家,希望对大家有所帮助。

  实现原理

  在这个影片中,我们用一个string对象来保存要显示的全部字符,然后在元件“screen”第一帧中,调用string对象的substring函数来取得从第一个字符到第index个字符,然后将其赋值给“textarea”对象显示出来(后面加上一个字符'_'是用来充当输入光标的)。index加1,即下次多显示一个字符,这样看起来字符就是一个个增加上去的。当index值等于需显示字符的总长度时影片停止播放,“打字”结束。然后通过生成一个随机整数随机跳转至后9帧中的任一帧,再让影片自己播放至最后一帧,最后一帧再跳转至第一帧进行下一轮的显示,这样实现了输入效果时间延迟上的随机性。关于影片中使用到的函数的具体用法,请参看FLASH的帮助文件。

  首先来处理这个效果中最重要的部分:字符的显示。

  1.新建一个影片元件“screen”。点选“文字”工具,在“属性”栏中将其改成“动态文本”(如下图),然后在影片中拉出一个大小合适的矩形区域。

(本文来源于图老师网站,更多请访问http://m.tulaoshi.com/fjc/)

  2.点选刚刚拉出的文本区域,将其“instance”值改为“textarea”。然后调整其字体,颜色等参数至适当值。特别注意将文本区域的“行类型”改成“多行”。(参考下图)



(本文来源于图老师网站,更多请访问http://m.tulaoshi.com/fjc/)

  3.点击第一帧,在“帧动作”中加入以下代码:

  textarea.text=textshow.substring(0,index)+"_";
  index++;
  if(indextextshow.length)
    stop();
  gotoAndPlay(Math.ceil(Math.random()*5)+5);

  4.在第10帧新建一个关键帧,点击第10帧,加入以下代码:
  gotoAndPlay(1);

  5.新建一个层“back”,在里面拉出一个跟文本框大小差不多的黑色矩形,作为文本框的背景。点击本层的第10帧,按F5键,将本层时长延长至第10帧。

  6.新建一个层“sound”,点击“文件”-》“导入”,导入一个打字的声音文件。然后将其拖放到这一层的第一帧并适当延长本层时长。

  好了,文字的显示部分基本完成,对代码部分不清楚的朋友请再仔细阅读本文开始的实现原理,下面继续。


展开更多 50%)
分享

猜你喜欢

Flash 交互打字效果(1)

flash教程
Flash 交互打字效果(1)

Flash 交互打字效果(2)

flash教程
Flash 交互打字效果(2)

s8lol主宰符文怎么配

英雄联盟 网络游戏
s8lol主宰符文怎么配

Flash简单制作打字效果

flash教程
Flash简单制作打字效果

实用Flash应用程序—打字练习 (1)

FLASH flash教程
实用Flash应用程序—打字练习 (1)

lol偷钱流符文搭配推荐

英雄联盟 网络游戏
lol偷钱流符文搭配推荐

实用Flash应用程序—打字练习(1)

flash教程
实用Flash应用程序—打字练习(1)

实用Flash应用程序—打字练习(2) (1)

FLASH flash教程
实用Flash应用程序—打字练习(2) (1)

lolAD刺客新符文搭配推荐

英雄联盟
lolAD刺客新符文搭配推荐

《战场女武神2》攻守、武器多杀等详细攻略

《战场女武神2》攻守、武器多杀等详细攻略

地址的加密实现方法

地址的加密实现方法
下拉加载更多内容 ↓