问题描述
我有两节课。
- CustomParentWidget
- CustomChildWidget(如果加载和 CentralisedAssetLoader id 加载则显示 CircularProgressIndicator)
现在我需要在渲染 CustomChildWidget 后更改我的 CustomParentWidget 高度.. 它是通过添加
来实现的WidgetsBinding.instance
.addPostFrameCallback((_) => calculateMaxOptionHeight());
在 CustomParentWidget 的 initState..
这里的问题是 CustomParentWidget 仅获取 CircularProgressIndicator 的高度.. 由于 CustomChildWidget 首先返回 CircularProgressIndicator, CustomParentWidget 的 addPostFrameCallBack 认为 ChildWidget 已经被渲染并设置了 Height 为 parent ..
但是当 CentralisedAssetLoader 也被渲染时,我需要再次调用 addPostFrameCallBack。
class CustomParentWidget extends StatefulWidget {
CustomParentWidget();
@override
_CustomParentWidgetState createState() =>
_CustomParentWidgetState();
}
class _CustomParentWidgetState
extends State<CustomParentWidget> {
double widgetHeight;
@override
initState() {
//calling the calculate Function after the Layout is Rendered
WidgetsBinding.instance
.addPostFrameCallback((_) => calculateMaxOptionHeight());
super.initState();
}
void calculateWidgetHeight() {
setState(){
widgetHeight = getWidgetHeight();
}
}
@override
Widget build(BuildContext context) {
return Container(
child: CustomChildWidget(height: widgetHeight),);
}
}
class CustomChildWidget extends StatefulWidget {
CustomChildWidget({this.height});
@override
_CustomChildWidgetState createState() => _CustomChildWidgetState();
}
class _CustomChildWidgetState extends State<CustomChildWidget> {
double height;
double width;
bool isLoaded;
@override
void initState() {
isLoaded = false;
prepareData();
super.initState();
}
void prepareData() async {
try {
height = getheight();
width = getwidth();
} catch (error) {}
setState(() {
height = height;
width = width;
isLoaded = true;
});
}
@override
Widget build(BuildContext context) {
final screenMaxWidth = MediaQuery.of(context).size.width;
if (!isLoaded) {
return CircularProgressIndicator();
}
return Container(
width: min(screenMaxWidth,width),height: height,child: CentralisedAssetLoader(
fit: BoxFit.contain,assetIdentifier: assetIdentifier,),);
}
}
解决方法
您确实在与快速高性能小部件布局的粒度背道而驰。请参阅 https://flutter.dev/docs/development/ui/layout/constraints 中有关布局的基础知识。
但是,如果您真的不介意放慢速度,您可以使用 package:boxy (https://pub.dev/packages/boxy) 编写非常灵活的自定义布局。