H5游戏开发入坑第一弹（lufylegend基本框架）
2016-10-18 本文已影响0人
豆沙包o小白
效果图
基本内容
-
html基本结构
-
lufylegend.js包含与使用
-
lufylegend.js屏幕适配
以下内容详看注释部分
html部分
<!DOCTYPE HTML>
<html>
<head>
<!-- 字符编码为utf-8 -->
<meta charset="utf-8"/>
<!-- 屏幕适配所需内容 -->
<meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
<!-- 页面标签标题 -->
<title>我是标题</title>
html,body{
margin: 0;
padding: 0;
}
<!-- lufylegend.js 文件包含位置 -->
<script type="text/javascript" src="js/lufylegend-1.10.1.min.js"></script>
</head>
<body>
<!-- 内容加载位置 -->
<div id="mylegend">loading</div>
</body>
</html>
js部分
<script type="text/javascript">
//初始化位置到mylegend，大小为800*400，即将运行函数main，帧率为50；
init(50,"mylegend",800,400,main);
//定义层backLayer，文本textDic（用于测试）
var backLayer;
var textDic;
function main(){
//占据全屏
LGlobal.stageScale = LStageScaleMode.SHOW_ALL;
LSystem.screen(LStage.FULL_SCREEN);
backLayer = new LSprite();
//在背景层上绘制黑色背景
backLayer.graphics.drawRect(1,"#000",[0,0,800,400],true,"#000");
//背景显示
addChild(backLayer);
//textDic文本测试
textDic = new LTextField();
textDic.text = "我是测试文本";
textDic.weight = "bolder";
textDic.color = "#fff";
textDic.size = 24;
textDic.x = (LGlobal.width - textDic.getWidth()) / 2;
textDic.y = 200;
backLayer.addChild(textDic);
//函数调用
gameInit();
}
function gameInit(){
/*其他内容*/
}
</script>
完整无注释代码
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
<title>我是标题</title>
html,body{
margin: 0;
padding: 0;
}
<script type="text/javascript" src="js/lufylegend-1.10.1.min.js"></script>
</head>
<body>
<div id="mylegend">loading</div>
</body>
<script type="text/javascript">
init(50,"mylegend",800,400,main);
var backLayer;
var textDic;
function main(){
LGlobal.stageScale = LStageScaleMode.SHOW_ALL;
LSystem.screen(LStage.FULL_SCREEN);
backLayer = new LSprite();
backLayer.graphics.drawRect(1,"#000",[0,0,800,400],true,"#000");
addChild(backLayer);
textDic = new LTextField();
textDic.text = "我是测试文本";
textDic.weight = "bolder";
textDic.color = "#fff";
textDic.size = 24;
textDic.x = (LGlobal.width - textDic.getWidth()) / 2;
textDic.y = 200;
backLayer.addChild(textDic);
gameInit();
}
function gameInit(){
/*其他内容*/
}
</script>
</html>
效果图
样图.png
lufylegend.js
- 链接：http://pan.baidu.com/s/1i5NSBQ1 密码：ipji
- 添加到指定路径下即可
- 一定不要忘记添加！！！
