Refactor image handling in Sky to expose the loader and image as separate...

Refactor image handling in Sky to expose the loader and image as separate classes to Dart code. This makes it possible to avoid unnecessary paints, by only painting once when the image has loaded. Now that we've separated the loader and image classes, we can implement an image cache in Dart.

R=abarth@chromium.org, abarth

Review URL: https://codereview.chromium.org/1156003007

examples/raw/spinning_image.dart

@@ -6,7 +6,7 @@ import 'dart:sky';
 
 double timeBase = null;
 
-Image image;
+Image image = null;
 
 void beginFrame(double timeStamp) {
   if (timeBase == null) timeBase = timeStamp;
@@ -16,14 +16,21 @@ void beginFrame(double timeStamp) {
   canvas.rotateDegrees(delta / 10);
   canvas.scale(0.2, 0.2);
   Paint paint = new Paint()..setARGB(255, 0, 255, 0);
+  if (image != null)
     canvas.drawImage(image, -image.width / 2.0, -image.height / 2.0, paint);
   view.picture = canvas.endRecording();
   view.scheduleFrame();
 }
 
 void main() {
-  image = new Image();
-  image.src = "https://www.dartlang.org/logos/dart-logo.png";
-  view.setBeginFrameCallback(beginFrame);
+  new ImageLoader("https://www.dartlang.org/logos/dart-logo.png", (result) {
+    if (result != null) {
+      print("${result.width}x${result.width} image loaded!");
+      image = result;
       view.scheduleFrame();
+    } else {
+      print("Image failed to load");
+    }
+  }).load();
+  view.setBeginFrameCallback(beginFrame);
 }