[英]How to set dynamic height for Container Widget in flutter?
I have text widget inside of container and if text is more than 4 lines this is overflowing to bottom of container.我在容器内有文本小部件,如果文本超过 4 行,则会溢出到容器底部。 How can I set dynamic height for this container that will depends of text lines and avoid bottom overflow ?如何为此容器设置取决于文本行并避免底部溢出的动态高度? At the moment container have fixed value but if I remove this value it will disappear.目前容器具有固定值,但如果我删除此值,它将消失。
home component
Widget build(BuildContext context) {
return Container (
child: SliverToBoxAdapter(
child: Container(
height: 180,
margin: EdgeInsets.only(top: 10),
child: CustomeInfoWidget(
infoData: _infoDataList,
),
),
),
)
}
CustomeInfoWidget
Widget build(BuildContext context) {
final double _width = MediaQuery.of(context).size.width;
return Container(
margin: EdgeInsets.only(top: 15, left: 15, right: 15),
child: Stack(
children: [
PageView.builder(
itemCount: widget._infoDataList.length,
controller: _pageController,
itemBuilder: (BuildContext context, int index) {
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Container(
width: _width - 10,
child: Padding(
padding: const EdgeInsets.only(bottom: 10),
child: Text(widget._infoDataList[index].title,
textAlign: TextAlign.left,
),
Container(
child: Text(
widget._infoDataList[index].content,
),
)
],
);
},
),
],
),
);
}
使用 Singlechildscrollview 包装容器或为 Text 小部件设置溢出Flutter - 在溢出时包装文本,例如插入省略号或淡入淡出
On your home component, you are fixing the height of CustomeInfoWidget
.在您的 home 组件上,您正在修复CustomeInfoWidget
的高度。 You can remove this.您可以删除它。
SliverToBoxAdapter(
child: Container(
// height: 180,// remove this
margin: EdgeInsets.only(top: 10),
child: CustomeInfoWidget(
You can use SliverFillRemaining
for PageView
.您可以将SliverFillRemaining
用于PageView
。
SliverFillRemaining(
child: PageView.builder(
Or you can wrap your text container with Singlechildscrollview
for inner scroll.或者,您可以使用Singlechildscrollview
包装您的文本容器以进行内部滚动。
You can also calculate the text height and provide it.您还可以计算文本高度并提供它。
How can I get the size of the Text widget in Flutter如何在 Flutter 中获取 Text 小部件的大小
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.