近期发现一个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. Problem J: 求个最大值

    Problem J: 求个最大值 Time Limit: 1 Sec  Memory Limit: 128 MBSubmit: 871  Solved: 663[Submit][Status][Web ...

  2. spring+struts2+hibernate整合

    web.xml需要配置 <context-param> <param-name>contextConfigLocation</param-name> <par ...

  3. C#获得时间段

    DateTime today = dt.Date;//今天 00:00:00 DateTime tomorrow = dt.Date.AddDays(1);//明天 00:00:00 DateTime ...

  4. js中的break,continue和return到底怎么用？

    为什么要说个?好像很简单,但是我也会迷糊,不懂有时候为什么要用return,然而break和continue也经常和他放在一起. 所以就一起来说一说,这三个看起来很简单,却常常会出错的关键词的具体用法 ...

  5. 【小技巧解决大问题】使用 frp 突破阿里云主机无弹性公网 IP 不能用作 Web 服务器的限制

    背景 今年 8 月份左右,打折价买了一个阿里云主机,比平常便宜了 2000 多块.买了之后,本想作为一个博客网站的,毕竟国内的服务器访问肯定快一些.满心欢喜的下单之后,却发现 http 服务,外网怎么 ...

  6. (三):C++分布式实时应用框架——系统管理模块

    C++分布式实时应用框架--系统管理模块 上篇:(二): 基于ZeroMQ的实时通讯平台 一个分布式实时系统集群动辄上百台机器,集群的规模已经限定这将是一个"封闭"的系统.你不可能 ...

  7. platform 收集linux/windows操作系统信息

    调用python的platform模块 #!/usr/bin/evn python #_*_ coding:utf-8 -*- import platform print "######## ...

  8. Shodan在渗透测试及漏洞挖掘中的一些用法

    渗透测试中,第一阶段就是信息搜集,这一阶段完成的如何决定了你之后的进行是否顺利,是否更容易.而关于信息收集的文章网上也是有太多.今天我们来通过一些例子来讲解如何正确使用Shodan这一利器. 想要利用 ...

  9. unity插件开发

    1.简单的svn集成: 查询svn的文档可以知道svn提供各种命令符操作.因此,原理非常简单,利用命令符操作调用svn即可.代码也非常简单: 更新:Process.Start("Tortoi ...

  10. NETStandard,NETFx,Mono,NETCore,ASPNetCore 之间关系的整理

    因为现在很多人对这几者之间的关系还不甚了解,这里根据我所知来做一个大概的介绍...... .NET Standard:         .NET标准,只要符合这个标准实现类库,即可在支持此标准的Run ...