请选择 进入手机版 | 继续访问电脑版
阳光沙滩博客现金打赏设置邀请好友最新视频下载
+发表新主题
刘某L 发布于2018-5-26 17:10 402 次浏览 4 位用户参与讨论
跳转到指定楼层
本帖的地址:https://bbs.sunofbeaches.com/thread-6306-1-1.html
版权声明:本文为作者所有,未经作者允许不得转载--->温馨提示:请加上原文地址!
前几天领导跟我们说我们项目打算出一个H5版的游戏,让我们先了解一下LayaAir引擎和AS3语法(我们这项目已经做了一个完整的手游客户端,采有cocos2d引擎加 lua写的),然后我就跟着LayaBox官网一步一步学习,没想到刚开始学就遇到坑了。

第一步:用LayaAirIDE创建AS3项目,这里照着教程来基本没问题,创建完项目后我们开始编写我们的第一个HelloWorld程序;

第二步:编写第一个HelloWorld;找到 src/LayaSample.as 文件,写入如下代码

  1. package {
  2.     import laya.webgl.WebGL;
  3.     import laya.display.Text;
  4.     import laya.display.Sprite;
  5.     public class LayaSample {
  6.                
  7.         public function LayaSample() {
  8.             //初始化引擎 默认背景色是黑色的
  9.             Laya.init(1136, 640,WebGL);
  10.             var text:Text = new Text();
  11.             //设置文本内容
  12.             text.text = "Hello Laya!";
  13.             //设置文本颜色为白色,默认颜色为黑色
  14.             text.color = "#ffffff";
  15.             //设置字体大小
  16.             text.fontSize = 30;
  17.             //将文本内容添加到舞台
  18.             Laya.stage.addChild(text);
  19.         }
  20.     }
复制代码
点击运行 TIM截图20180526165245.png 得到如下运行结果:
TIM截图20180526165428.png
我们的第一个HelloWorld已经完成了,我们只添加了一个Text控件,接下来我们再添加一个图片显示,首先我们先找一张要显示的图片,把它添加到如下目录:
TIM截图20180526170002.png
然后编写代码:
  1. package {
  2.     import laya.webgl.WebGL;
  3.     import laya.display.Text;
  4.     import laya.display.Sprite;
  5.     public class LayaSample {
  6.                
  7.         public function LayaSample() {
  8.             //初始化引擎 默认背景色是黑色的
  9.             Laya.init(1136, 640,WebGL);
  10.             var text:Text = new Text();
  11.             //设置文本内容
  12.             text.text = "Hello Laya!";
  13.             //设置文本颜色为白色,默认颜色为黑色
  14.             text.color = "#ffffff";
  15.             //设置字体大小
  16.             text.fontSize = 30;
  17.             //将文本内容添加到舞台
  18.             Laya.stage.addChild(text);

  19.             showImg();
  20.         }

  21.         private function showImg():void{
  22.             //方法1:使用loadImage
  23.             var img:Sprite = new Sprite();
  24.             img.pos(200, 0);
  25.             Laya.stage.addChild(img);
  26.             img.loadImage("res/a.png")
  27.         }
  28.     }
  29. }
复制代码
点击运行也是能显示出来的,
TIM截图20180526170553.png

但是当我用FlashDevelop 打开这个项目的时候,运行时发现图片没显示出来,(FlashDevelop开发环境配置在这里),FlashDevelop运行时是运行在谷歌浏览器的,我刚开始怀疑是谷歌浏览器的原因,但当我用LayaAirIDE TIM截图20180526171908.png 通过谷歌浏览器调试是是能显示的
这是用LayaAirIDE编译运行的截图
TIM截图20180526172011.png
然后下面是用FlashDevelop编译运行的截图
TIM截图20180526180942.png

我们可以通过对比上下两张结果图发现前者能正常运行是因为通过 --disable-web-security 这个命令标记,然后我按F12 查看浏览器控制台输出日志发现图片不能正确显示是报错了,
TIM截图20180526173033.png
通过万能的百度我们发现这是 跨域访问错误的问题 ,看看浏览器地址我们发现是 file:// 开头的,而不是http:// 开头,访问的是本机的一个绝对地址,而图片在该helloworld程序的地址是相对的,所以我们没能显示出来。
怎么办呢?看前者的运行效果图我们就能找到解决方法了,我们发现前者的运行效果图 有个黄色的警告 --disable-web-security
解决方法:
右键谷歌浏览器快捷方式 - 属性 -- 快捷方式 -- 目标  ;在后面追加 --allow-file-access-from-files --disable-web-security 就OK了。 TIM截图20180526174957.png

图片就显示出来了 TIM截图20180526181748.png

打赏

参与人数 1SunOf币 +20 收起 理由
黄永康 + 20 赞一个!

查看全部打赏


转载请说明出处,本文地址:https://bbs.sunofbeaches.com/thread-6306-1-1.html

帖子的最近访客

该会员没有填写今日想说内容.

已有4人评论

黄永康 发表于 2018-5-26 21:33:29
你不是去旅行了?这是在酒店写的博客,哈哈!!!!
黄永康 发表于 2018-5-26 21:33:44
小黄人!
回复

使用道具 举报

刘某L 发表于 2018-5-27 12:56:15
黄永康 发表于 2018-5-26 21:33
你不是去旅行了?这是在酒店写的博客,哈哈!!!!

没有呀 ,上了两个星期班了。之前去了三亚

本版积分规则

关闭

站长推荐上一条 /1 下一条

QQ| 《网站免责声明》|小黑屋| 阳光沙滩(sunofbeaches.com)  

Copyright © 2001-2013 Comsenz Inc.   All Rights Reserved.

Powered by Discuz! X3.2( 粤ICP备14093694号 )

快速
回复
返回
列表
返回
顶部