Scenes and UI

Create a Scene

1 Create a project and name it HelloCocos. Do the following:

2 Create a scene and name it Scene1. Do the following:

image

image

3 Right click on Resources panel, select Import Resources, and then select files to import.

image

4 Import two resource folders: Common and LevelSelection.

image

5 Click Vertical Screen image to modify the screen resolution from the default setting 960 * 640* to 640 * 960.

image

6 Drag and drop a Sprite from Basic Objects to Canvas; drag and drop LS10.png from Resources panel to Image Resource and modify its position as tile (640 * 960).

image

image

In Cocos Studio, the procedures of creating Scenes, UI and animations are similar.

Create a Layer

1 Click New File button and select Layer. Name it "Layer" and click New.

image

2 Drag and drop a Button to Canvas and specify its properties. Put it at center bottom of Canvas.

image

3 Add "Layer.csd" to "Scene1.csd". Do the following:

image

4 Click "Preview" button image at the top of the workspace to check the visual effects of the layer.

image