颤振定位过渡到其他堆栈子级下方 - 如何获得高度?



我正在做一个背景样式向下滑动,类似于这里的Codelabs颤振示例。我希望前景部分停在背景内容的底部。

我知道在布局之前无法直接获得高度。由于应用程序从顶部的前景部分开始,我想我可以在构建后获得高度并将其存储在状态中,但我不确定如何做到这一点。

这就是我现在所拥有的,只是使用预定义的"悬垂",不考虑背景内容高度:

Widget _buildForeground(BuildContext context, BoxConstraints constraints) {
Animation<RelativeRect> rectAnimation = new RelativeRectTween(
begin: new RelativeRect.fromLTRB(0.0, constraints.maxHeight - widget.overhang, 0.0, 0.0),
end: new RelativeRect.fromLTRB(0.0, 0.0, 0.0, 0.0),
).animate(_controller);
return new PositionedTransition(
rect: rectAnimation,
child: new Material(
shape: RoundedRectangleBorder(borderRadius: new BorderRadius.only(topLeft: new Radius.circular(15.0), topRight: new Radius.circular(15.0))),
elevation: 16.0,
child: widget.foreground,
)
);
}
@override
Widget build(BuildContext context) {
return new LayoutBuilder(
builder: (context, constraints) => new Stack(
children: <Widget>[
new Container(color: Theme.of(context).primaryColor,),
widget.background,
_buildForeground(context, constraints),
],
),
);
}

感谢Remi,我想出了使用GlobalKey的解决方案

void _toggleForeground() {
setState(() => top = backgroundKey?.currentContext?.size?.height);
_controller.fling(velocity: _isBackgroundVisible ? -widget.toggleVelocity : widget.toggleVelocity);
}
Widget _buildForeground() {
if (top == null) top = 500.0;
Animation<RelativeRect> rectAnimation = new RelativeRectTween(
begin: new RelativeRect.fromLTRB(0.0, top, 0.0, 0.0),
end: new RelativeRect.fromLTRB(0.0, 0.0, 0.0, 0.0),
).animate(_controller);
return new PositionedTransition(
rect: rectAnimation,
child: new Material(
shape: RoundedRectangleBorder(borderRadius: new BorderRadius.only(topLeft: new Radius.circular(15.0), topRight: new Radius.circular(15.0))),
elevation: 16.0,
child: widget.foreground,
)
);
}
@override
Widget build(BuildContext context) {
return new Stack(
children: <Widget>[
new Container(color: Theme.of(context).primaryColor),
new Column(
key: backgroundKey,
mainAxisSize: MainAxisSize.min,
children: <Widget>[widget.background],
),
_buildForeground(),
],
);
}

最新更新