[英]Flutter How to Display a List of Widgets in a Container
So in my app, I am building a list of widgets, which is basically just a container with text in it. 因此,在我的应用中,我正在构建一个小部件列表,该列表基本上只是一个包含文本的容器。 I am doing this for a variety of reasons, but basically here is where I am having the problem.
我这样做有多种原因,但基本上这是我遇到问题的地方。
I can view this list in a ListView.Builder, but I do not want to view them that way. 我可以在ListView.Builder中查看此列表,但是我不想那样查看它们。 I want to be able to view them in a container.
我希望能够在容器中查看它们。 Then wrap down the container as items get added.
然后在添加项目时包装好容器。
Below is a mock up of what I am trying to do. 以下是我正在尝试做的模拟。
Right now my page looks like this. 现在我的页面看起来像这样。
body: Column(children: <Widget>[
Expanded(
flex: 3,
child: Container(
width: MediaQuery.of(context).size.width*0.8,
child: Row(
children: <Widget>[
Expanded(
child: ListView.builder(
itemCount: hashList.length,
itemBuilder: (context, index){
return Container(
child: hashList[index],
);
}),
)
],
),
),
),
Expanded(
flex: 6,
child: Container(
color: Colors.black,
child: ListView.builder(
itemCount: snapshot.length,
itemBuilder: (context, index) {
return Tag(
callback: (list) => setState(() => hashList = list),
tag: snapshot[index].data["title"],
list: hashList,
id: index,
);
},
)
))]),
And the Tag Widget adds to the list with the following. Tag Widget将添加以下内容。
void _handleOnPressed() {
setState(() {
isSelected = !isSelected;
isSelected
? _animationController.forward()
: _animationController.reverse();
isSelected ? widget.list.add(
Container(
padding: EdgeInsets.all(10),
height: 45,
child: Text(widget.tag, style: TextStyle(color: Color(0xffff9900), fontSize: 20, fontFamily: 'Dokyo'),),
decoration: BoxDecoration(
border: Border.all(color: Color(0xffff9900),),
borderRadius: BorderRadius.circular(10))
)): widget.list.removeAt(widget.id);
});
}
}
Adding the list to a listview, I can do, but it is not the desired affect. 我可以将列表添加到列表视图中,但这不是所需的效果。
I have no clue how to do what I am looking for and I am completely lost. 我不知道该怎么做,我完全迷路了。
Try and add shrinkWrap to the ListView Builder 尝试将rinkleWrap添加到ListView Builder
child: ListView.builder(shrinkWrap:true, <-- this
.... # then continue your logic
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.