flutter wrap组件 写的搜索记录
import 'dart:core';
import 'package:flutter/material.dart';
// 使用换行 显示搜索记录
class WarpPage extends StatelessWidget {
final List<String> tags = [
"肯德基",
"小哥哥你的东西掉了",
"小姐姐好漂亮啊",
"这个东西是啥",
"哈哈哈",
"好困啊",
"今天好运",
"明天好运来",
"今年快结束了",
"我累啊",
"你写的什么代码",
"多多多"
];
// 定义一个数组
List<Widget> _items(BuildContext context) {
// 定义一个用于存放组件的数组
List<Widget> list = List<Widget>();
tags.forEach((tag) {
// 定义子组件
Widget container = Container(
height: 25.0,
margin: EdgeInsets.symmetric(vertical: 5, horizontal: 5),
decoration: BoxDecoration(
border:
Border.all(color: Colors.blueAccent.withAlpha(60), width: 1.0),
borderRadius: BorderRadius.all(Radius.circular(30))),
child: Container(
margin: EdgeInsets.all(5),
child: Text(
// 字体的内容
tag,
// 字体居中显示
textAlign:TextAlign.center,
// 字体的样式
style: TextStyle(fontSize:10.0,color:Colors.black38),
),
),
);
list.add(container);
});
return list;
}
@override
Widget build(BuildContext context) {
return MaterialApp(
title: '搜索记录',
home: Scaffold(
appBar:AppBar(
title:Text("搜索记录")
),
body:Container(
child:Wrap(
children: _items(context),
)
)
),
);
}
}
遇到的坑就是 必须要用MaterialApp包住Scaffold 要不然就报错