Adds main screen to game and graphics for game UI

sky/sdk/example/game/assets/game_ui.json

+{"frames": [
+
+{
+	"filename": "bar_shield.png",
+	"frame": {"x":2,"y":954,"w":412,"h":100},
+	"rotated": false,
+	"trimmed": false,
+	"spriteSourceSize": {"x":0,"y":0,"w":412,"h":100},
+	"sourceSize": {"w":412,"h":100},
+	"pivot": {"x":0.5,"y":0.5}
+},
+{
+	"filename": "bar_shield_fill.png",
+	"frame": {"x":2,"y":1156,"w":320,"h":72},
+	"rotated": false,
+	"trimmed": false,
+	"spriteSourceSize": {"x":0,"y":0,"w":320,"h":72},
+	"sourceSize": {"w":320,"h":72},
+	"pivot": {"x":0.5,"y":0.5}
+},
+{
+	"filename": "btn_play_down.png",
+	"frame": {"x":2,"y":484,"w":468,"h":468},
+	"rotated": false,
+	"trimmed": true,
+	"spriteSourceSize": {"x":2,"y":16,"w":468,"h":468},
+	"sourceSize": {"w":472,"h":484},
+	"pivot": {"x":0.5,"y":0.5}
+},
+{
+	"filename": "btn_play_up.png",
+	"frame": {"x":2,"y":2,"w":468,"h":480},
+	"rotated": false,
+	"trimmed": true,
+	"spriteSourceSize": {"x":2,"y":4,"w":468,"h":480},
+	"sourceSize": {"w":472,"h":484},
+	"pivot": {"x":0.5,"y":0.5}
+},
+{
+	"filename": "number_0.png",
+	"frame": {"x":416,"y":954,"w":38,"h":63},
+	"rotated": false,
+	"trimmed": true,
+	"spriteSourceSize": {"x":23,"y":22,"w":38,"h":63},
+	"sourceSize": {"w":84,"h":107},
+	"pivot": {"x":0.5,"y":0.5}
+},
+{
+	"filename": "number_1.png",
+	"frame": {"x":324,"y":1221,"w":16,"h":57},
+	"rotated": true,
+	"trimmed": true,
+	"spriteSourceSize": {"x":45,"y":25,"w":16,"h":57},
+	"sourceSize": {"w":84,"h":107},
+	"pivot": {"x":0.5,"y":0.5}
+},
+{
+	"filename": "number_2.png",
+	"frame": {"x":366,"y":1056,"w":38,"h":63},
+	"rotated": false,
+	"trimmed": true,
+	"spriteSourceSize": {"x":23,"y":22,"w":38,"h":63},
+	"sourceSize": {"w":84,"h":107},
+	"pivot": {"x":0.5,"y":0.5}
+},
+{
+	"filename": "number_3.png",
+	"frame": {"x":364,"y":1156,"w":35,"h":63},
+	"rotated": false,
+	"trimmed": true,
+	"spriteSourceSize": {"x":26,"y":22,"w":35,"h":63},
+	"sourceSize": {"w":84,"h":107},
+	"pivot": {"x":0.5,"y":0.5}
+},
+{
+	"filename": "number_4.png",
+	"frame": {"x":416,"y":1019,"w":38,"h":57},
+	"rotated": false,
+	"trimmed": true,
+	"spriteSourceSize": {"x":23,"y":25,"w":38,"h":57},
+	"sourceSize": {"w":84,"h":107},
+	"pivot": {"x":0.5,"y":0.5}
+},
+{
+	"filename": "number_5.png",
+	"frame": {"x":324,"y":1156,"w":38,"h":63},
+	"rotated": false,
+	"trimmed": true,
+	"spriteSourceSize": {"x":23,"y":22,"w":38,"h":63},
+	"sourceSize": {"w":84,"h":107},
+	"pivot": {"x":0.5,"y":0.5}
+},
+{
+	"filename": "number_6.png",
+	"frame": {"x":406,"y":1078,"w":38,"h":63},
+	"rotated": true,
+	"trimmed": true,
+	"spriteSourceSize": {"x":23,"y":22,"w":38,"h":63},
+	"sourceSize": {"w":84,"h":107},
+	"pivot": {"x":0.5,"y":0.5}
+},
+{
+	"filename": "number_7.png",
+	"frame": {"x":401,"y":1198,"w":35,"h":60},
+	"rotated": true,
+	"trimmed": true,
+	"spriteSourceSize": {"x":26,"y":22,"w":35,"h":60},
+	"sourceSize": {"w":84,"h":107},
+	"pivot": {"x":0.5,"y":0.5}
+},
+{
+	"filename": "number_8.png",
+	"frame": {"x":406,"y":1118,"w":38,"h":63},
+	"rotated": true,
+	"trimmed": true,
+	"spriteSourceSize": {"x":23,"y":22,"w":38,"h":63},
+	"sourceSize": {"w":84,"h":107},
+	"pivot": {"x":0.5,"y":0.5}
+},
+{
+	"filename": "number_9.png",
+	"frame": {"x":401,"y":1158,"w":38,"h":63},
+	"rotated": true,
+	"trimmed": true,
+	"spriteSourceSize": {"x":23,"y":22,"w":38,"h":63},
+	"sourceSize": {"w":84,"h":107},
+	"pivot": {"x":0.5,"y":0.5}
+},
+{
+	"filename": "scoreboard.png",
+	"frame": {"x":2,"y":1056,"w":362,"h":98},
+	"rotated": false,
+	"trimmed": false,
+	"spriteSourceSize": {"x":0,"y":0,"w":362,"h":98},
+	"sourceSize": {"w":362,"h":98},
+	"pivot": {"x":0.5,"y":0.5}
+}],
+"meta": {
+	"app": "http://www.codeandweb.com/texturepacker",
+	"version": "1.0",
+	"image": "game_ui.png",
+	"format": "RGBA8888",
+	"size": {"w":472,"h":1239},
+	"scale": "1",
+	"smartupdate": "$TexturePacker:SmartUpdate:02d6676bdde949110cbdc9a2c385b33a:6b0974f94eba9593dd9636cc730412b8:10ac111e32c27e51f4e8444dbb39eff6$"
+}
+}

sky/sdk/example/game/lib/game_demo.dart

@@ -2,9 +2,11 @@ library game;
 
 import 'dart:sky' as sky;
 import 'dart:math' as Math;
-import 'package:vector_math/vector_math_64.dart';
-import 'package:sky/widgets/widget.dart';
 import 'sprites.dart';
+
 import 'package:sky/rendering/object.dart';
+import 'package:sky/widgets/widget.dart';
+import 'package:sky/widgets/navigator.dart';
+import 'package:vector_math/vector_math_64.dart';
 
 part 'game_demo_world.dart';

sky/sdk/example/game/lib/game_demo_world.dart

@@ -27,6 +27,7 @@ class GameDemoWorld extends NodeWithSize {
   sky.Image _imgNebula;
 
   SpriteSheet _spriteSheet;
+  Navigator _navigator;
 
   // Inputs
   double _joystickX = 0.0;
@@ -45,7 +46,7 @@ class GameDemoWorld extends NodeWithSize {
   int _numFrames = 0;
   bool _isGameOver = false;
 
-  GameDemoWorld(App app, ImageMap images, this._spriteSheet) : super(new Size(_gameSizeWidth, _gameSizeHeight)) {
+  GameDemoWorld(App app, this._navigator, ImageMap images, this._spriteSheet) : super(new Size(_gameSizeWidth, _gameSizeHeight)) {
 
     // Fetch images
     _imgNebula = images["assets/nebula.png"];
@@ -317,6 +318,8 @@ class GameDemoWorld extends NodeWithSize {
 
     // Add an explosion
     addExplosion(AsteroidSize.large, _ship.position);
+
+    _navigator.pop();
   }
 
   // Handling controls
@@ -588,6 +591,7 @@ class Nebula extends Node {
     for (int i = 0; i < 2; i++) {
       for (int j = 0; j < 2; j++) {
         Sprite sprt = new Sprite.fromImage(img);
+        sprt.transferMode = sky.TransferMode.plus;
         sprt.pivot = Point.origin;
         sprt.position = new Point(i * _gameSizeWidth - _gameSizeWidth, j * _gameSizeHeight - _gameSizeHeight);
         addChild(sprt);

sky/sdk/example/game/main.dart

@@ -5,6 +5,8 @@
 import 'package:sky/mojo/asset_bundle.dart';
 import 'package:sky/theme/colors.dart' as colors;
 import 'package:sky/widgets/basic.dart';
+import 'package:sky/widgets/raised_button.dart';
+import 'package:sky/widgets/navigator.dart';
 import 'package:sky/widgets/widget.dart';
 import 'package:sky/widgets/task_description.dart';
 import 'package:sky/widgets/theme.dart';
@@ -22,6 +24,7 @@ final AssetBundle _bundle = _initBundle();
 
 ImageMap _loader;
 SpriteSheet _spriteSheet;
+SpriteSheet _spriteSheetUI;
 GameDemoApp _app;
 
 main() async {
@@ -31,10 +34,15 @@ main() async {
     'assets/nebula.png',
     'assets/sprites.png',
     'assets/starfield.png',
+    'assets/game_ui.png',
   ]);
 
   String json = await _bundle.loadString('assets/sprites.json');
   _spriteSheet = new SpriteSheet(_loader['assets/sprites.png'], json);
+
+  json = await _bundle.loadString('assets/game_ui.json');
+  _spriteSheetUI = new SpriteSheet(_loader["assets/game_ui.png"], json);
+
   _app = new GameDemoApp();
 
   runApp(_app);
@@ -42,6 +50,22 @@ main() async {
 
 class GameDemoApp extends App {
 
+  NavigationState _navigationState;
+
+  void initState() {
+    _navigationState = new NavigationState([
+      new Route(
+        name: '/',
+        builder: _buildMainScene
+      ),
+      new Route(
+        name: '/game',
+        builder: _buildGameScene
+      ),
+    ]);
+    super.initState();
+  }
+
   Widget build() {
     // TODO(viktork): The task bar purple is the wrong purple, we may need
     // a custom theme swatch to match the purples in the sprites.
@@ -54,9 +78,22 @@ class GameDemoApp extends App {
       data: theme,
       child: new TaskDescription(
         label: 'Asteroids',
-        child: new SpriteWidget(
-          new GameDemoWorld(_app, _loader, _spriteSheet)
-        )
+        child: new Navigator(_navigationState)
+      )
+    );
+  }
+
+  Widget _buildGameScene(navigator, route) {
+    return new SpriteWidget(
+      new GameDemoWorld(_app, navigator, _loader, _spriteSheet)
+    );
+  }
+
+  Widget _buildMainScene(navigator, route) {
+    return new Center(
+      child: new RaisedButton(
+        child: new Text("Play"),
+        onPressed:() => navigator.pushNamed('/game')
       )
     );
   }

sky/sdk/example/game/sky.yaml

@@ -3,3 +3,5 @@ assets:
   - assets/sprites.json
   - assets/sprites.png
   - assets/starfield.png
+  - assets/game_ui.png
+  - assets/game_ui.json