环境搭建
由于目前玩一玩开发平台仅支持Mac,所以你需要一台Mac电脑或者黑苹果(但不推荐)
1、注册苹果账号
2、安装Xcode (建议在App Store中下载避免更新带来不必要的麻烦)
3、安装Android Studio (非必须,Android调试看日志很实用)
4、第三方JavaScript编辑器(非必须)
推荐安装
iTerm2替代默认终端(Terminal)
iTerm2个性化主题配置
Sublime Text 3
sublime text 3 插件推荐
下载引擎代码
有了之前的准备工作,下面就来下载引擎代码
玩一玩游戏平台使用的是自研Bricks引擎,他们通过Bitbucket
来维护引擎代码,通过授权的开发者可以在上面下载到引擎。
官方托管地址
https://bitbucket.org/wesleyxiao/publicbrickengine
授权后下载地址
https://[email protected]/wesleyxiao/publicbrickengine.git
cd /Users/Javen/Documents/workspace/git
git clone https://[email protected]/wesleyxiao/publicbrickengine.git
Hello World
从
Bitbucket
中clone下来后目录结构如下
双击
PublicBrickEngineGame.xcodeproj
将项目在Xcode
中打开,如果你是苹果开发者可以忽略以下新手指引步骤
这里需要我们添加这个苹果账号并进行签名
修改
Bundle Identifier
后再次Try Again
恭喜项目配置完成,下面来介绍一下引擎目录
主要包括
1、游戏的配置文件:横屏、竖屏等
2、游戏入口即启动后首先加载的JS
3、游戏的资源文件(默认是Demo示例的资源文件)
4、引擎封装的核心JS库
5、Demo示例
基本目录介绍完了,我们来实现一个简单的Hello Word
修改配置文件
修改游戏配置文件gameConfig.json
{
"enterUrl": "", //H5游戏链接地址,H5游戏必填。非H5游戏不填
"viewMode": 1 //控制横竖屏状态:1.竖屏 2.左横屏(home键在左边)3.右横屏(home键在右边)
}
需求实现
现在手机屏幕中间显示Hello World
我们在入口JS
main.js
中做适当的修改,修改后的代码如下
// iPhone 6 (750x1334) 的分辨率为标准进行缩放。
DESIGN_WIDTH = 750
DESIGN_HEIGHT = 1334
var scale = BK.Director.screenPixelSize.width / DESIGN_WIDTH;
BK.Director.root.scale = {
x: scale,
y: scale
};
//设置文本样式
var style = {
"fontSize": 30, //字号
"textColor": 0xFFFF0000, //颜色 ARGB编码
"maxWidth": 600, //最大宽度
"maxHeight": 500, //最大高度
"width": 500, //宽度
"height": 400, //高度
"textAlign": 1, //对其方式 0左 1中 2右
"bold": 1, //粗体
// "italic": 1, //斜体
// "strokeColor": 0xFF000000, //描边
// "strokeSize": 5, //描边宽
// "shadowRadius": 5, //阴影圆角半径
// "shadowDx": 10, //阴影x偏移
// "shadowDy": 10, //阴影y偏移
// "shadowColor": 0xFFFF0000 //阴影颜色
}
//实例化BK.Text 文本
var txt = new BK.Text(style, "Hello world \n\n\n\n IJPay 让支付触手可及 \n\n https://gitee.com/javen205/IJPay \n\n By Javen");
//设置锚点
txt.anchor = {
x: 0.5,
y: 0.5
};
//设置位置
txt.position = {
x: DESIGN_WIDTH / 2,
y: DESIGN_HEIGHT / 2
};
//将文本添加到根节点
BK.Director.root.addChild(txt);
运行测试
选择一个设备(模拟器或者真机)按快捷键command+b
构建项目,如果提示Build Succeeded
即构建完成。如果出现异常就根据异常提示进行修改。
运行效果图如下
手Q中测试
此时我们需要下载特殊版本的手Q并安装到手机。
假如你游戏的ID为:2004
(可以登录到hudong.qq.com查看)
苹果手机操作步骤
- 将
游戏资源文件
打包为cmshow_game_2004.zip
- 将压缩包传到QQ中并下载
- Q消息面板中点击下载的压缩包
- 点击下载好的压缩包再点击”移动至游戏文件夹”即可
- Q面板中唤起指定的游戏点击即可测试刚才的游戏资源
安卓手机操作步骤
- 将
游戏资源文件
推送到游戏资源目录 - 关闭设置中的
厘米秀游戏资源校验和更新
来避免验证签名下载线上的资源包 - Q面板中唤起指定的游戏点击即可测试刚才的游戏资源
安卓游戏资源目录为
/sdcard/tencent/MobileQQ/.apollo/game/2004
这里的示例比较简单简单没有引用任何第三方资源,所以游戏资源包
内容仅仅只需要刚刚写的main.js
。
特殊版本手Q下载:公众号(javenlife)后台回复 特殊版本手Q
调试打包参考
开发环境搭建与调试
官方文档-开发者调试
如有疑问欢迎留言讨论