textarea实现datalist效果_FLASH中使用TextArea组件模拟聊天框

47b48ee0eb5fa01ed1fd93b4707144ea.png

在FLASH制作网页游戏中,聊天框是比较常见的,特别是聊天框会自动显示到最后一行内容的效果,这里讲如何通过代码实现类似聊天框的自动滚动到最下面文本的功能。主要知识点:滚动条的控制

FLASH组件使用之TextArea组件​jingyan.baidu.com

适用软件:Animate CC软件及其它支持TextArea的FLASH软件

制作方法:
1.打开软件,新建AS3文档。

d34e4cf832633bcbbd4b1e2947d574c0.png

2.Ctrl+f7打开组件面板,并找到TextArea组件放到舞台上。

29d30457abbdf3f1ce74ebaa04a0d64d.png

3.设置组件实例名为txt_area

d46f5db6b17601a313bf176a808faacf.png

4.继续从组件库里拖动一个按钮组件放到舞台上。

52db36e29b9ac239ee17c399969521ee.png

5.设置按钮组件的实例名为btn_send,设置参数Label为发送

a3c4f4b388d794855d6835c92618db25.png

5a7245a5484523498b32f9c24b9691ae.png

6.最后放一个输入文本,实例名为input_txt,其它设置如图所示:

1b39bbe65dd27f3e129563f43306be9a.png

b21ad1dcdf3b831b3a10f8ab3d09147d.png

7.在舞台主时间轴加如下代码:

btn_send.addEventListener(MouseEvent.CLICK, SendMessage);
input_txt.text = "";
function SendMessage(e: MouseEvent): void {
if (input_txt.text != "") {
var date: Date = new Date();
txt_area.appendText(GetTime()+"n"+input_txt.text+"n");
txt_area.verticalScrollPosition=txt_area.maxVerticalScrollPosition;//将组件的滚动条移动到最下面
input_txt.text = "";
}
}
function GetTime(): String {
var date: Date = new Date();
var hour: int = date.getHours(); //获取当前系统时间小时数
var minute: int = date.getMinutes(); //获取当前系统时间分钟数
var second: int = date.getSeconds(); //获取当前系统时间秒数
var str: String = "";
if (hour < 10) //如数字小于10,则在前面加0,统一格式
{
str = "0" + hour + " : ";
} else {
str = String(hour) + " : ";
}
if (minute < 10) //如数字小于10,则在前面加0,统一格式
{
str += "0" + minute + " : ";
} else {
str += String(minute) + " : ";
}
if (second < 10) //如数字小于10,则在前面加0,统一格式
{
str += "0" + second;
} else {
str += String(second);
}
return str; //将生成的字符串放到动态文本中
}
FLASHCS6如何制作实时更新的电子表(AS3)​jingyan.baidu.com

38b0fa12de65d3cfe8d1a441e523ecc4.png

8.运行后如图所示,当滚动条出现以后,会自动滚动到最下面。

116f963b4bb84687bad5aca1c27da71b.png
如果有相关的FLASH或者Animate操作及代码方面的问题可以私信或留言,尽力解答!
如果感觉我们的文章很有用,记得分享给朋友或同学,让更多人方便的学习到实用的Flash知识。
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值