Implement RenderImage and Image for Sky

sky/examples/raw/interactive_flex.dart

+// Copyright 2015 The Chromium Authors. All rights reserved.
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+import 'dart:sky';
+import 'dart:math';
+import 'package:sky/framework/net/image_cache.dart' as image_cache;
+import 'package:sky/framework/app.dart';
+import 'package:sky/framework/rendering/render_box.dart';
+import 'package:sky/framework/rendering/render_block.dart';
+import 'package:sky/framework/rendering/render_node.dart';
+import 'package:sky/framework/rendering/render_flex.dart';
+import 'package:sky/framework/rendering/render_image.dart';
+import 'package:sky/framework/rendering/render_paragraph.dart';
+
+class RenderSolidColor extends RenderDecoratedBox {
+  final Size desiredSize;
+  final int backgroundColor;
+
+  RenderSolidColor(int backgroundColor, { this.desiredSize: const Size.infinite() })
+      : backgroundColor = backgroundColor,
+        super(decoration: new BoxDecoration(backgroundColor: backgroundColor));
+
+  Size getIntrinsicDimensions(BoxConstraints constraints) {
+    return constraints.constrain(desiredSize);
+  }
+
+  void performLayout() {
+    size = constraints.constrain(desiredSize);
+  }
+
+  void handlePointer(PointerEvent event) {
+    if (event.type == 'pointerdown')
+      decoration = new BoxDecoration(backgroundColor: 0xFFFF0000);
+    else if (event.type == 'pointerup')
+      decoration = new BoxDecoration(backgroundColor: backgroundColor);
+  }
+}
+
+class RenderImageResizable extends RenderImage {
+  RenderImageResizable(String src, double width, double height)
+      : _src = src,
+        _startingSize = new Size(width, height),
+        super(src, width, height) {
+  }
+
+  final String _src;
+  final Size _startingSize;
+  double lastX = null;
+  double lastY = null;
+  double growX = 0.0;
+  double growY = 0.0;
+  double swipeSize = 0.0;
+
+  void handlePointer(PointerEvent event) {
+    if (event.type == 'pointermove') {
+      growX = clamp(min: 0.0, value: growX + event.x - lastX);
+      growY = clamp(min: 0.0, value: growY + event.y - lastY);
+      double newWidth = _startingSize.width == null ? null : _startingSize.width + growX;
+      double newHeight = _startingSize.height == null ? null : _startingSize.height + growY;
+      configure(_src, newWidth, newHeight);
+      markNeedsLayout();
+    }
+    lastX = event.x;
+    lastY = event.y;
+  }
+}
+
+AppView app;
+RenderDecoratedBox root;
+
+void main() {
+  RenderFlex flexRoot = new RenderFlex(direction: FlexDirection.Vertical);
+
+  root = new RenderDecoratedBox(
+    decoration: new BoxDecoration(backgroundColor: 0xFF333333),
+    child: flexRoot
+  );
+
+  void addFlexChildSolidColor(RenderFlex parent, int backgroundColor, { int flex: 0 }) {
+    RenderSolidColor child = new RenderSolidColor(backgroundColor);
+    parent.add(child);
+    child.parentData.flex = flex;
+  }
+
+  // Yellow bar at top
+  addFlexChildSolidColor(flexRoot, 0xFFFFFF00, flex: 1);
+
+  var row = new RenderFlex(direction: FlexDirection.Horizontal);
+
+  // Purple cell
+  addFlexChildSolidColor(row, 0xFF0000FF, flex: 1);
+
+  // Resizeable image
+  RenderImage image1 = new RenderImageResizable("https://www.dartlang.org/logos/dart-logo.png", 100.0, 100.0);
+  row.add(new RenderPadding(const EdgeDims(10.0, 10.0, 10.0, 10.0), image1));
+
+  // The internet is a beautiful place.  https://baconipsum.com/
+  String meatyString = """Bacon ipsum dolor amet ham fatback tri-tip, prosciutto
+porchetta bacon kevin meatball meatloaf pig beef ribs chicken. Brisket ribeye
+andouille leberkas capicola meatloaf. Chicken pig ball tip pork picanha bresaola
+alcatra. Pork pork belly alcatra, flank chuck drumstick biltong doner jowl.
+Pancetta meatball tongue tenderloin rump tail jowl boudin.""";
+  RenderParagraph paragraph = new RenderParagraph(text: meatyString, color: 0xFF009900);
+  row.add(paragraph);
+  paragraph.parentData.flex = 2;
+
+  var decoratedRow = new RenderDecoratedBox(
+    decoration: new BoxDecoration(backgroundColor: 0xFFFFFFFF),
+    child: row
+  );
+
+  flexRoot.add(decoratedRow);
+  decoratedRow.parentData.flex = 3;
+  app = new AppView(root);
+}