From 46e47cf011ec2feb3bbdac33fe49b0cd5201a5ec Mon Sep 17 00:00:00 2001 From: Hixie Date: Thu, 28 May 2015 15:19:36 -0700 Subject: [PATCH] Make RenderParagraph mutable, and make it fit the new RenderNode protocols R=abarth@chromium.org, eseidel@chromium.org Review URL: https://codereview.chromium.org/1165463002 --- examples/raw/render_paragraph.dart | 29 +++++----- examples/raw/sector-layout.dart | 2 + examples/raw/simple_render_tree.dart | 87 ++++++++++++++++++++++++++++ 3 files changed, 105 insertions(+), 13 deletions(-) create mode 100644 examples/raw/simple_render_tree.dart diff --git a/examples/raw/render_paragraph.dart b/examples/raw/render_paragraph.dart index f2e444d4a80..6c20d91db37 100644 --- a/examples/raw/render_paragraph.dart +++ b/examples/raw/render_paragraph.dart @@ -7,22 +7,19 @@ import 'package:sky/framework/app.dart'; import 'package:sky/framework/layout2.dart'; class RenderSolidColor extends RenderDecoratedBox { - final double desiredHeight; - final double desiredWidth; + final Size desiredSize; final int backgroundColor; - RenderSolidColor(int backgroundColor, { this.desiredHeight: double.INFINITY, - this.desiredWidth: double.INFINITY }) + RenderSolidColor(int backgroundColor, { this.desiredSize: const Size.infinite() }) : backgroundColor = backgroundColor, - super(new BoxDecoration(backgroundColor: backgroundColor)); + super(decoration: new BoxDecoration(backgroundColor: backgroundColor)); Size getIntrinsicDimensions(BoxConstraints constraints) { return constraints.constrain(new Size(desiredWidth, desiredHeight)); } void performLayout() { - width = constraints.constrainWidth(desiredWidth); - height = constraints.constrainHeight(desiredHeight); + size = constraints.constrain(desiredSize); } void handlePointer(PointerEvent event) { @@ -36,12 +33,15 @@ class RenderSolidColor extends RenderDecoratedBox { AppView app; void main() { - var root = new RenderFlex( - direction: FlexDirection.Vertical, - decoration: new BoxDecoration(backgroundColor: 0xFF000000)); + RenderFlex flexRoot = new RenderFlex(direction: FlexDirection.Vertical); + + RenderNode root = new RenderDecoratedBox( + decoration: new BoxDecoration(backgroundColor: 0xFF606060), + child: flexRoot + ); RenderNode child = new RenderSolidColor(0xFFFFFF00); - root.add(child); + flexRoot.add(child); child.parentData.flex = 2; // The internet is a beautiful place. https://baconipsum.com/ @@ -51,8 +51,11 @@ 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."""; - child = new RenderParagraph(meatyString); - root.add(child); + child = new RenderDecoratedBox( + decoration: new BoxDecoration(backgroundColor: 0xFFFFFFFF), + child: new RenderParagraph(text: meatyString, color: 0xFF009900) + ); + flexRoot.add(child); child.parentData.flex = 1; app = new AppView(root); diff --git a/examples/raw/sector-layout.dart b/examples/raw/sector-layout.dart index ae8b43fdf69..c4c4627aba9 100644 --- a/examples/raw/sector-layout.dart +++ b/examples/raw/sector-layout.dart @@ -416,7 +416,9 @@ class RenderBoxToRenderSectorAdapter extends RenderBox { } else { assert(child is RenderSector); assert(!constraints.isInfinite); + print("constraint maxes: ${constraints.maxWidth} and ${constraints.maxHeight}"); double maxChildDeltaRadius = math.min(constraints.maxWidth, constraints.maxHeight) / 2.0 - innerRadius; + print("maxChildDeltaRadius = $maxChildDeltaRadius"); assert(child.parentData is SectorParentData); child.parentData.radius = innerRadius; child.parentData.theta = 0.0; diff --git a/examples/raw/simple_render_tree.dart b/examples/raw/simple_render_tree.dart new file mode 100644 index 00000000000..58d4e934e2e --- /dev/null +++ b/examples/raw/simple_render_tree.dart @@ -0,0 +1,87 @@ +// 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' as sky; +import 'package:sky/framework/app.dart'; +import 'package:sky/framework/layout2.dart'; + +class RenderSolidColor extends RenderDecoratedBox { + final sky.Size desiredSize; + final int backgroundColor; + + RenderSolidColor(int backgroundColor, { this.desiredSize: const sky.Size.infinite() }) + : backgroundColor = backgroundColor, + super(decoration: new BoxDecoration(backgroundColor: backgroundColor)) { + } + + BoxDimensions getIntrinsicDimensions(BoxConstraints constraints) { + return new BoxDimensions.withConstraints(constraints, + width: desiredSize.width, + height: desiredSize.height); + } + + void performLayout() { + size = constraints.constrain(desiredSize); + } + + void handlePointer(sky.PointerEvent event) { + if (event.type == 'pointerdown') + decoration = new BoxDecoration(backgroundColor: 0xFFFF0000); + else if (event.type == 'pointerup') + decoration = new BoxDecoration(backgroundColor: backgroundColor); + } +} + +AppView app; + +void main() { + RenderFlex flexRoot = new RenderFlex(direction: FlexDirection.Vertical); + + RenderNode root = new RenderDecoratedBox( + decoration: new BoxDecoration(backgroundColor: 0xFF000000), + child: flexRoot + ); + + void addFlexChildSolidColor(RenderFlex parent, int backgroundColor, { int flex: 0 }) { + RenderNode child = new RenderSolidColor(backgroundColor); + parent.add(child); + child.parentData.flex = flex; + } + + // Yellow bar at top + addFlexChildSolidColor(flexRoot, 0xFFFFFF00, flex: 1); + + // Turquoise box + flexRoot.add(new RenderSolidColor(0x7700FFFF, desiredSize: new sky.Size(100.0, 100.0))); + + // Green and cyan render block with padding + var renderBlock = new RenderBlock(); + + renderBlock.add(new RenderSolidColor(0xFF00FF00, desiredSize: new sky.Size(100.0, 50.0))); + renderBlock.add(new RenderSolidColor(0x7700FFFF, desiredSize: new sky.Size(50.0, 100.0))); + + var renderDecoratedBlock = new RenderDecoratedBox( + decoration: new BoxDecoration(backgroundColor: 0xFFFFFFFF), + child: renderBlock + ); + + flexRoot.add(new RenderPadding(const EdgeDims(10.0, 10.0, 10.0, 10.0), renderDecoratedBlock)); + + var row = new RenderFlex(direction: FlexDirection.Horizontal); + + // Purple and blue cells + addFlexChildSolidColor(row, 0x77FF00FF, flex: 1); + addFlexChildSolidColor(row, 0xFF0000FF, flex: 2); + + var decoratedRow = new RenderDecoratedBox( + decoration: new BoxDecoration(backgroundColor: 0xFF333333), + child: row + ); + + flexRoot.add(decoratedRow); + decoratedRow.parentData.flex = 3; + + app = new AppView(root); + +}