flutter - Flutter SingledChildScrollView>堆栈>定位为滚动上的故障

Question

我正在使用SingleChildScrollView作为其第一个元素的Stack。 Stack包含两个容器。第二个使用bottom: 0.0定位在Positioned。

我高度简化了对本文的观点，使其仅关注此问题。当我缓慢滚动时，您会看到白色容器正在“闪烁”，并且您看到的一行是堆栈中第一个子容器的底部。

这是 View :



向下滚动时不会发生这种情况，我不知道为什么会出现这样的故障:



View :

return Container(color: Colors.white, child: SingleChildScrollView(child: Column(
  mainAxisAlignment: MainAxisAlignment.start,
  children: [
    HeaderComponent(),
    Container(height: 600, width: MediaQuery.of(context).size.width)
  ]
)));

header 组件

class _HeaderComponentState extends State<HeaderComponent> {
  @override
  Widget build(BuildContext context) {
    return Stack(
      children: [
        Container(height: 245.0, width: MediaQuery.of(context).size.width, color: Colors.red),
        Positioned(bottom: 0.0, child: Container(height: 40.0, width: 
           MediaQuery.of(context).size.width, color: Colors.white)),
      ],
    );
  }
}

Answer 1

如果是这样，只需在第一个 child 处添加底部填充0.2。

class HeaderComponent extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Stack(
      children: [
        Container(
            height: 245.0,
            padding: EdgeInsets.only(bottom: 0.2),
            width: MediaQuery.of(context).size.width,
            color: Colors.red),
        Positioned(
            bottom: 0.0,
            child: Container(
                height: 40.0,
                width: MediaQuery.of(context).size.width,
                color: Colors.white)),
      ],
    );
  }
}