这是一个具体的例子，需要从另一篇文章中得到案例2和案例3。
How to use the constraints and sizes of other widgets during the build phase
基本继承权--
主[柔性]
儿童1：红色（扩展）
子2:紫色（非扩展，但它服从最小约束）[flex]
------子项1:绿色（非扩展，按预期工作）
------儿童2：黄色（我希望它能填满紫色的剩余空间，但系统不允许我只使用扩展的空间）
目标--
我要黄色的盒子填满紫色盒子里剩余的空间。
注意：小部件的特殊组合不允许我将黄色容器包装在扩展的小部件中。
---------------------我不能使用扩展的原因--
如果我将黄色小部件包装在一个展开的小部件中，它将抛出一个错误…这就是为什么…
在这种情况下，我有两个集装箱在一个集装箱内。
第一个孩子（主要）：红色的那个正在膨胀，所以…
子元素2（主元素）：紫色元素试图收缩包装其子元素并尽可能少地占用空间，但从技术上讲，它没有最大约束（只有最小约束，这就是为什么仍然有一些紫色可见的原因）。
紫色的孩子也是一个弹性体，有两个孩子，因为紫色弹性体试图收缩包装它的孩子，它会告诉它的孩子做同样的事。
（紫色的）孩子1：绿色的容器能做到这一点，而且很好，因为我希望它能做到这一点，但是……
子2（紫色）：我希望黄色容器用其最小宽度参数填充紫色创建的空间。
问题是，黄色容器紫色父级告诉它收缩包装它的子级（如上所述），但是如果我将它包装在一个扩展的小部件中，您将告诉黄色容器扩展，或者换句话说，不要收缩包装它的子级…黄色容器既可以收缩包装，也可以不收缩包装其子容器。
所以你会得到一个错误
所以…
我需要知道紫色容器的计算宽度
然后计算出绿色容器的宽度
那么我的黄色容器的宽度是
黄色。宽度=紫色。宽度-绿色。宽度
代码输出--
this shows the output of the code below
——————————————————————————main.dart———————————————————————————————-
import 'package:flutter/material.dart';
import 'materialSheet.dart';
void main() => runApp(new MyApp());
class MyApp extends StatelessWidget {
final appTitle = 'Material Sheets Demo';
@override
Widget build(BuildContext context) {
return new MaterialApp(
theme: ThemeData.dark(),
home: new MaterialSheet(
app: new Text("kill \n\n me plz"),
sheet: new Icon(Icons.keyboard),
attachment: new Icon(Icons.attachment),
position: sheetPosition.right,
placement: attachmentPlacement.inside,
sheetMin: 125.0,
),
);
}
}
——————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————-
import 'package:flutter/material.dart';
//-------------------------Enumerations-------------------------
enum sheetPosition { top, right, bottom, left }
enum sheetType { modal, persistent }
enum attachmentPlacement { inside, outside }
class MaterialSheet extends StatelessWidget {
//-------------------------Parameters-------------------------
final Widget app;
final Widget sheet;
final Widget attachment;
final sheetPosition position;
final sheetType type; //TODO add in the scrim behind the thing
final attachmentPlacement placement;
final double sheetMin; //TODO
final double sheetMax; //TODO
final double percentBeforeOpen; //TODO
final bool autoOpenIndicator; //TODO
final double percentBeforeClose; //TODO
final bool autoCloseIndicator; //TODO
final bool vertiScroll; //TODO
final bool horiScroll; //TODO
final bool swipeToOpen; //TODO
final bool swipeToClose; //TODO
MaterialSheet(
{@required this.app,
@required this.sheet,
this.attachment,
this.position: sheetPosition.bottom,
this.type: sheetType.modal,
this.placement: attachmentPlacement.inside,
this.sheetMin,
this.sheetMax,
this.percentBeforeOpen: .5,
this.autoOpenIndicator: true,
this.percentBeforeClose: .5,
this.autoCloseIndicator: true,
this.vertiScroll: false,
this.horiScroll: false,
this.swipeToOpen: true,
this.swipeToClose: true});
//-------------------------Helper Code-------------------------k
BoxConstraints _calcBoxConstraints(bool fullWidth) {
if (sheetMin == null && sheetMax == null)
return new BoxConstraints();
else {
if (sheetMin != null && sheetMax != null) {
if (fullWidth) //we only care for height
return new BoxConstraints(
minHeight: sheetMin,
maxHeight: sheetMax,
);
else //we only care for width
return new BoxConstraints(minWidth: sheetMin, maxWidth: sheetMax);
} else {
if (sheetMin != null) {
//we only have min
if (fullWidth) //we only care for height
return new BoxConstraints(minHeight: sheetMin);
else //we only care for width
return new BoxConstraints(minWidth: sheetMin);
} else {
//we only have max
if (fullWidth) //we only care for h`eight
return new BoxConstraints(maxHeight: sheetMax);
else //we only care for width
return new BoxConstraints(maxWidth: sheetMax);
}
}
}
}
//-------------------------Actual Code-------------------------
@override
Widget build(BuildContext context) {
bool isWidthMax =
(position == sheetPosition.bottom || position == sheetPosition.top);
//-----Create the Widgets and Initially calculate Sizes
print("before test");
Scaffold testScaff = theSheet(isWidthMax, context);
print("after test");
//-----Apply Size constraints as needed
Align testAl = new Align();
return new Stack(
children: <Widget>[
//---------------Contains your Application
new Scaffold(
backgroundColor: Colors.green,
body: app,
),
//---------------Contains the Sheet
theSheet(isWidthMax, context),
],
);
}
Scaffold theSheet(bool isWidthMax, BuildContext context) {
Scaffold generatedScaffold = genScaff(isWidthMax);
EdgeInsetsGeometry padCheck = (((generatedScaffold.body as Flex).children[0] as Flexible).child as Container).padding;
print("value " + padCheck.toString());
return generatedScaffold;
}
Scaffold genScaff(bool isWidthMax) {
return new Scaffold(
body: new Flex(
direction: (isWidthMax) ? Axis.vertical : Axis.horizontal,
//ONLY relevant if position is top or bottom
textDirection: (position == sheetPosition.right)
? TextDirection.ltr
: TextDirection.rtl,
//ONLY relevant if position is left or right
verticalDirection: (position == sheetPosition.top)
? VerticalDirection.up
: VerticalDirection.down,
crossAxisAlignment: CrossAxisAlignment.stretch,
mainAxisSize: MainAxisSize.min,
children: <Widget>[
new Flexible(
fit: FlexFit.loose,
child: new Container(
padding: EdgeInsets.all(18.3),
color: Colors.red,
)),
new ConstrainedBox(
constraints: _calcBoxConstraints(isWidthMax),
child: new Container(
color: Colors.purple,
child: new Flex(
direction: (isWidthMax) ? Axis.vertical : Axis.horizontal,
//ONLY relevant if position is top or bottom
textDirection: (position == sheetPosition.right)
? (placement == attachmentPlacement.inside)
? TextDirection.rtl
: TextDirection.ltr
: (placement == attachmentPlacement.inside)
? TextDirection.ltr
: TextDirection.rtl,
//ONLY relevant if position is left or right
verticalDirection: (position == sheetPosition.top)
? (placement == attachmentPlacement.inside)
? VerticalDirection.down
: VerticalDirection.up
: (placement == attachmentPlacement.inside)
? VerticalDirection.up
: VerticalDirection.down,
crossAxisAlignment: CrossAxisAlignment.stretch,
mainAxisAlignment: MainAxisAlignment.end,
mainAxisSize: MainAxisSize.min,
children: <Widget>[
new Container(
color: Colors.amberAccent,
child: sheet,
),
new Flexible(
fit: FlexFit.loose,
child: new Container(
color: Colors.greenAccent,
child: (attachment != null) ? attachment : null,
),
),
],
),
),
),
],
),
);
}
}
最佳答案
您需要将内部的Row包装成一个IntrinsicWidth来强制执行它，以根据内容尽可能少地占用空间。
多亏了这一点，您现在可以将该行的子级包装到Expanded中，而无需进行异常处理。
new Row(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: <Widget>[
new Expanded(
child: new Container(
color: Colors.red,
),
),
new ConstrainedBox(
constraints: new BoxConstraints(minWidth: 100.0),
child: new Container(
color: Colors.purple,
child: new IntrinsicWidth(
child: new Row(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: <Widget>[
new Container(
color: Colors.cyan,
child: new Icon(Icons.title),
),
new Expanded(
child: new Container(
color: Colors.yellow,
alignment: Alignment.center,
child: new Icon(Icons.theaters)),
),
],
),
),
),
),
],
),
关于flutter - 如何让黄色容器扩展并填充其紫色 parent 可用的其余空间，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/50786772/