Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(1330)

Unified Diff: sky/examples/raw/justify_content.dart

Issue 1164363002: Sky support for flexbox justify content (Closed) Base URL: git@github.com:domokit/mojo.git@master
Patch Set: merge Created 5 years, 6 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View side-by-side diff with in-line comments
Download patch
« no previous file with comments | « sky/examples/lib/solid_color_box.dart ('k') | sky/sdk/lib/framework/components2/ink_well.dart » ('j') | no next file with comments »
Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
Index: sky/examples/raw/justify_content.dart
diff --git a/sky/examples/raw/justify_content.dart b/sky/examples/raw/justify_content.dart
new file mode 100644
index 0000000000000000000000000000000000000000..9d37b547f983439fda70f50cd0da884a018c988a
--- /dev/null
+++ b/sky/examples/raw/justify_content.dart
@@ -0,0 +1,46 @@
+// 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' as math;
+import 'package:sky/framework/app.dart';
+import 'package:sky/framework/rendering/box.dart';
+import 'package:sky/framework/rendering/block.dart';
+import 'package:sky/framework/rendering/flex.dart';
+import 'package:sky/framework/rendering/object.dart';
+import 'package:sky/framework/rendering/paragraph.dart';
+import '../lib/solid_color_box.dart';
+
+AppView app;
+
+// Attempts to draw
+// http://www.w3.org/TR/2015/WD-css-flexbox-1-20150514/images/flex-pack.svg
+void main() {
+ var table = new RenderFlex(direction: FlexDirection.vertical);
+
+ void addRow(FlexJustifyContent justify) {
+ RenderParagraph paragraph = new RenderParagraph(text: "${justify}");
+ table.add(new RenderPadding(child: paragraph, padding: new EdgeDims.only(top: 20.0)));
+ var row = new RenderFlex(direction: FlexDirection.horizontal);
+ row.add(new RenderSolidColorBox(const Color(0xFFFFCCCC), desiredSize: new Size(80.0, 60.0)));
+ row.add(new RenderSolidColorBox(const Color(0xFFCCFFCC), desiredSize: new Size(64.0, 60.0)));
+ row.add(new RenderSolidColorBox(const Color(0xFFCCCCFF), desiredSize: new Size(160.0, 60.0)));
+ row.justifyContent = justify;
+ table.add(row);
+ row.parentData.flex = 1;
+ }
+
+ addRow(FlexJustifyContent.flexStart);
+ addRow(FlexJustifyContent.flexEnd);
+ addRow(FlexJustifyContent.center);
+ addRow(FlexJustifyContent.spaceBetween);
+ addRow(FlexJustifyContent.spaceAround);
+
+ RenderDecoratedBox root = new RenderDecoratedBox(
+ decoration: new BoxDecoration(backgroundColor: const Color(0xFFFFFFFF)),
+ child: new RenderPadding(child: table, padding: new EdgeDims.symmetric(vertical: 50.0))
+ );
+
+ app = new AppView(root);
+}
« no previous file with comments | « sky/examples/lib/solid_color_box.dart ('k') | sky/sdk/lib/framework/components2/ink_well.dart » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698