From 1e858ac113f61a2943a458f4bf121e28edb8e487 Mon Sep 17 00:00:00 2001 From: toly <1981462002@qq.com> Date: Mon, 21 Feb 2022 09:53:04 +0800 Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=20Flex=20=E7=BB=84=E4=BB=B6?= =?UTF-8?q?=E6=A1=88=E4=BE=8B?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Flex/node1_direction.dart | 33 ++++++++++++++----- .../Flex/node2_mainAxisAlignment.dart | 32 ++++++++++++++---- .../Flex/node3_crossAxisAlignment.dart | 32 ++++++++++++++---- .../Flex/node4_verticalDirection.dart | 32 ++++++++++++++---- .../Flex/node5_textDirection.dart | 32 ++++++++++++++---- 5 files changed, 125 insertions(+), 36 deletions(-) diff --git a/lib/widget_system/widgets/MultiChildRenderObjectWidget/Flex/node1_direction.dart b/lib/widget_system/widgets/MultiChildRenderObjectWidget/Flex/node1_direction.dart index 6745f7d1..e7207150 100644 --- a/lib/widget_system/widgets/MultiChildRenderObjectWidget/Flex/node1_direction.dart +++ b/lib/widget_system/widgets/MultiChildRenderObjectWidget/Flex/node1_direction.dart @@ -13,23 +13,40 @@ import 'package:flutter/material.dart'; // "【direction】 : 方向 【Axis】", // } class DirectionFlex extends StatelessWidget { + static TextStyle textStyle = + TextStyle(color: Colors.white, fontWeight: FontWeight.bold); - final redBox= Container( - color: Colors.red, - height: 30, - width: 40, - ); - - final blueBox= Container( + final blueBox = Container( + alignment: Alignment.center, color: Colors.blue, height: 20, width: 30, + child: Text( + '1', + style: textStyle, + ), + ); + + final redBox = Container( + alignment: Alignment.center, + color: Colors.red, + height: 30, + width: 40, + child: Text( + '2', + style: textStyle, + ), ); - final greenBox= Container( + final greenBox = Container( + alignment: Alignment.center, color: Colors.green, height: 20, width: 20, + child: Text( + '3', + style: textStyle, + ), ); @override diff --git a/lib/widget_system/widgets/MultiChildRenderObjectWidget/Flex/node2_mainAxisAlignment.dart b/lib/widget_system/widgets/MultiChildRenderObjectWidget/Flex/node2_mainAxisAlignment.dart index 94e1f130..318855b1 100644 --- a/lib/widget_system/widgets/MultiChildRenderObjectWidget/Flex/node2_mainAxisAlignment.dart +++ b/lib/widget_system/widgets/MultiChildRenderObjectWidget/Flex/node2_mainAxisAlignment.dart @@ -13,22 +13,40 @@ import 'package:flutter/material.dart'; // } class MainAxisAlignmentFlex extends StatelessWidget { - final redBox= Container( - color: Colors.red, - height: 30, - width: 40, - ); + static TextStyle textStyle = + TextStyle(color: Colors.white, fontWeight: FontWeight.bold); - final blueBox= Container( + final blueBox = Container( + alignment: Alignment.center, color: Colors.blue, height: 20, width: 30, + child: Text( + '1', + style: textStyle, + ), + ); + + final redBox = Container( + alignment: Alignment.center, + color: Colors.red, + height: 30, + width: 40, + child: Text( + '2', + style: textStyle, + ), ); - final greenBox= Container( + final greenBox = Container( + alignment: Alignment.center, color: Colors.green, height: 20, width: 20, + child: Text( + '3', + style: textStyle, + ), ); @override diff --git a/lib/widget_system/widgets/MultiChildRenderObjectWidget/Flex/node3_crossAxisAlignment.dart b/lib/widget_system/widgets/MultiChildRenderObjectWidget/Flex/node3_crossAxisAlignment.dart index e5570db8..3c62757e 100644 --- a/lib/widget_system/widgets/MultiChildRenderObjectWidget/Flex/node3_crossAxisAlignment.dart +++ b/lib/widget_system/widgets/MultiChildRenderObjectWidget/Flex/node3_crossAxisAlignment.dart @@ -13,22 +13,40 @@ import 'package:flutter/material.dart'; // } class CrossAxisAlignmentFlex extends StatelessWidget { - final redBox= Container( - color: Colors.red, - height: 30, - width: 40, - ); + static TextStyle textStyle = + TextStyle(color: Colors.white, fontWeight: FontWeight.bold); - final blueBox= Container( + final blueBox = Container( + alignment: Alignment.center, color: Colors.blue, height: 20, width: 30, + child: Text( + '1', + style: textStyle, + ), + ); + + final redBox = Container( + alignment: Alignment.center, + color: Colors.red, + height: 30, + width: 40, + child: Text( + '2', + style: textStyle, + ), ); - final greenBox= Container( + final greenBox = Container( + alignment: Alignment.center, color: Colors.green, height: 20, width: 20, + child: Text( + '3', + style: textStyle, + ), ); @override diff --git a/lib/widget_system/widgets/MultiChildRenderObjectWidget/Flex/node4_verticalDirection.dart b/lib/widget_system/widgets/MultiChildRenderObjectWidget/Flex/node4_verticalDirection.dart index 2a6f4f68..3365bd17 100644 --- a/lib/widget_system/widgets/MultiChildRenderObjectWidget/Flex/node4_verticalDirection.dart +++ b/lib/widget_system/widgets/MultiChildRenderObjectWidget/Flex/node4_verticalDirection.dart @@ -13,22 +13,40 @@ import 'package:flutter/material.dart'; // } class VerticalDirectionFlex extends StatelessWidget { - final redBox= Container( - color: Colors.red, - height: 30, - width: 40, - ); + static TextStyle textStyle = + TextStyle(color: Colors.white, fontWeight: FontWeight.bold); - final blueBox= Container( + final blueBox = Container( + alignment: Alignment.center, color: Colors.blue, height: 20, width: 30, + child: Text( + '1', + style: textStyle, + ), + ); + + final redBox = Container( + alignment: Alignment.center, + color: Colors.red, + height: 30, + width: 40, + child: Text( + '2', + style: textStyle, + ), ); - final greenBox= Container( + final greenBox = Container( + alignment: Alignment.center, color: Colors.green, height: 20, width: 20, + child: Text( + '3', + style: textStyle, + ), ); @override diff --git a/lib/widget_system/widgets/MultiChildRenderObjectWidget/Flex/node5_textDirection.dart b/lib/widget_system/widgets/MultiChildRenderObjectWidget/Flex/node5_textDirection.dart index d5c1a77b..5f2cac69 100644 --- a/lib/widget_system/widgets/MultiChildRenderObjectWidget/Flex/node5_textDirection.dart +++ b/lib/widget_system/widgets/MultiChildRenderObjectWidget/Flex/node5_textDirection.dart @@ -13,22 +13,40 @@ import 'package:flutter/material.dart'; // } class TextDirectionFlex extends StatelessWidget { - final redBox= Container( - color: Colors.red, - height: 30, - width: 40, - ); + static TextStyle textStyle = + TextStyle(color: Colors.white, fontWeight: FontWeight.bold); - final blueBox= Container( + final blueBox = Container( + alignment: Alignment.center, color: Colors.blue, height: 20, width: 30, + child: Text( + '1', + style: textStyle, + ), + ); + + final redBox = Container( + alignment: Alignment.center, + color: Colors.red, + height: 30, + width: 40, + child: Text( + '2', + style: textStyle, + ), ); - final greenBox= Container( + final greenBox = Container( + alignment: Alignment.center, color: Colors.green, height: 20, width: 20, + child: Text( + '3', + style: textStyle, + ), ); @override