精华内容
下载资源
问答
  • lufylegend文件+帮助文档
  • lufylegend_api

    2016-04-02 19:31:09
    lufylegend框架,用于网页游戏开发
  • lufylegend-1.6.1

    2013-03-02 11:55:00
    lufylegend是一个HTML5开源引擎,它实现了利用仿ActionScript3.0的语法进行HTML5... 利用lufylegend可以轻松的使用面向对象编程,并且可以配合Box2dWeb制作物理游戏, 另外它还内置了LTweenLite缓动类等非常实用的功能!
  • lufylegend是一个HTML5开源... 利用lufylegend可以轻松的使用面向对象编程,并且可以配合Box2dWeb制作物理游戏, 另外它还内置了LTweenLite缓动类等非常实用的功能, 现在开始使用它吧,它可以让你更快的进入HTML5的世
  • lufylegend-1.8.8

    2014-04-07 23:26:47
    ufylegend是一个HTML5开源...利用lufylegend可以轻松的使用面向对象编程,并且可以配合Box2dWeb制作物理游戏, 另外它还内置了LTweenLite缓动类等非常实用的功能,现在开始使用它吧,它可以让你更快的进入HTML5的世界!
  • 摘要:脚本资源,HTML,lufylegend Explain lufylegend是一个HTML5开源引擎,利用它可以快速方便的进行HTML5的开发,本源码是lufylegend引擎的应用实例,控制网页上元素DIV的移动,实现步骤:加入层,开始移动、加入...
  • lufylegend库 LGraphics

    2015-07-27 11:17:00
    lufylegend库 LGraphics <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>lufylegend</title> <script type="text/javascri...

    lufylegend库 LGraphics 

    <!DOCTYPE html>
    <html lang="en">
    
    <head>
        <meta charset="UTF-8">
        <title>lufylegend</title>
        <script type="text/javascript" src="lufylegend-1.7.6.js"></script>
    </head>
    
    <body>
        <div id="mylegend">loading...</div>
        <script type="text/javascript">
        init(50, 'mylegend', 500, 350, main);
    
        function main() {
            var graphics = new LGraphics();
            addChild(graphics);
            graphics.drawRect(1, '#000000', [50, 50, 100, 100]);
            graphics.drawRect(1, '#000000', [170, 50, 100, 100], true, '#cccccc');
            graphics.drawArc(1, '#000000', [60, 230, 50, 0, 2 * Math.PI]);
            graphics.drawArc(1, '#000000', [180, 230, 50, 0, 2 * Math.PI], true, '#cccccc');
            graphics.drawVertices(1, '#000000', [
                [50, 20],
                [80, 20],
                [100, 50],
                [80, 80],
                [50, 80],
                [30, 50]
            ]);
            graphics.drawVertices(1, '#000000', [
                [150, 20],
                [180, 20],
                [200, 50],
                [180, 80],
                [150, 80],
                [130, 50]
            ], true, '#cccccc');
            graphics.add(function(coodx, coody) {
                LGlobal.canvas.strokeStyle = '#000000';
                LGlobal.canvas.moveTo(20, 20);
                LGlobal.canvas.lineTo(200, 200);
                LGlobal.canvas.stroke();
            });
    
        }
        </script>
    </body>
    
    </html>

     

    转载于:https://www.cnblogs.com/stono/p/4679637.html

    展开全文
  • lufylegend库 LButton

    2015-07-27 16:37:00
    lufylegend库 LButton <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>lufylegend</title> <script type="text/javascript"...

    lufylegend库 LButton

    <!DOCTYPE html>
    <html lang="en">
    
    <head>
        <meta charset="UTF-8">
        <title>lufylegend</title>
        <script type="text/javascript" src="lufylegend-1.7.6.js"></script>
    </head>
    
    <body>
        <div id="mylegend">loading...</div>
        <script type="text/javascript">
        init(50, 'mylegend', 500, 350, main);
        var loader, bitmapup, bitmapover, field;
    
        function main() {
            loader = new LLoader();
            loader.addEventListener(LEvent.COMPLETE,loadUp);
            loader.load('up.png','bitmapData');
        }
        function loadUp(event){
            bitmapup = new LBitmap(new LBitmapData(loader.content));
            loader = new LLoader();
            loader.addEventListener(LEvent.COMPLETE,loadOver);
            loader.load('over.png','bitmapData');
        }
        function loadOver () {
            bitmapover = new LBitmap(new LBitmapData(loader.content));
            var layer = new LSprite();
            addChild(layer);
            field = new LTextField();
            field.text='Wait Click';
            layer.addChild(field);
            var testButton = new LButton(bitmapup,bitmapover);
            testButton.y = 50;
            layer.addChild(testButton);
            testButton.addEventListener(LMouseEvent.MOUSE_DOWN,downshow);
        }
        function downshow (event) {
            field.text = 'testButton Click !';
        }
        </script>
    </body>
    
    </html>

     

    转载于:https://www.cnblogs.com/stono/p/4680533.html

    展开全文
  • lufylegend是一个HTML5开源引擎, 它实现了利用仿ActionScript3.0的语法进行HTML5的开发,包含了LSprite,LBitmapData,LBitmap,LLoader,LURLLoader,LTextField,LEvent等多个AS开发人员熟悉的类。
  • lufylegend库 LTextField

    2015-07-27 16:30:00
    lufylegend库 LTextField &lt;!DOCTYPE html&gt; &lt;html lang="en"&gt; &lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;...

    lufylegend库 LTextField

    <!DOCTYPE html>
    <html lang="en">
    
    <head>
        <meta charset="UTF-8">
        <title>lufylegend</title>
        <script type="text/javascript" src="lufylegend-1.7.6.js"></script>
    </head>
    
    <body>
        <div id="mylegend">loading...</div>
        <script type="text/javascript">
        init(50, 'mylegend', 500, 350, main);
    
        function main() {
            var layer = new LSprite();
            addChild(layer);
            var field = new LTextField();
            field.x = 50;
            field.y = 50;
    
            // field.text = 'Hello World';
            // field.size = 25;
            // field.color = '#333333';
            // field.weight = 'bolder';
            field.setType(LTextFieldType.INPUT);
            layer.addChild(field);
        }
        </script>
    </body>
    
    </html>

     

    展开全文
  • lufylegend是一个HTML5... 利用lufylegend可以轻松的使用面向对象编程,并且可以配合Box2dWeb制作物理游戏, 另外它还内置了LTweenLite缓动类等非常实用的功能, 现在开始使用它吧,它可以让你更快的进入HTML5的世界!
  • lufylegend游戏引擎

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

    lufylegend游戏引擎介绍:click

    这个链接我觉得已经很详细的介绍了这个引擎。

    所以以下我只说说一些简单的游戏代码过程。

    首先从canvas做游戏叙述起:

    这是一个让人很熟悉的简单小游戏,网上到处都是这个小游戏代码,所以就简单说说;

    HTML代码:

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>简单游戏</title>
        <script type="text/javascript" src="game.js"></script>
    </head>
    <body>
        <canvas id="canvas">你的浏览器太low了!</canvas>
        <script type="text/javascript">
        
            window.onload=function(){
                game("canvas");
            }
        </script>
    </body>
    </html>

    js代码:

    function game(id){
        /*创建画布*/
        var oCanvas=document.getElementById(id);
        var canvas=oCanvas.getContext("2d");
        oCanvas.width="512";
        oCanvas.height="480";
        /*******准备图片***********/
        /******************
        为什么要确认图片是否被加载进来了,因为在图片还没加载进来就对其操作,
        很容易会出现各种问题,如图片出不来
        *******************/
        /*背景图*/
        var bgImg=new Image();
        bgImg.src="./images/background.png";
        bgImg.success=false;
        bgImg.onload=function(){
            bgImg.success=true;
        }
    
        /*玩家人物图*/
        var hero=new Image();
        hero.src="./images/hero.png";
        hero.success=false;
        hero.onload=function(){
            hero.success=true;
        }
    
        /*怪物图*/
        var monster=new Image();
        monster.src="./images/monster.png";
        monster.success=false;
        monster.onload=function(){
            monster.success=true;
        }
        /***********游戏对象*********/
        /*人物位置*/
        /*******************
        为什么使用数组?因为这样好管理,优化代码
        *********************/
        hero.pos={
            x:0,
            y:0,
            speed:256
        }
    
        /*怪物位置*/
        monster.pos={
            x:0,
            y:0
        }
    
        var monsterCaught=0;
        /*******处理用户的输入*******/
        /***************
        为什么按键弹起取消获取到键值了,这是为了下面判断时运动的
        **************************/
        var keysDown={};
        var keyNum=null;
        /*addEventListener,在没有写对象下,默认为window下的对象*/
        addEventListener("keydown",function(e){
            e= e || window.event;
            keyNum=e.keyCode;
            keysDown[e.keyCode]=true;
        },false);
        addEventListener("keyup",function(e){
            keyNum=null;
            delete keysDown[e.keyCode];
        },false);
    
        /*******初始化游戏******/
        /**************
        确认怪物和玩家的初始位置
        *******************/
        function gameInit(){
            hero.pos.x=oCanvas.width/2;
            hero.pos.y=oCanvas.height/2;
    
            monster.pos.x=32+(Math.random()*oCanvas.width-64);
            if(monster.pos.x<=0){
                monster.pos.x=0;
            }
            monster.pos.y=32+(Math.random()*oCanvas.height-64);
            if(monster.pos.y<=0){
                monster.pos.y=0;
            }
        }
        /*更新对象*/
    
        function update(m){
            if(keyNum==38){
                /*每秒走的距离*时间间距=距离*/
                hero.pos.y-=hero.pos.speed*m;
            }else if(keyNum==40){
                hero.pos.y+=hero.pos.speed*m;
            }else if(keyNum==37){
                hero.pos.x-=hero.pos.speed*m;
            }else if(keyNum==39){
                hero.pos.x+=hero.pos.speed*m;
            }
            /*monster.pos.x<=hero.pos.x<=monster.pos.x+32*/
            /*y也同理*/
            /*这是为了碰撞检测的,是碰撞就初始化游戏*/
            if(hero.pos.x<=(monster.pos.x+32)&&monster.pos.x<=(hero.pos.x+32)&&hero.pos.y<=(monster.pos.y+32)&&monster.pos.y<=(hero.pos.y+32)){
                monsterCaught++;
                gameInit();
            }
    
        }
    
        /*渲染物体*/
        /*画出游戏界面*/
        function render(){
            if(bgImg.success){
                canvas.drawImage(bgImg,0,0);
            }
            if(hero.success){
                canvas.drawImage(hero,hero.pos.x,hero.pos.y);
            }
            if(monster.success){
                canvas.drawImage(monster,monster.pos.x,monster.pos.y);
            }
            canvas.fillStyle="red";
            canvas.font="30px Arial";
            canvas.textAlign="left";
            canvas.textBaseline="top";
            canvas.fillText("得分:"+monsterCaught,10,10);
        }
    
        /*主循环函数*/
        /*使用来循环的整个游戏的,这样就可以时时刻刻监听整个界面的变化,做出相对应的改变*/
        function main(){
            var now=new  Date().getTime();
            /*获取触发时间的间距*/
            /*为每秒运动的距离不变,这个就不受定时器时间误差影响到运动距离*/
            var delta=now-then;
            /*时间间距以秒为准delta/1000*/
            update(delta/1000);
            render();
            requestAnimationFrame(main);
            then=now;
        }
        /*启动游戏!*/
    
    /*它就是一个性能很好的setTimeout,只是它的帧数是根据浏览器来的,一般来说每秒60帧*/
    var w = window;
    requestAnimationFrame = w.requestAnimationFrame || w.webkitRequestAnimationFrame || w.msRequestAnimationFrame || w.mozRequestAnimationFrame;
    
    var then=new  Date().getTime();
    gameInit();
    main();
    }

    这是个很简单的游戏,而它没有使用clearRect这个清除界面,而是直接使用背景

    去覆盖掉上去,达到清除的效果,就像ps图层一样,上一层覆盖下一层。

     

    OK,接下来是游戏引擎的。

    让小人走动起来;

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Document</title>
        <script src="lufylegend-1.5.1.js"></script>
    </head>
    <body>
        <div id="my"></div>
        <script>
        /*把屏幕分成4行,4列*/
            // console.log(LGlobal.divideCoordinate(256,256,4,4));
            init(100,"my",500,350,main);
            var layer,aina,loader;
            /*LEvent.COMPLETE图片加载完成后进入下一个函数*/
            function main(){
                loader=new LLoader();
                loader.addEventListener(LEvent.COMPLETE,loadBitData);
                loader.load("chara.png","bitmapData");
            }
            function loadBitData(){
                /*LBitmapData图片数据,可以操作图片*/
                var bitmapdata=new LBitmapData(loader.content,0,0,64,64);
                /*把宽高为固定的图像分成多少行,多少列*/
                var list=LGlobal.divideCoordinate(256,256,4,4);
                /*创建图层*/
                layer=new LSprite();
                /*添加图层到底层*/
                addChild(layer);
                /*运动*/
                aina=new LAnimation(layer,bitmapdata,list);
                layer.addEventListener(LEvent.ENTER_FRAME,onframe);
            }
            function onframe(){
                var gA=aina.getAction();
                switch(gA[0]){
                    case 0 : layer.y+=5;
                    if(layer.y>=200){
                        aina.setAction(2);
                    };break;
                    case 1 : layer.x-=5;
                    if(layer.x<=0){
                        aina.setAction(0);
                    };break;
                    case 2 : layer.x+=5;
                    if(layer.x>=200){
                        aina.setAction(3);
                    };break;
                    case 3 : layer.y-=5;
                    if(layer.y<=0){
                        aina.setAction(1);
                    };break;
                }
                aina.onframe();
            }
        </script>
    </body>
    </html>

    核心是LAnimation,只要会使用这个就很好理解上的了,查手册就知道怎么使用。

    其实游戏就是在动画的基础上进一步对这个动画各种效果进行人工的操作,而这个

    人工操作的实现过程就需要各种判断来实现,所以让画面动了就成功一半,只差一些

    游戏方面的逻辑修改它,让它转为人工操作了。所以我把这个叫做从自动转为手动。

    当然游戏没有那么简单,这只是做一些很简单的游戏是这样,但游戏就是人为操作动画的

    过程,而在代码实现过程最好的是为好层次,如js文件就要分基础,背景,人物,怪物,按键等等

    这只是比如,不同情况,不同对待,这样可以让逻辑清晰,易读,但要修改就要使用到面向对象的模式去

    编写代码了,这个比较易维护。不过现在编写模式很多,个人的判断和习惯。

    虽然刚刚学游戏编写没有多久,但觉得这个数学很重要,所以数学知识也不能缺。

     

    转载于:https://www.cnblogs.com/zhangzhicheng/p/5967991.html

    展开全文
  • canvas及lufylegend引擎

    2019-10-03 11:24:11
    随着对canvas的深入了解,发现canvas真是个好东西,也发现android真烂,哎!...首先我使用的是lufylegend.js 1.9.1的版本(非常好用的引擎,强烈推荐)。 在制作过程中先来分析打地鼠的游戏大概需要那几个...
  • lufylegend.js入门

    2016-04-20 14:17:00
    由于最近在研究小游戏,需要用到游戏引擎,有人推荐lufylegend.js,结合作者的官网和API 看了好久,大概入了个门,下面总结一偏入门文章,希望对初学者有所帮助。 lufylegend是一个HTML5开源引擎, 它实现了利用仿...
  • JS-lufylegend游戏动画-人物运动 目录 文章目录前言引入库使用流程函数解析代码讲解移动运动代码讲解 前言 动画是游戏的最基本组成部分 利用LAnimation类和循环时间,可以轻松实现一组动画的播放 准备一张...
  • lufylegend.js的简单使用

    2019-09-25 13:32:54
    script type="text/javascript" src="js/lufylegend/lufylegend-1.10.1.min.js"></script> html <div id="legend"></div> <img src="" alt="" class="photo_img"> ...
  • lufylegend库件-画图 画文字 <!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="Generator" content="EditPlus®"> <meta name="Author" ...
  • HTML5开源游戏引擎lufylegend1.7.1发布

    千次阅读 多人点赞 2013-04-10 07:08:45
    HTML5开源引擎lufylegend1.7.1版发布,下载包内含开发示例近30个,已分享至github。lufylegend.js引擎官网http://lufylegend.com/lufylegendlufylegend.js引擎在线API文档链接http://lufylegend.com/lufylegend/api...
  • HTML5开源游戏引擎lufylegend1.5.0发布

    万次阅读 多人点赞 2012-10-10 12:25:05
    说明lufylegend1.5.0版终于发布了,本来打算再完善一下才发布的,但是最近实在太忙了,1.5.0版拖了又拖,所以决定先发布,等继续完善后再发布1.5.1版,API也相对完善了一下,并加入到了下载包中,原谅偶复制粘贴........
  • lufylegend:图形变形3

    2015-04-09 22:55:00
    因为lufylegend1.5.0版的drawtriangles函数有个bug,所以我悄悄的更新了lufylegend1.5.1版,大家可以到官网下载,地址如下 http://lufylegend.com/lufylegend 其实绘制3d球体效果的话,首先就是绘...
  • lufylegend引擎是canvas游戏中,比较简单的引擎之一,它不需要配置环境,类似引入jquery包的方式,引用对应js文件即可 lufylegend官方网站:http://www.lufylegend.com/ 首先看下游戏的截图 游戏设计比较粗糙,...
  • HTML5开源游戏引擎lufylegend1.6.0发布

    千次阅读 多人点赞 2013-02-20 12:23:55
    lufylegend1.6.0版终于发布了,加入了自适应屏幕和滤镜等新功能,更新了API文档,新版本的API文档更方便查询。lufylegend.js引擎的下载链接http://lufylegend.com/lufylegendlufylegend.js引擎在线API文档链接...
  • lufylegend的一些简单的使用

    千次阅读 2018-10-08 13:54:43
    lufylegend的一些简单的使用 本人小白,路过的大神有什么指导的,请不要吝啬自己的语言,我会中信的感谢 lufylegend游戏框架是 lufy 大神写的一个框架,是一款基于html5的canvas的游戏框架,具有很好的兼容性,这里...
  • HTML5开源游戏引擎lufylegend1.8.0发布

    万次阅读 多人点赞 2013-10-09 07:51:57
    lufylegend是一个HTML5开源引擎, 它实现了利用仿ActionScript3.0的语法进行HTML5的开发,包含了LSprite,...利用lufylegend可以轻松的使用面向对象编程,并且可以配合Box2dWeb制作物理游戏, 另外它还内置了LTween
  • HTML5开源游戏引擎lufylegend1.7.0发布

    万次阅读 多人点赞 2013-03-26 00:27:14
    lufylegend1.7.0版发布,下载包内含开发示例已经增加到20多个,为了更方便操作游戏中的声音等,加入了音频和视频操作,另外更新了API文档。lufylegend.js引擎的下载链接...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 837
精华内容 334
关键字:

lufylegend