html5隐藏自定义控制按钮,用仿ActionScript的语法来编写html5——第七篇,自定义按钮...
第七篇,自定义按钮
这次弄个简单点的,自定义按钮。
其实,有了前面所定义的LSprite,LBitmap等类,定义按钮就很方便了。
下面是添加按钮的代码,
function gameInit(event){
backLayer = new LSprite();
addChild(backLayer);
btn01 = new LButton(new LBitmap(new LBitmapData(imglist["replay_button_up"])),new LBitmap(new LBitmapData(imglist["replay_button_over"])));
btn01.x = 76;
btn01.y = 50;
backLayer.addChild(btn01);
btn02 = new LButton(new LBitmap(new LBitmapData(imglist["quit_button_up"])),new LBitmap(new LBitmapData(imglist["quit_button_over"])));
btn02.x = 76;
btn02.y = 100;
backLayer.addChild(btn02);
btn01.addEventListener(LMouseEvent.MOUSE_DOWN, onmousedown01);
btn02.addEventListener(LMouseEvent.MOUSE_DOWN, onmousedown02);
}
function onmousedown01(event){
alert("btn01 on click");
}
function onmousedown02(event){
alert("btn02 on click");
}
原理:建立一个继承自LSprite的LButton类,给按钮设定两个图片,然后侦听鼠标位置,当鼠标移动到按钮上的时候,变换按钮状态,就是一个简单的按钮。
这里,我用mousemove来侦听鼠标位置,给LGlobal类添加一个buttonList数组,当创建按钮的时候,把按钮加入到buttonList,然后当移动鼠标的时候,就可以从buttonList数组判断鼠标是否在按钮上,然后当按钮被删除后,将按钮从buttonList数组中删除。
一些修改:
1,修改LSprite类,添加die方法,每个LSprite当被removeChild的时候,调用自己的die方法,die方法里放一些被移除是必需处理的事件,比如这次的按钮,要从buttonList中删除。
2,给每个构造器添加objectindex,用来区分每个对象。
3,修改addChild方法,添加DisplayObject.parent = self,就是给每个自对象指定父级对象。
准备完毕,开始创建按钮类LButton。
function LButton(bitmap_up,bitmap_over){
base(this,LSprite,[]);
var self = this;
self.type = "LButton";
self.bitmap_up = bitmap_up;
self.addChild(bitmap_up);
if(bitmap_over == null){
bitmap_over = bitmap_up;
}else{
self.addChild(bitmap_over);
}
self.bitmap_over = bitmap_over;
self.bitmap_over.visible = false;
self.bitmap_up.visible = true;
LGlobal.buttonList.push(self);
}
LButton.prototype.buttonModeChange = function (){
var self = this;
var cood={x:0,y:0};
var parent = self.parent;
while(parent != "root"){
cood.x += parent.x;
cood.y += parent.y;
parent = parent.parent;
}
if(self.ismouseon(LGlobal.mouseMoveEvent,cood)){
self.bitmap_up.visible = false;
self.bitmap_over.visible = true;
}else{
self.bitmap_over.visible = false;
self.bitmap_up.visible = true;
}
}
LButton.prototype.die = function (){
var self = this;
arguments.callee.super.die.call(this);
for(var i=0;i
if(LGlobal.buttonList[i].objectindex == self.objectindex){
LGlobal.buttonList.splice(i,1);
break;
}
}
}
看一下成果吧,看不到效果的请下载支持html5的浏览器
html5隐藏自定义控制按钮,用仿ActionScript的语法来编写html5——第七篇,自定义按钮...相关推荐
- 用仿ActionScript的语法来编写html5——终篇,LegendForHtml5Programming1.0开源库件
一,LegendForHtml5Programming1.0库件是什么? 它是一个javascript库,它模仿了ActionScript的语法,用于html5的开发,目前实现的功能相对较少,还不能称 ...
- 用仿ActionScript的语法来编写html5——第六篇,TextField与输入框
用仿ActionScript的语法来编写html5--第六篇,TextField与输入框 一,对比 1,html5中 首先看看在html5的canvas中的文字显示 var canvas = docu ...
- html游戏让目标人物移动,用仿ActionScript的语法来编写html5——第三篇,鼠标事件与游戏人物移动...
第三篇,鼠标事件与游戏人物移动 一,假设 假设,所有可添加鼠标事件的对象,都有一个mouseEvent方法,添加的鼠标事件同过这个mouseEvent来调用. 这样的话,添加鼠标事件,其实只需要给ca ...
- 用仿ActionScript的语法来编写html5——第五篇,Graphics绘图
用仿ActionScript的语法来编写html5--第五篇,Graphics绘图 用仿ActionScript的语法来编写html5--第一篇,显示一张图片 http://blog.csdn.net ...
- 用仿ActionScript的语法来编写html5——第七篇,自定义按钮
第七篇,自定义按钮 这次弄个简单点的,自定义按钮. 其实,有了前面所定义的LSprite,LBitmap等类,定义按钮就很方便了. 下面是添加按钮的代码, function gameInit(even ...
- 用仿ActionScript的语法来编写html5——第三篇,鼠标事件与游戏人物移动
第三篇,鼠标事件与游戏人物移动 一,假设 假设,所有可添加鼠标事件的对象,都有一个mouseEvent方法,添加的鼠标事件同过这个mouseEvent来调用. 这样的话,添加鼠标事件,其实只需要给ca ...
- 用仿ActionScript的语法来编写html5——第二篇,利用Sprite来实现动画
上一篇,我已经模仿as,加入了LBitmap和LBitmapData类,并且用它们实现了静态图片的显示. 这次用Sprite来动态显示图片. 依然遵循上一篇对显示对象的处理的思路,添加LSprite类 ...
- h5隐藏video控制按钮controls(腾讯云点播禁用video音量全屏等按钮)
前言 昨天app的同事(ios跟安卓)发现webview的video全屏按钮有问题,他们想禁用掉全屏.音量控制的按钮,前端同事在根据api设置disable_full_screen=1(pc端fals ...
- html5语法参考图片,仿AS语法来写HTML5—第1章,显示一张图片
最近开始学习html5,因为一直都是研究as,所以还是觉得as顺眼一点,但是html5也不能不学,于是就想出了,可以把html5用as的语法来写出来,做游戏应该来的比较顺手一些,下面开始第一篇 第一篇 ...
- html5 video js控制摄像头的焦距,video.js自定义控制按钮
video.js自定义控制按钮 // 视频播放 if (!this.player) { let that = this this.player = videojs("#videoPlayer ...
最新文章
- SearchHit转成java对象_Java开发中最常犯的10个错误,你中招了吗?
- php tinyme_黄聪:TinyMCE 4 增强 添加样式、按钮、字体、下拉菜单和弹出式窗口
- 13-19 Python Number、Python字符串、Python列表(List)、集合的基本操作、元组、字典Dicttionnary、日期和时间
- asp中正则表达式应用
- 帝国CMS附件大小限制
- 四条命令搞定mysql主从
- php引用()详解及注意事项
- 谷歌地球-覆盖全球任何一个角落的地图软件
- cad怎么查找未闭合_CAD有个工具(命令)是清除没有闭合的图形是哪个
- Eclipse配置android开发环境详解
- 申请微信公众号平台流程
- java+mysql+javaweb网上购物系统
- backurl: heytapbrowser://main/iflow?sub_target=only_enter_iflow
- Snowflake vs. Databricks谁更胜一筹?2022年最新战报
- ROS+UR机械臂+Moveit+ 仿真与实体机械臂的使用+realsense相机+eye_handeye手眼标定(亲测有效)下
- java版本实现推箱子小游戏
- 知道一点怎么设直线方程_如何快速求一个点有关一条直线的对称点的坐标?
- 网页版羊了个羊 Vue3 实现
- (一)xxx项目需求分析与功能设计概要
- Linux内核 实践二