firka/flutter
firka/flutter
4
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Add the ability to draw a foreground box decoration

Browse Source 
This feature lets you create effects similar to the "outline" property in CSS.
This commit is contained in:
Adam Barth 2015-08-19 09:36:40 -07:00
parent 7786211cac
commit 8f0efd54ff
2 changed files with 27 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
packages/flutter/lib/rendering/proxy_box.dart
View File

@ -434,13 +434,20 @@ class RenderClipOval extends RenderProxyBox {
} }
} }
enum BoxDecorationPosition {
background,
foreground,
}
class RenderDecoratedBox extends RenderProxyBox { class RenderDecoratedBox extends RenderProxyBox {
RenderDecoratedBox({ RenderDecoratedBox({
BoxDecoration decoration, BoxDecoration decoration,
RenderBox child RenderBox child,
this.position: BoxDecorationPosition.background
}) : _painter = new BoxPainter(decoration), super(child); }) : _painter = new BoxPainter(decoration), super(child);
BoxDecorationPosition position;
final BoxPainter _painter; final BoxPainter _painter;
BoxDecoration get decoration => _painter.decoration; BoxDecoration get decoration => _painter.decoration;
@ -483,8 +490,11 @@ class RenderDecoratedBox extends RenderProxyBox {
void paint(PaintingContext context, Offset offset) { void paint(PaintingContext context, Offset offset) {
assert(size.width != null); assert(size.width != null);
assert(size.height != null); assert(size.height != null);
_painter.paint(context.canvas, offset & size); if (position == BoxDecorationPosition.background)
_painter.paint(context.canvas, offset & size);
super.paint(context, offset); super.paint(context, offset);
if (position == BoxDecorationPosition.foreground)
_painter.paint(context.canvas, offset & size);
} }
String debugDescribeSettings(String prefix) => '${super.debugDescribeSettings(prefix)}${prefix}decoration:\n${_painter.decoration.toString(prefix + " ")}\n'; String debugDescribeSettings(String prefix) => '${super.debugDescribeSettings(prefix)}${prefix}decoration:\n${_painter.decoration.toString(prefix + " ")}\n';

18
packages/flutter/lib/widgets/basic.dart
View File

@ -30,7 +30,7 @@ export 'package:sky/rendering/block.dart' show BlockDirection;
export 'package:sky/rendering/box.dart' show BoxConstraints; export 'package:sky/rendering/box.dart' show BoxConstraints;
export 'package:sky/rendering/flex.dart' show FlexDirection, FlexJustifyContent, FlexAlignItems; export 'package:sky/rendering/flex.dart' show FlexDirection, FlexJustifyContent, FlexAlignItems;
export 'package:sky/rendering/object.dart' show Point, Offset, Size, Rect, Color, Paint, Path; export 'package:sky/rendering/object.dart' show Point, Offset, Size, Rect, Color, Paint, Path;
export 'package:sky/rendering/proxy_box.dart' show BackgroundImage, BoxDecoration, BoxShadow, Border, BorderSide, EdgeDims, Shape; export 'package:sky/rendering/proxy_box.dart' show BackgroundImage, BoxDecoration, BoxDecorationPosition, BoxShadow, Border, BorderSide, EdgeDims, Shape;
export 'package:sky/rendering/toggleable.dart' show ValueChanged; export 'package:sky/rendering/toggleable.dart' show ValueChanged;
export 'package:sky/rendering/viewport.dart' show ScrollDirection; export 'package:sky/rendering/viewport.dart' show ScrollDirection;
export 'package:sky/widgets/framework.dart' show Key, GlobalKey, Widget, Component, StatefulComponent, App, runApp, Listener, ParentDataNode; export 'package:sky/widgets/framework.dart' show Key, GlobalKey, Widget, Component, StatefulComponent, App, runApp, Listener, ParentDataNode;
@ -70,17 +70,19 @@ class ColorFilter extends OneChildRenderObjectWrapper {
} }
class DecoratedBox extends OneChildRenderObjectWrapper { class DecoratedBox extends OneChildRenderObjectWrapper {
DecoratedBox({ Key key, this.decoration, Widget child }) DecoratedBox({ Key key, this.decoration, this.position, Widget child })
: super(key: key, child: child); : super(key: key, child: child);
final BoxDecoration decoration; final BoxDecoration decoration;
final BoxDecorationPosition position;
RenderDecoratedBox createNode() => new RenderDecoratedBox(decoration: decoration); RenderDecoratedBox createNode() => new RenderDecoratedBox(decoration: decoration, position: position);
RenderDecoratedBox get renderObject => super.renderObject; RenderDecoratedBox get renderObject => super.renderObject;
void syncRenderObject(DecoratedBox old) { void syncRenderObject(DecoratedBox old) {
super.syncRenderObject(old); super.syncRenderObject(old);
renderObject.decoration = decoration; renderObject.decoration = decoration;
renderObject.position = position;
} }
} }
@ -327,6 +329,7 @@ class Container extends Component {
this.child, this.child,
this.constraints, this.constraints,
this.decoration, this.decoration,
this.foregroundDecoration,
this.width, this.width,
this.height, this.height,
this.margin, this.margin,
@ -337,6 +340,7 @@ class Container extends Component {
final Widget child; final Widget child;
final BoxConstraints constraints; final BoxConstraints constraints;
final BoxDecoration decoration; final BoxDecoration decoration;
final BoxDecoration foregroundDecoration;
final EdgeDims margin; final EdgeDims margin;
final EdgeDims padding; final EdgeDims padding;
final Matrix4 transform; final Matrix4 transform;
@ -365,6 +369,14 @@ class Container extends Component {
if (decoration != null) if (decoration != null)
current = new DecoratedBox(decoration: decoration, child: current); current = new DecoratedBox(decoration: decoration, child: current);
if (foregroundDecoration != null) {
current = new DecoratedBox(
decoration: foregroundDecoration,
position: BoxDecorationPosition.foreground,
child: current
);
}
if (width != null || height != null) { if (width != null || height != null) {
current = new SizedBox( current = new SizedBox(
width: width, width: width,