Flutter自动换行和两列布局,Android开发面试基础
在Flutter中实现自动换行和两列布局,可以使用Wrap
小部件。Wrap
是一个可以包含其子项并可以在必要时自动换行的小部件。以下是一个简单的例子:
import 'package:flutter/material.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
body: Center(
child: Wrap(
spacing: 8.0, // 主轴方向上的间距
runSpacing: 4.0, // 交叉轴方向上的间距
children: <Widget>[
Chip(label: Text('Chip 1')),
Chip(label: Text('Chip 2')),
Chip(label: Text('Chip 3')),
// ... 更多的Chip小部件
],
),
),
),
);
}
}
在这个例子中,Wrap
小部件负责处理子项的布局,并在必要时自动换行。spacing
属性定义了子项之间的间距,而runSpacing
属性定义了每一行之间的间距。Chip
小部件是一个常用的用于表示数据片段的小部件,但你可以替换为任何你需要的子Widget。
评论已关闭