将切换按钮展开为父容器宽度 [英] Expand toggle buttons to parent container width
本文介绍了将切换按钮展开为父容器宽度的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
有没有办法动态将切换按钮扩展到父容器宽度,而无需进行任何硬编码。对于使用MediaQuery上下文的方法,我发现了一个答案,该方法仅适用于全屏宽度。我还尝试将按钮包装在展开的小部件中,但这会引发错误
Is there any way to dynamically expand toggle buttons to parent container width without hard coding anything. I found one answer to that which uses MediaQuery of context which only works well for full screen width. I also tried to wrap the buttons in expanded widget but that throws an error
Container(
width: 150.0, // hardcoded for testing purpose
child: ToggleButtons(
constraints:
BoxConstraints.expand(width: MediaQuery.of(context).size.width), // this doesn't work once inside container unless hard coding it
borderRadius: BorderRadius.circular(5),
children: [
ShapeToggleButton(
text: 'Option1',
),
ShapeToggleButton(
text: 'Option2',
),
],
isSelected: [true, false],
onPressed: (index) {},
),
);
推荐答案
如psink所建议,答案在上面的答案是包装它在LayoutBuilder中
As suggested by psink in comment above answer is to wrap it in LayoutBuilder
Container(
width: 150.0, // hardcoded for testing purpose
child: LayoutBuilder(builder: (context, constraints) {
return ToggleButtons(
renderBorder: false,
constraints:
BoxConstraints.expand(width: constraints.maxWidth / 2), //number 2 is number of toggle buttons
borderRadius: BorderRadius.circular(5),
children: [
Text(
'Option1',
),
Text(
'Option2',
),
],
isSelected: [true, false],
onPressed: (index) {},
);
})))
这篇关于将切换按钮展开为父容器宽度的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文