Egret 纹理、计时器
1. 九宫切
典型例子就是圆角矩形的拉伸问题。
先去P一张绿色的圆角矩形。
private createGameScene():void {
var box:egret.Bitmap = new egret.Bitmap();
box.texture = RES.getRes("box_png");
//拉伸
box.width *= 2; //矢量绘图是 Shape/Sprite 的 graphics 有的功能,才有自身的 width/height 与 所绘图形的 width/height
this.addChild(box); var box9:egret.Bitmap = new egret.Bitmap(RES.getRes("box_png"));
var rect9:egret.Rectangle = new egret.Rectangle(40, 40, 80, 80);
box9.scale9Grid = rect9;
box9.width *= 2;
box9.y = 200;
this.addChild(box9);
}
看下两者的区别:
2. 纹理集
- 不用每次为一张图片执行一次HTTP请求;
- 引擎渲染时减少IO的次数;
主要是在配置与资源调用上进行微调即可:
- 合图并生成 json 配置文件;
- 资源类型为 sheet: {"name":"dogs","type":"sheet","url":"assets/dogs.json"}
- 调用时:RES.getRes( "dogs.dog1" )
3. Timer
class myTimer extends egret.DisplayObjectContainer
{
public constructor()
{
super();
var timer:egret.Timer = new egret.Timer(500, 5); //500ms执行1次,一共执行5次
timer.addEventListener(egret.TimerEvent.TIMER, ()=>{
myTimer.count ++;
console.log("count:" + myTimer.count);
}, this);
timer.addEventListener(egret.TimerEvent.TIMER_COMPLETE, ()=>{ console.log("end")}, this);
timer.start();
} public static count:number = 0;
}
4. Tick:
private createGameScene():void {
var heroTicks = new startTickerTest(); //要添加到舞台才会触发 egret.Event.ADDED_TO_STAGE 事件,但 Main 这个容器是由 egret 自己添加到舞台的,看不到 addChild
this.addChild(heroTicks);
}
class startTickerTest extends egret.DisplayObjectContainer {
public constructor() {
super(); //容器被添加到舞台显示列表时调用
this.once(egret.Event.ADDED_TO_STAGE, this.onLoad, this);
} private hero:egret.Bitmap;
private speed:number = 0.05;
private time:number = 0; private onLoad(event:egret.Event) {
var hero:egret.Bitmap = new egret.Bitmap(RES.getRes("hero1_png"));
this.addChild(hero);
this.hero = hero;
this.time = egret.getTimer();
//不与帧率挂钩的每秒60次回调
egret.startTick(this.moveStar, this);
} //egret 在执行 startTick 的回调时,会给予参数 timeStamp(当前时间戳)
private moveStar(timeStamp:number):boolean {
var now = timeStamp;
var time = this.time;
var pass = now - time; //平均时间间隔=1000ms/60=16.67ms
console.log("moveStar: ",(1000 / pass).toFixed(5));
this.hero.x += this.speed * pass;
if(this.hero.x >= 300)
egret.stopTick(this.moveStar, this);
this.time = now;
return false;
}
}
5. 帧事件:
private createGameScene():void {
var heroTicks = new startTickerTest();
this.addChild(heroTicks);
}
class startTickerTest extends egret.DisplayObjectContainer {
public constructor() {
super();
this.once(egret.Event.ADDED_TO_STAGE,this.onLoad,this);
} private hero:egret.Bitmap;
private timeOnEnterFrame:number = 0;
private speed:number = 0.5; private onLoad(event:egret.Event) {
var hero:egret.Bitmap = new egret.Bitmap(RES.getRes("hero1_png"));
this.addChild(hero);
this.hero = hero;
//监听帧事件
this.addEventListener(egret.Event.ENTER_FRAME,this.onEnterFrame,this);
this.timeOnEnterFrame = egret.getTimer();
} private onEnterFrame(e:egret.Event){
var now = egret.getTimer();
var time = this.timeOnEnterFrame;
var pass = now - time;
console.log("onEnterFrame: ", (1000 / pass).toFixed(5));
this.hero.x += this.speed * pass;
if(this.hero.x > 300)
this.removeEventListener(egret.Event.ENTER_FRAME,this.onEnterFrame,this);
this.timeOnEnterFrame = egret.getTimer();
}
}
基础构成看的差不多了,剩下的知识在实际项目应用中边学边用了!
Egret 纹理、计时器的更多相关文章
- egret -纹理集的制作
1. 理集的使用 :http://www.codeandweb.com/ 下载软件: TexturePackergithub: 相关工具:https://github.com/ping-chen/eg ...
- Egret自定义计时器(TimerManager和Laya.timer)
一 自定义计时器 因为游戏中经常用到计时器,比如每1秒发射一枚子弹啊,每2秒怪物AI自动转向啊 每次去new Timer 然后addEventListener(egret.TimerEvent... ...
- Egret 位图,纹理,添加背景 学习
1,重新设置舞台大小,可以直接到VS中的 "解决方案"中,找到 launcher->egret_loader.js中,找到setDesignSize方法,修改其中大小即可:有 ...
- egret之纹理填充模式(上下填充)
首先,我们准备两张图片,一张作为背景“瓶子”,一张作位填充物“饮料”. 在皮肤里我们设置右边图片的填充模式为“repeat”,修改Y的缩放为:-1.,调整图片位置使之与地图重合,如下: 现在,我们可以 ...
- Egret引擎随学随机
1.纹理集实际上就是将一些零碎的小图放到一张大图当中.游戏中也经常使用到纹理集.使用纹理集的好处很多,我们通过将大量的图片拼合为一张图片从而减少网络请求,原先加载数次的图片资源现在加载一次即可.同时, ...
- Egret初体验–躲避类小游戏
下面简单介绍一下我这个游戏:基本上就3个画面(准备再添加一个胜利的界面)开始画面,一个按钮,点击进入游戏游戏画面,滚动的背景,触摸移动的老鹰,从天而降的翔,以及右上角的时间条结束画面,显示结果,关注按 ...
- Egret官方案例学习笔记
1.资源记载方式 (1)Egret引擎是2.0.5. (2)resource/resource.json文件是: { "resources": [ { "name&quo ...
- [Egret]长按图片分享、分享图片、本地存储
egret 分享有API可以把一个显示对象树渲染成一个位图纹理,我把它赋值给 HTML 的 Image 元素,就实现了图片的显示,在微信中,通过长按图片可以分享出去.当然在其他浏览器可以保存在本地. ...
- Egret中使用P2物理引擎
游戏中的对象按照物理规律移动,体现重力.引力.反作用力.加速度等物体特性,实现自由落体.摇摆运动.抛物线运动,以及物理碰撞现象的模拟.用于模拟物理碰撞.物理运动的引擎称为物理引擎. 来自瑞典斯德哥尔摩 ...
随机推荐
- linux —— 启动引导程序 lilo 与 grub
目录:1.启动引导程序概要 2.lilo 的安装与配置 3.grub的安装与配置 4.两种引导程序的切换 5.附:编译内核时的lilo 设置 1.启动引导程序概要 2.lilo 的安装与配置 3.g ...
- Java 23种设计模式详尽分析与实例解析之一--创建型模式
面向对象的设计原则 常用的面向对象设计原则包括7个,这些原则并不是独立存在的,它们相互依赖.互为补充. Java设计模式 创建型模式 简单工厂模式 模式动机: 考虑一个简单的软件应用场景,一个软件系统 ...
- 使用Topshelf创建Windows 服务
本文转载: http://www.cnblogs.com/aierong/archive/2012/05/28/2521409.html http://www.cnblogs.com/jys509/p ...
- cocos2d-x创建的九宫图变白块
用UIImageView 创建的九宫图变白,直接用CCScale9Sprite创建的也是变白,找了半天原来是自己为了调整UI方便,开启了CCSprite边缘画线导致的,在ccConfig.h下 宏CC ...
- Mean Shift具体介绍
Mean Shift,我们 翻译为“均值飘移”.其在聚类,图像平滑.图像切割和跟踪方面得到了比較广泛的应用.因为本人眼下研究跟踪方面的东西,故此主要介绍利用Mean Shift方法进行目标跟踪,从而对 ...
- 在LaTeX里插入全页的pdf 分类: LaTex 2015-02-04 17:20 142人阅读 评论(0) 收藏
要帮女友排版毕业论文,需要插入封面,省时省力的方法就是把学校给的Word封面保存成PDF然后插入到Latex文档中. 首先添加下面的宏: \usepackage[final]{pdfpages} 然后 ...
- 微软ASP.NET网站部署指南(10):迁移至SQL Server
1. 综述 第2章的部署SQL Server Compact和第9章的部署数据库更新里解释了为什么终于要升级到完整版SQL Server .本章节将告诉你怎样来做. SQL Server Expre ...
- photoshopcs5 win7安装报错的解决
因为之前安装了绿色中文破解版的PhotoShop CS5,虽然卸载了,但是注册表还可能残留了其它信息,导致在安装Adobe PhotoShop CS5英文版时一直显示 (Exit Code: 7 ER ...
- [转] Linux抓包工具tcpdump详解
http://www.ha97.com/4550.html PS:tcpdump是一个用于截取网络分组,并输出分组内容的工具,简单说就是数据包抓包工具.tcpdump凭借强大的功能和灵活的截取策略,使 ...
- FastDFS安装配置手册
文件服务器分布式系统安装手册 本文档详细的介绍了FastDFS的最小集群安装过程.集群环境如下: tracker:20.2.64.133 .用于调度工作,在访问上起负载均衡的作用. group1: s ...