GC DevKit 快速入门 -- Hello World!

接上节 http://www.cnblogs.com/hangxin1940/archive/2013/04/09/3009251.html

创建项目

在devkit环境下运行命令创建一个新项目

$ basil init hello-world

devkit会在当前目录生成一个项目,现在打开这个项目文件夹,并运行它

$ cd ./hello-world
$ basil serve

默认的,会在本机9200运行node.js实例,当然可以改变端口

$ basil serve -p 8080

现在用浏览器打开它(推荐chrome, 方便调试)

http://localhost:8080

页面中找到Projects,里面会有刚才创建的项目.

在项目的主文件夹,有个 manifest.json 文件,这是项目的配置文件. 可以尝试修改他,然后在1Projects1中选择项目,1simulate1运行它.

要运行一个现有的devkit项目,比如git下来的,只要进入它的主目录注册进basil就行

$ cd ./anotherproject
$ basil register

每个注册过/已存在的项目,都会在devkit安装目录的 config.json 配置文件中声明.

目录结构

每一个新创建的devkit项目，其目录结构都如下：

project/
.
├── manifest.json (项目配置)
├── sdk/ -> /path/to/devkit/sdk (sdk的链接)
├── build/ (basil自动构建)
├── resources/ (游戏资源)
│   └── fonts/
└── src/
    └── Application.js (程序入口)

所有游戏有关的文件都会被放在src目录下，要注意的是 Application.js 是整个游戏的入口

当使用 basil init 创建一个新的游戏， ./src/Application.js 看起来是这样子：

import ui.TextView as TextView;

exports = Class(GC.Application, function() {

  this.initUI = function() {
    var textview = new TextView({
      superview: this.view,
      layout: "box",
      text: "Hello, world!",
      color: "white"
    });
  };

  this.launchUI = function () {};
}); 

initUI 与 launchUI 这两个方法定一个程序的入口，它们会被 GC.Application 调用。

上述代码中 TextView 类被引用，它用来在屏幕上显示 Hello, world!。

UI监视与调试

浏览器中模拟器的上方有一个按钮 UI Inspector， 用来监视整个程序活动的视图树。

在UI监视试图中，可以看到整个试图树种包含一个名为'TextView2:Hello, world!'的TextView

在Chrome浏览器中，可以很方便的调试游戏，打开浏览器的开发者工具，调试工具的 Console 命令行，使我们可以在实时的更改所有对象。

如上个Hello world示例中，从UI监视试图可以看出来，整个程序只有一个TextView对象，现在我们使用Console调试命令行尝试更改这个TextView的文字内容。

首先通过 GC.app 从整个View树中得到它，输入：

var textview = GC.app.view.getSubviews()[0]; //选择第一个子视图

GC.app是我们在工程文件夹中 src/Application.js 类的一个实例，也就是入口类的实例，GC.app.view是所有需要被渲染的场景图形的根。

getSubviews方法返回一个包含了它所有子试图的数组，在这里，我们只获取它的第一个对象(也是唯一一个)。

下面，我们尝试更改这个textview的一些内容:

textview.updateOpts({size: 42});
textview.setText("We did it!");

上述代码的改变会立即在浏览器中呈现出来，这种特性是我们很方便友好的开发/调试程序。

安装示例代码

官方示例是很好的教材，下面命令用来安装示例程序

$ basil install examples

GC DevKit 快速入门 -- 游戏概览(一) http://www.cnblogs.com/hangxin1940/archive/2013/04/10/3011555.html