gpt4 book ai didi

flutter 布局 : render two widgets side by side

转载 作者:行者123 更新时间:2023-12-02 19:08:11 26 4
gpt4 key购买 nike

我正在尝试创建一个简单的布局,在同一行中插入 2 个小部件,为此我使用了一行,但我收到了这些错误:

The following assertion was thrown during performLayout():BoxConstraints forces an infinite width. These invalid constraintswere provided to RenderSemanticsAnnotations's layout() function by thefollowing function, which probably computed the invalid constraints inquestion: RenderConstrainedBox.performLayout The offending constraintswere: BoxConstraints(w=Infinity, 50.0<=h<=Infinity)

但是如果我只渲染小部件而不使用 Row 小部件,一切都会按应有的方式呈现。

class CardWithTitle extends StatelessWidget {
const CardWithTitle({Key key, this.title, this.child}) : super(key: key);

final String title;
final child;

@override
Widget build(BuildContext context) {
return Container(
child: Column(
children: [
Row(
children: [
Text(title),
],
),
Container(
width: double.infinity,
constraints: BoxConstraints(minHeight: 50),
child: Card(
child: Padding(
padding: EdgeInsets.all(10.0),
child: child,
),
),
)
],
),
);
}
}

class SellsCard extends StatelessWidget {
SellsCard({Key key}) : super(key: key);

@override
Widget build(BuildContext context) {
return Padding(
padding: EdgeInsets.all(10.0),
child: CardWithTitle(
title: 'Sells',
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
'Total',
),
Text(
'\$ 96.500,54'
),
Text(
'Lorem ipsum dolor'
)
],
),
),
);
}
}

class HomePage extends StatefulWidget {
HomePage({Key key}) : super(key: key);

@override
_HomeState createState() => _HomeState();
}

class _HomeState extends State<HomePage> {
String _username;
String _title;
String _usernameAbbr;

@override
Widget build(BuildContext context) {
_username = 'James';
_title = 'Some title';
_usernameAbbr = _username[0].toUpperCase();

return Scaffold(
appBar: AppBar(
title: Text(_title),
elevation: 0,
actions: [
Padding(
padding: EdgeInsets.all(20.0),
child: GestureDetector(
onTap: () {},
child: CircleAvatar(
backgroundColor: Theme.of(context).backgroundColor,
radius: 10.0,
child: FittedBox(
fit: BoxFit.fitWidth,
child: Text(_usernameAbbr),
),
),
))
],
),
body: SingleChildScrollView(
child: Column(
mainAxisAlignment: MainAxisAlignment.start,
children: [
SellsCard(), // <-- this is working
SellsCard(), // <-- this is working
Row(children: [SellsCard(), SellsCard()]) // <-- This is throwing the errors
],
),
),
);
}
}

这是我要创建的布局结构:

enter image description here

任何关于我做错了什么或如何在同一行中得到这两个项目的见解都很棒。

最佳答案

Expanded() 包装你的 Row 的 child :

Row(
children: [
Expanded(
child: SellsCard(),
),
Expanded(
child: SellsCard(),
),
]
)

关于 flutter 布局 : render two widgets side by side,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/64743585/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com