近期发现一个HTML开源游戏引擎,感觉还不错http://lufylegend.com/

可是没有基础的同学。看起来费劲。所以打算边学边记笔记,说明都在凝视中

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>帧速率</title>
<script src="js/lufylegend-1.9.7.js"></script>
<script>
//LInit初始化画布,第一个參数为帧速率,除数越大动画速率越快。能够自己改动试试
//随后的參数:divid,宽。高。回调函数
LInit(1000/20, "legend", 800, 480, main);
var direction = 1;
function main () {
//新建层
var layer = new LSprite();
//加入层
addChild(layer);
//在层上绘制一个矩形
//LGraphics 类包括一组可用来创建矢量形状的方法。
//drawRect 五个參数:线粗,线颜色。坐标及宽度,是否填充。填充颜色
layer.graphics.drawRect(1, "#ff0000", [0, 0, 100, 100], true, "#880088");
//layer上绑定ENTER_FRAME事件,以帧速率调用onframe函数
layer.addEventListener(LEvent.ENTER_FRAME,onframe);
}
function onframe(event){
var layer = event.currentTarget;
//每一帧,横坐标增长/降低==向右/向左移动一像素,方向取决于direction的正负
layer.x += direction;
//不停右移
if(layer.x < 0){
direction = 1;
}
//坐标大于700后,向左移
if(layer.x > 700){
direction = -1;
}
}
</script>
</head>
<body>
<div id="legend"></div>
</body>
</html>
 

效果:







移动到右端后,会反向移动

注:案例来自官网,我仅仅是加些凝视

lufylegend练习(1)帧速率的更多相关文章

  1. lufylegend:图形变形3

    面来看看drawtriangles函数的扩展.利用drawtriangles函数来实现一个旋转的3D地球,效果如下 因为lufylegend1.5.0版的drawtriangles函数有个bug,所以 ...

  2. lufylegend游戏引擎

    lufylegend游戏引擎介绍:click 这个链接我觉得已经很详细的介绍了这个引擎. 所以以下我只说说一些简单的游戏代码过程. 首先从canvas做游戏叙述起: 这是一个让人很熟悉的简单小游戏,网 ...

  3. H5canvas赛车游戏-基于lufylegend引擎

    lufylegend引擎是canvas游戏中,比较简单的引擎之一,它不需要配置环境,类似引入jquery包的方式,引用对应js文件即可 lufylegend官方网站:http://www.lufyle ...

  4. 在Lufylegend中如何设置bitmap或者sprite的缩放和旋转中心

    最近两天有个lufylegend游戏引擎群的群友需要做一个项目,其中要解决的需求是:获取照相机拍摄的图片,根据图片的EXIF信息让图片显示为“正常”情况,并且需要给图片添加一些事件侦听.何为正常呢?就 ...

  5. 利用开源HTML5引擎lufylegend.js结合javascript实现的五子棋人机对弈

    前言     本文主要介绍利用开源引擎 lufylegend.js开发基于Html5的游戏--五子棋,主要叙述其详细开发过程. 游戏规则 玩过五子棋的都应该知道五子棋的规则,这里就简单介绍其规则. 1 ...

  6. html5游戏开发框架之lufylegend开源库件学习记录

    下载地址http://lufylegend.com/lufylegend 引用 <script type="text/javascript" src="../luf ...

  7. lufylegend库 LButton

    lufylegend库 LButton <!DOCTYPE html> <html lang="en"> <head> <meta cha ...

  8. lufylegend库 鼠标事件 循环事件 键盘事件

    lufylegend库 鼠标事件 循环事件 键盘事件 <!DOCTYPE html> <html lang="en"> <head> <m ...

  9. lufylegend库 LTextField

    lufylegend库 LTextField <!DOCTYPE html> <html lang="en"> <head> <meta ...

随机推荐

  1. vs2015添加T4模版

    <#@ template language="C#" debug="false" hostspecific="true"#> & ...

  2. 通过PING命令中的TTL来判断对方操作系统

    ---恢复内容开始--- 通过PING命令中的TTL来判断对方操作系统简单来说,TTL全程Time to Live,意思就是生存周期.首先要说明ping命令是使用的网络层协议ICMP,所以TTL指的是 ...

  3. 最近ssh遇到异常及解决

    1.SSH框架,spring和struts整合,action中注入service不成功,检测是否缺少 struts2-spring-plugin-2.3.4.1.jar包 2.字符串转 json 加了 ...

  4. ANDROID基础ACTIVITY篇之Activity的生命周期(一)

    首先我们先来看一下官方的Android的生命周期图: 根据这个流程图我们可以看到Activity的生命周期一共有7个方法,那么接下来我们就来聊聊这些方法执行过程. 首先在两个Activity(Main ...

  5. [转]查询 SQL Server 系统目录常见问题

    查询 SQL Server 系统目录常见问题 http://msdn.microsoft.com/zh-cn/library/ms345522.aspx#_FAQ4 下列部分按类别列出常见问题. 数据 ...

  6. 《Metasploit魔鬼训练营》第三章

    p85 使用nmap探测目标主机的操作系统版本那里有问题,我探测不了NAT服务器的! msf > nmap -sT 10.10.10.254 [*] exec: nmap -sT 10.10.1 ...

  7. 实现基于tomcat集群会话保持

    1.实验环境 我们需要准备两台虚拟机,把这两台虚拟机组成集群,实现会话保持. 2.配置server1 2.1 修改nginx配置文件 [root@server1 ~]# vim /etc/nginx/ ...

  8. Unbuntu16.04安装搜狗拼音输入法

    为了让自己的电脑相对安全一些,我安装了ubuntu的物理机 因为要经常输入汉字,我就在unbuntu里面安装了搜狗输入法 1.在搜狗输入法官网下载Linux版本的安装包:http://pinyin.s ...

  9. dSYM文件分析

    什么是 dSYM 文件 Xcode编译项目后,我们会看到一个同名的 dSYM 文件,dSYM 是保存 16 进制函数地址映射信息的中转文件,我们调试的 symbols 都会包含在这个文件中,并且每次编 ...

  10. windows配置caffe + python和matlab接口

    参考: http://blog.csdn.net/baidu_26408419/article/details/53711640 http://www.cnblogs.com/love6tao/p/5 ...