Remove "RenderBlock" class from examples that use it without giving it unrestricted height.

R=abarth@chromium.org

Review URL: https://codereview.chromium.org/1232063006 .
This commit is contained in:
Hixie 2015-07-10 16:31:27 -07:00
parent 09a82d4935
commit 56ef46312f
8 changed files with 144 additions and 139 deletions

View File

@ -5,8 +5,8 @@
import 'dart:sky' as sky;
import 'package:sky/painting/text_style.dart';
import 'package:sky/rendering/block.dart';
import 'package:sky/rendering/box.dart';
import 'package:sky/rendering/flex.dart';
import 'package:sky/rendering/object.dart';
import 'package:sky/rendering/paragraph.dart';
import 'package:sky/rendering/sky_binding.dart';
@ -67,12 +67,15 @@ RenderBox getBox(double lh) {
}
void main() {
RenderBox root = new RenderBlock(children: [
new RenderConstrainedBox(
additionalConstraints: new BoxConstraints.tightFor(height: 50.0)
),
getBox(1.0),
getBox(null),
]);
RenderBox root = new RenderFlex(children: [
new RenderConstrainedBox(
additionalConstraints: new BoxConstraints.tightFor(height: 50.0)
),
getBox(1.0),
getBox(null),
],
direction: FlexDirection.vertical,
alignItems: FlexAlignItems.stretch
);
new SkyBinding(root: root);
}

View File

@ -0,0 +1,93 @@
// 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/rendering/box.dart';
import 'package:sky/rendering/flex.dart';
import 'package:sky/rendering/sky_binding.dart';
class RenderSolidColor extends RenderDecoratedBox {
final sky.Size desiredSize;
final sky.Color backgroundColor;
RenderSolidColor(sky.Color backgroundColor, { this.desiredSize: sky.Size.infinite })
: backgroundColor = backgroundColor,
super(decoration: new BoxDecoration(backgroundColor: backgroundColor)) {
}
double getMinIntrinsicWidth(BoxConstraints constraints) {
return constraints.constrainWidth(desiredSize.width);
}
double getMaxIntrinsicWidth(BoxConstraints constraints) {
return constraints.constrainWidth(desiredSize.width);
}
double getMinIntrinsicHeight(BoxConstraints constraints) {
return constraints.constrainHeight(desiredSize.height);
}
double getMaxIntrinsicHeight(BoxConstraints constraints) {
return constraints.constrainHeight(desiredSize.height);
}
void performLayout() {
size = constraints.constrain(desiredSize);
}
void handleEvent(sky.Event event, BoxHitTestEntry entry) {
if (event.type == 'pointerdown')
decoration = new BoxDecoration(backgroundColor: const sky.Color(0xFFFF0000));
else if (event.type == 'pointerup')
decoration = new BoxDecoration(backgroundColor: backgroundColor);
}
}
RenderBox buildFlexExample() {
RenderFlex flexRoot = new RenderFlex(direction: FlexDirection.vertical);
RenderDecoratedBox root = new RenderDecoratedBox(
decoration: new BoxDecoration(backgroundColor: const sky.Color(0xFF000000)),
child: flexRoot
);
void addFlexChildSolidColor(RenderFlex parent, sky.Color backgroundColor, { int flex: 0 }) {
RenderSolidColor child = new RenderSolidColor(backgroundColor);
parent.add(child);
child.parentData.flex = flex;
}
// Yellow bar at top
addFlexChildSolidColor(flexRoot, const sky.Color(0xFFFFFF00), flex: 1);
// Turquoise box
flexRoot.add(new RenderSolidColor(const sky.Color(0x7700FFFF), desiredSize: new sky.Size(100.0, 100.0)));
var renderDecoratedBlock = new RenderDecoratedBox(
decoration: new BoxDecoration(backgroundColor: const sky.Color(0xFFFFFFFF))
);
flexRoot.add(new RenderPadding(padding: const EdgeDims.all(10.0), child: renderDecoratedBlock));
var row = new RenderFlex(direction: FlexDirection.horizontal);
// Purple and blue cells
addFlexChildSolidColor(row, const sky.Color(0x77FF00FF), flex: 1);
addFlexChildSolidColor(row, const sky.Color(0xFF0000FF), flex: 2);
var decoratedRow = new RenderDecoratedBox(
decoration: new BoxDecoration(backgroundColor: const sky.Color(0xFF333333)),
child: row
);
flexRoot.add(decoratedRow);
decoratedRow.parentData.flex = 3;
return root;
}
void main() {
new SkyBinding(root: buildFlexExample());
}

View File

@ -5,7 +5,7 @@ PAINT FOR FRAME #1 ----------------------------------------------
1 | paintChild RenderDecoratedBox at Point(0.0, 0.0)
1 | | TestPaintingCanvas() constructor: 800.0 x 600.0
1 | | drawRect(Rect.fromLTRB(0.0, 0.0, 800.0, 600.0), Paint(color:Color(0xff0000ff)))
1 | | paintChild RenderBlock at Point(0.0, 0.0)
1 | | paintChild RenderFlex at Point(0.0, 0.0)
1 | | | TestPaintingCanvas() constructor: 800.0 x 600.0
1 | | | paintChild RenderPadding at Point(0.0, 0.0)
1 | | | | TestPaintingCanvas() constructor: 800.0 x 600.0

View File

@ -1,17 +1,17 @@
import 'dart:math' as math;
import 'dart:sky' as sky;
import 'package:sky/rendering/block.dart';
import 'package:sky/rendering/box.dart';
import 'package:sky/rendering/flex.dart';
import 'package:sky/rendering/object.dart';
import '../resources/display_list.dart';
void main() {
var size = new RenderConstrainedBox(additionalConstraints: new BoxConstraints().applyHeight(100.0));
var inner = new RenderDecoratedBox(decoration: new BoxDecoration(backgroundColor: const sky.Color(0xFF00FF00)), child: size);
var padding = new RenderPadding(padding: new EdgeDims.all(50.0), child: inner);
var block = new RenderBlock(children: [padding]);
var outer = new RenderDecoratedBox(decoration: new BoxDecoration(backgroundColor: const sky.Color(0xFF0000FF)), child: block);
RenderBox size = new RenderConstrainedBox(additionalConstraints: new BoxConstraints().applyHeight(100.0));
RenderBox inner = new RenderDecoratedBox(decoration: new BoxDecoration(backgroundColor: const sky.Color(0xFF00FF00)), child: size);
RenderBox padding = new RenderPadding(padding: new EdgeDims.all(50.0), child: inner);
RenderBox flex = new RenderFlex(children: [padding], direction: FlexDirection.vertical, alignItems: FlexAlignItems.stretch);
RenderBox outer = new RenderDecoratedBox(decoration: new BoxDecoration(backgroundColor: const sky.Color(0xFF0000FF)), child: flex);
new TestRenderView(outer).endTest();
}

View File

@ -10,34 +10,26 @@ PAINT FOR FRAME #1 ----------------------------------------------
1 | | | TestPaintingCanvas() constructor: 800.0 x 600.0
1 | | | paintChild RenderSolidColor at Point(0.0, 0.0)
1 | | | | TestPaintingCanvas() constructor: 800.0 x 600.0
1 | | | | drawRect(Rect.fromLTRB(0.0, 0.0, 800.0, 82.5), Paint(color:Color(0xffffff00)))
1 | | | paintChild RenderSolidColor at Point(350.0, 82.5)
1 | | | | drawRect(Rect.fromLTRB(0.0, 0.0, 800.0, 120.0), Paint(color:Color(0xffffff00)))
1 | | | paintChild RenderSolidColor at Point(350.0, 120.0)
1 | | | | TestPaintingCanvas() constructor: 800.0 x 600.0
1 | | | | drawRect(Rect.fromLTRB(350.0, 82.5, 450.0, 182.5), Paint(color:Color(0x7700ffff)))
1 | | | paintChild RenderPadding at Point(0.0, 182.5)
1 | | | | drawRect(Rect.fromLTRB(350.0, 120.0, 450.0, 220.0), Paint(color:Color(0x7700ffff)))
1 | | | paintChild RenderPadding at Point(390.0, 220.0)
1 | | | | TestPaintingCanvas() constructor: 800.0 x 600.0
1 | | | | paintChild RenderDecoratedBox at Point(10.0, 192.5)
1 | | | | paintChild RenderDecoratedBox at Point(400.0, 230.0)
1 | | | | | TestPaintingCanvas() constructor: 800.0 x 600.0
1 | | | | | drawRect(Rect.fromLTRB(10.0, 192.5, 790.0, 342.5), Paint(color:Color(0xffffffff)))
1 | | | | | paintChild RenderBlock at Point(10.0, 192.5)
1 | | | | | | TestPaintingCanvas() constructor: 800.0 x 600.0
1 | | | | | | paintChild RenderSolidColor at Point(10.0, 192.5)
1 | | | | | | | TestPaintingCanvas() constructor: 800.0 x 600.0
1 | | | | | | | drawRect(Rect.fromLTRB(10.0, 192.5, 790.0, 242.5), Paint(color:Color(0xff00ff00)))
1 | | | | | | paintChild RenderSolidColor at Point(10.0, 242.5)
1 | | | | | | | TestPaintingCanvas() constructor: 800.0 x 600.0
1 | | | | | | | drawRect(Rect.fromLTRB(10.0, 242.5, 790.0, 342.5), Paint(color:Color(0x7700ffff)))
1 | | | paintChild RenderDecoratedBox at Point(0.0, 352.5)
1 | | | | | drawRect(Rect.fromLTRB(400.0, 230.0, 400.0, 230.0), Paint(color:Color(0xffffffff)))
1 | | | paintChild RenderDecoratedBox at Point(0.0, 240.0)
1 | | | | TestPaintingCanvas() constructor: 800.0 x 600.0
1 | | | | drawRect(Rect.fromLTRB(0.0, 352.5, 800.0, 600.0), Paint(color:Color(0xff333333)))
1 | | | | paintChild RenderFlex at Point(0.0, 352.5)
1 | | | | drawRect(Rect.fromLTRB(0.0, 240.0, 800.0, 600.0), Paint(color:Color(0xff333333)))
1 | | | | paintChild RenderFlex at Point(0.0, 240.0)
1 | | | | | TestPaintingCanvas() constructor: 800.0 x 600.0
1 | | | | | paintChild RenderSolidColor at Point(0.0, 352.5)
1 | | | | | paintChild RenderSolidColor at Point(0.0, 240.0)
1 | | | | | | TestPaintingCanvas() constructor: 800.0 x 600.0
1 | | | | | | drawRect(Rect.fromLTRB(0.0, 352.5, 266.6666564941406, 600.0), Paint(color:Color(0x77ff00ff)))
1 | | | | | paintChild RenderSolidColor at Point(266.6666666666667, 352.5)
1 | | | | | | drawRect(Rect.fromLTRB(0.0, 240.0, 266.6666564941406, 600.0), Paint(color:Color(0x77ff00ff)))
1 | | | | | paintChild RenderSolidColor at Point(266.6666666666667, 240.0)
1 | | | | | | TestPaintingCanvas() constructor: 800.0 x 600.0
1 | | | | | | drawRect(Rect.fromLTRB(266.6666564941406, 352.5, 800.0, 600.0), Paint(color:Color(0xff0000ff)))
1 | | | | | | drawRect(Rect.fromLTRB(266.6666564941406, 240.0, 800.0, 600.0), Paint(color:Color(0xff0000ff)))
------------------------------------------------------------------------
CONSOLE: PASS: should flex
CONSOLE:

View File

@ -4,106 +4,20 @@
import 'dart:sky' as sky;
import 'package:sky/rendering/block.dart';
import 'package:sky/rendering/box.dart';
import 'package:sky/rendering/flex.dart';
import '../../sdk/example/rendering/flex.dart';
import '../resources/display_list.dart';
import '../resources/third_party/unittest/unittest.dart';
import '../resources/unit.dart';
class RenderSolidColor extends RenderDecoratedBox {
final sky.Size desiredSize;
final sky.Color backgroundColor;
RenderSolidColor(sky.Color backgroundColor, { this.desiredSize: sky.Size.infinite })
: backgroundColor = backgroundColor,
super(decoration: new BoxDecoration(backgroundColor: backgroundColor)) {
}
double getMinIntrinsicWidth(BoxConstraints constraints) {
return constraints.constrainWidth(desiredSize.width);
}
double getMaxIntrinsicWidth(BoxConstraints constraints) {
return constraints.constrainWidth(desiredSize.width);
}
double getMinIntrinsicHeight(BoxConstraints constraints) {
return constraints.constrainHeight(desiredSize.height);
}
double getMaxIntrinsicHeight(BoxConstraints constraints) {
return constraints.constrainHeight(desiredSize.height);
}
void performLayout() {
size = constraints.constrain(desiredSize);
}
void handleEvent(sky.Event event, BoxHitTestEntry entry) {
if (event.type == 'pointerdown')
decoration = new BoxDecoration(backgroundColor: const sky.Color(0xFFFF0000));
else if (event.type == 'pointerup')
decoration = new BoxDecoration(backgroundColor: backgroundColor);
}
}
void main() {
initUnit();
test("should flex", () {
RenderFlex flexRoot = new RenderFlex(direction: FlexDirection.vertical);
RenderDecoratedBox root = new RenderDecoratedBox(
decoration: new BoxDecoration(backgroundColor: const sky.Color(0xFF000000)),
child: flexRoot
);
void addFlexChildSolidColor(RenderFlex parent, sky.Color backgroundColor, { int flex: 0 }) {
RenderSolidColor child = new RenderSolidColor(backgroundColor);
parent.add(child);
child.parentData.flex = flex;
}
// Yellow bar at top
addFlexChildSolidColor(flexRoot, const sky.Color(0xFFFFFF00), flex: 1);
// Turquoise box
flexRoot.add(new RenderSolidColor(const sky.Color(0x7700FFFF), desiredSize: new sky.Size(100.0, 100.0)));
// Green and cyan render block with padding
var renderBlock = new RenderBlock();
renderBlock.add(new RenderSolidColor(const sky.Color(0xFF00FF00), desiredSize: new sky.Size(100.0, 50.0)));
renderBlock.add(new RenderSolidColor(const sky.Color(0x7700FFFF), desiredSize: new sky.Size(50.0, 100.0)));
var renderDecoratedBlock = new RenderDecoratedBox(
decoration: new BoxDecoration(backgroundColor: const sky.Color(0xFFFFFFFF)),
child: renderBlock
);
flexRoot.add(new RenderPadding(padding: const EdgeDims.all(10.0), child: renderDecoratedBlock));
var row = new RenderFlex(direction: FlexDirection.horizontal);
// Purple and blue cells
addFlexChildSolidColor(row, const sky.Color(0x77FF00FF), flex: 1);
addFlexChildSolidColor(row, const sky.Color(0xFF0000FF), flex: 2);
var decoratedRow = new RenderDecoratedBox(
decoration: new BoxDecoration(backgroundColor: const sky.Color(0xFF333333)),
child: row
);
flexRoot.add(decoratedRow);
decoratedRow.parentData.flex = 3;
RenderBox root = buildFlexExample();
new TestRenderView(root);
expect(root.size.width, equals(sky.view.width));
expect(root.size.height, equals(sky.view.height));
expect(renderBlock.size.width, equals(sky.view.width - 20.0));
});
}

View File

@ -6,7 +6,7 @@ PAINT FOR FRAME #1 ----------------------------------------------
CONSOLE:
PAINT FOR FRAME #2 ----------------------------------------------
2 | TestPaintingCanvas() constructor: 800.0 x 600.0
2 | paintChild RenderBlock at Point(0.0, 0.0)
2 | paintChild RenderFlex at Point(0.0, 0.0)
2 | | TestPaintingCanvas() constructor: 800.0 x 600.0
2 | | paintChild RenderConstrainedBox at Point(0.0, 0.0)
2 | | | TestPaintingCanvas() constructor: 800.0 x 600.0
@ -68,7 +68,7 @@ PAINT FOR FRAME #2 ----------------------------------------------
CONSOLE:
PAINT FOR FRAME #3 ----------------------------------------------
3 | TestPaintingCanvas() constructor: 800.0 x 600.0
3 | paintChild RenderBlock at Point(0.0, 0.0)
3 | paintChild RenderFlex at Point(0.0, 0.0)
3 | | TestPaintingCanvas() constructor: 800.0 x 600.0
3 | | paintChild RenderConstrainedBox at Point(0.0, 0.0)
3 | | | TestPaintingCanvas() constructor: 800.0 x 600.0
@ -130,7 +130,7 @@ PAINT FOR FRAME #3 ----------------------------------------------
CONSOLE:
PAINT FOR FRAME #4 ----------------------------------------------
4 | TestPaintingCanvas() constructor: 800.0 x 600.0
4 | paintChild RenderBlock at Point(0.0, 0.0)
4 | paintChild RenderFlex at Point(0.0, 0.0)
4 | | TestPaintingCanvas() constructor: 800.0 x 600.0
4 | | paintChild RenderConstrainedBox at Point(0.0, 0.0)
4 | | | TestPaintingCanvas() constructor: 800.0 x 600.0

View File

@ -64,18 +64,21 @@ class FiddleApp extends App {
}
Widget build() {
return new Block([
new SizedBox(
key: 'flex-example',
height: 250.0,
child: arbitrarySetting ? buildFlex1() : buildFlex2()
),
new SizedBox(
key: 'stack-example',
height: 250.0,
child: arbitrarySetting ? buildStack1() : buildStack2()
)
]);
return new Flex([
new SizedBox(
key: 'flex-example',
height: 250.0,
child: arbitrarySetting ? buildFlex1() : buildFlex2()
),
new SizedBox(
key: 'stack-example',
height: 250.0,
child: arbitrarySetting ? buildStack1() : buildStack2()
)
],
direction: FlexDirection.vertical,
alignItems: FlexAlignItems.stretch
);
}
}