【发布时间】：2020-09-07 12:20:09
【问题描述】：
我正在尝试在列内展开容器，但是当我尝试使用展开的小部件时，它会溢出屏幕。如何在不溢出屏幕的情况下展开中间容器？
Column(
// mainAxisSize: MainAxisSize.,
// padding: EdgeInsets.all(10),
// shrinkWrap: true,
children: <Widget>[
_PlayingGameAppBar(
onZero: () => zerar(),
time: time,
),
Padding(
padding: EdgeInsets.all(10),
child: Column(
mainAxisSize: MainAxisSize.min,
children: <Widget>[
Container(
width: double.infinity,
// height: double.infinity,
decoration: BoxDecoration(
color: Colors.grey[400],
borderRadius: BorderRadius.circular(10),
),
child: Padding(
padding: EdgeInsets.only(
top: 8, bottom: 8, left: 4, right: 4),
child: Center(
child: Text(
widget.theme.name,
style: TextStyle(
fontWeight: FontWeight.bold,
color: Colors.black45,
fontSize: 18,
),
),
),
),
),
SizedBox(height: 7),
Container( /// I want to expand this container, to make it fill the avaiable space
// constraints: BoxConstraints(minHeight: 100),
constraints: BoxConstraints.loose(Size.fromHeight(100)),
// height: double.infinity,
decoration: BoxDecoration(
color: Colors.grey[400],
borderRadius: BorderRadius.circular(10),
),
child: ListView.builder(
shrinkWrap: true,
physics: NeverScrollableScrollPhysics(),
itemCount: answers.length,
itemBuilder: (context, index) {
ThemeAnswer answer = answers[index];
return Center(
child: AnswerTile(
answer: answer.answer,
points: answer.points,
direction: AnswerDirection.left,
alignment: AnswerTileAlignment.LEFT,
padding: EdgeInsets.only(left: 10),
),
);
},
),
),
SizedBox(height: 10),
Container(
height: 50,
decoration: BoxDecoration(
color: Colors.grey[400],
borderRadius: BorderRadius.circular(10),
),
child: Padding(
padding: EdgeInsets.only(left: 10, right: 5),
child: TextFormField(
controller: _answerController,
onChanged: (text) =>
setState(() => this.text = text),
decoration: InputDecoration(
border: InputBorder.none,
hintText: loc.answerInputHint,
suffixIcon: Opacity(
opacity: text.isEmpty ? 0.4 : 1,
child: AbsorbPointer(
absorbing: text.isEmpty,
child: IconButton(
icon: Icon(Icons.add, color: Colors.black),
onPressed: () => onSend,
tooltip: loc.add,
),
),
),
),
),
),
),
],
),
),
],
),
我尝试使用 Expanded 小部件、Flexible 小部件、IntrinsicHeight 小部件进行扩展并使用 MediaQuery 进行定义，但它没有展开
【问题讨论】：
-
列垂直对齐其子级，并且对大小透视没有任何限制。它只会按原样布置孩子。如果您尝试使用展开到可用垂直空间的东西（例如，包装在 Expanded 中的 Container 小部件）作为子项，则会出现错误。你打算在那个 Container 中保存什么样的信息？你试过给它一定的尺寸吗？您可以使用 MediaQuery.of(context).size 来实现响应。