update layout widget demo

demo/4. Flutter布局Widget介绍/flutter_layout_demo/lib/main.dart

@@ -1,9 +1,13 @@
 import 'package:flutter/material.dart';
 import 'package:flutter_layout_demo/single/AspectRatio.dart';
+import 'package:flutter_layout_demo/single/Baseline.dart';
 import 'package:flutter_layout_demo/single/Center.dart';
 import 'package:flutter_layout_demo/single/ConstrainedBox.dart';
 import 'package:flutter_layout_demo/single/Container.dart';
 import 'package:flutter_layout_demo/single/FittedBox.dart';
+import 'package:flutter_layout_demo/single/FractionallySizedBox.dart';
+import 'package:flutter_layout_demo/single/IntrinsicHeight.dart';
+import 'package:flutter_layout_demo/single/IntrinsicWidth.dart';
 import 'package:flutter_layout_demo/single/Padding.dart';
 import 'package:flutter_layout_demo/single/Align.dart';
 
@@ -60,19 +64,16 @@ class MyApp extends StatelessWidget {
  '/FittedBox': (_) => new LYFittedBox(),
  '/AspectRatio': (_) => new LYAspectRatio(),
  '/ConstrainedBox': (_) => new LYConstrainedBox(),
+ '/Baseline': (_) => new LYBaseline(),
+ '/FractionallySizedBox': (_) => new LYFractionallySizedBox(),
+ '/IntrinsicHeight': (_) => new LYIntrinsicHeight(),
+ '/IntrinsicWidth': (_) => new LYIntrinsicWidth(),
 
- '/Baseline': (_) => new LYPadding(),
- '/FractionallySizedBox': (_) => new LYPadding(),
- '/IntrinsicHeight': (_) => new LYPadding(),
-
- '/IntrinsicWidth': (_) => new LYPadding(),
  '/LimitedBox': (_) => new LYPadding(),
  '/Offstage': (_) => new LYPadding(),
-
  '/OverflowBox': (_) => new LYPadding(),
  '/SizedBox': (_) => new LYPadding(),
  '/SizedOverflowBox': (_) => new LYPadding(),
-
  '/Transform': (_) => new LYPadding(),
  '/CustomSingleChildLayout': (_) => new LYPadding(),
 

demo/4. Flutter布局Widget介绍/flutter_layout_demo/lib/single/Baseline.dart

@@ -0,0 +1,57 @@
+import 'package:flutter/material.dart';
+
+class LYBaseline extends StatelessWidget {
+ const LYBaseline();
+
+ @override
+ Widget build(BuildContext context) {
+ return new Scaffold(
+ appBar: new AppBar(
+ title: new Text("Baseline"),
+ leading: new BackButton(),
+ ),
+ body: new LYBaselineContent(),
+ );
+ }
+}
+
+class LYBaselineContent extends StatelessWidget {
+ @override
+ Widget build(BuildContext context) {
+ return new Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: <Widget>[
+ new Baseline(
+ baseline: 50.0,
+ baselineType: TextBaseline.alphabetic,
+ child: new Text(
+ 'TjTjTj',
+ style: new TextStyle(
+ fontSize: 16.0,
+ textBaseline: TextBaseline.alphabetic,
+ ),
+ ),
+ ),
+ new Baseline(
+ baseline: 50.0,
+ baselineType: TextBaseline.alphabetic,
+ child: new Container(
+ width: 30.0,
+ height: 30.0,
+ color: Colors.red,
+ ),
+ ),
+ new Baseline(
+ baseline: 50.0,
+ baselineType: TextBaseline.alphabetic,
+ child: new Text(
+ 'RyRyRy',
+ style: new TextStyle(
+ fontSize: 35.0,
+ ),
+ ),
+ ),
+ ],
+ );
+ }
+}

demo/4. Flutter布局Widget介绍/flutter_layout_demo/lib/single/FractionallySizedBox.dart

@@ -0,0 +1,38 @@
+import 'package:flutter/material.dart';
+
+class LYFractionallySizedBox extends StatelessWidget {
+ const LYFractionallySizedBox();
+
+ @override
+ Widget build(BuildContext context) {
+ return new Scaffold(
+ appBar: new AppBar(
+ title: new Text("FractionallySizedBox"),
+ leading: new BackButton(),
+ ),
+ body: new LYFractionallySizedBoxContent(),
+ );
+ }
+}
+
+class LYFractionallySizedBoxContent extends StatelessWidget {
+ @override
+ Widget build(BuildContext context) {
+ return new Center(
+ child: new Container(
+ color: Colors.blue,
+ height: 150.0,
+ width: 150.0,
+ padding: const EdgeInsets.all(10.0),
+ child: new FractionallySizedBox(
+ alignment: Alignment.topLeft,
+ widthFactor: 1.5,
+ heightFactor: 0.5,
+ child: new Container(
+ color: Colors.red,
+ ),
+ ),
+ ),
+ );
+ }
+}

demo/4. Flutter布局Widget介绍/flutter_layout_demo/lib/single/IntrinsicHeight.dart

@@ -0,0 +1,32 @@
+import 'package:flutter/material.dart';
+
+class LYIntrinsicHeight extends StatelessWidget {
+ const LYIntrinsicHeight();
+
+ @override
+ Widget build(BuildContext context) {
+ return new Scaffold(
+ appBar: new AppBar(
+ title: new Text("IntrinsicHeight"),
+ leading: new BackButton(),
+ ),
+ body: new LYIntrinsicHeightContent(),
+ );
+ }
+}
+
+class LYIntrinsicHeightContent extends StatelessWidget {
+ @override
+ Widget build(BuildContext context) {
+ return new IntrinsicHeight(
+ child: new Row(
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ children: <Widget>[
+ new Container(color: Colors.blue, width: 100.0),
+ new Container(color: Colors.red, width: 50.0,height: 50.0,),
+ new Container(color: Colors.yellow, width: 150.0),
+ ],
+ ),
+ );
+ }
+}

demo/4. Flutter布局Widget介绍/flutter_layout_demo/lib/single/IntrinsicWidth.dart

@@ -0,0 +1,37 @@
+import 'package:flutter/material.dart';
+
+class LYIntrinsicWidth extends StatelessWidget {
+ const LYIntrinsicWidth();
+
+ @override
+ Widget build(BuildContext context) {
+ return new Scaffold(
+ appBar: new AppBar(
+ title: new Text("IntrinsicWidth"),
+ leading: new BackButton(),
+ ),
+ body: new LYIntrinsicWidthContent(),
+ );
+ }
+}
+
+class LYIntrinsicWidthContent extends StatelessWidget {
+ @override
+ Widget build(BuildContext context) {
+ return new Container(
+ color: Colors.green,
+ padding: const EdgeInsets.all(5.0),
+ child: new IntrinsicWidth(
+ stepHeight: 450.0,
+ stepWidth: 300.0,
+ child: new Column(
+ children: <Widget>[
+ new Container(color: Colors.blue, height: 100.0),
+ new Container(color: Colors.red, width: 150.0, height: 100.0),
+ new Container(color: Colors.yellow, height: 150.0,),
+ ],
+ ),
+ ),
+ );
+ }
+}