8 Column布局和Row布局的使用
1.源代码
import 'package:flutter/material.dart';
void main () => runApp(MyApp());
class MyApp extends StatefulWidget {
@override
_MyAppState createState() => _MyAppState();
}
class _MyAppState extends State<MyApp> {
GlobalKey globalKey = new GlobalKey<FormState>();
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
body: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Column(
children: <Widget>[
Text("我是Column布局"),
Text("我是Column布局"),
Text("我是Column布局"),
Text("我是Column布局"),
Text("我是Column布局"),
],
),
Row(
children: <Widget>[
Text("我是Row布局"),
Text("我是Row布局"),
Text("我是Row布局"),
Text("我是Row布局"),
],
)
]
),
)
);
}
}
2.解释源代码
import 'package:flutter/material.dart';
void main () => runApp(MyApp());
class MyApp extends StatefulWidget {
@override
_MyAppState createState() => _MyAppState();
}
class _MyAppState extends State<MyApp> {
GlobalKey globalKey = new GlobalKey<FormState>();
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
body: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Column(
children: <Widget>[
Text("我是Column布局"),
Text("我是Column布局"),
Text("我是Column布局"),
Text("我是Column布局"),
Text("我是Column布局"),
],
),
Row(
children: <Widget>[
Text("我是Row布局"),
Text("我是Row布局"),
Text("我是Row布局"),
Text("我是Row布局"),
],
)
]
),
)
);
}
}
3.效果图
![效果图](https://img-blog.csdnimg.cn/20190627131412888.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MzI2NjA5MA==,size_16,color_FFFFFF,t_70)