CustomScrollView中的SliverPersistentHeader在滚动时会变成其他条的下方(显示为.gif图像)。有什么问题以及如何解决?

问题描述 投票:0回答:1

我在CustomScrollView中有一个SliverPersistentHeader小部件。当我滚动它时,它变成了其他条的下方。

enter image description here

[...]
child: Scaffold(
            body: CustomScrollView(
              scrollDirection: Axis.vertical,
              shrinkWrap: true,
              slivers: [
                SliverPersistentHeader(
                  delegate: SliverAppBar(expandedHeight: 200),
  pinned: true,
                  );
                _activeScreen(), // This returns a SliverList that contains a Form
              ],
            ),
            bottomNavigationBar: [...]

class SliverAppBar extends SliverPersistentHeaderDelegate {
  final double expandedHeight;

  SliverAppBar({@required this.expandedHeight});

  @override
  Widget build(
      BuildContext context, double shrinkOffset, bool overlapsContent) {
    return Stack(
      fit: StackFit.expand,
      overflow: Overflow.visible,
      children: [
        Container(
          decoration: BoxDecoration(
            gradient: LinearGradient(
              colors: [
                Colors.black,
                primaryColor,
              ],
            ),
            boxShadow: [
              BoxShadow(
                  color: Colors.black26,
                  offset: Offset(0, 0),
                  blurRadius: 5.0,
                  spreadRadius: 5.0),
            ],
          ),
        ),
        Center(
          child: Text(
            "Sort By Your Taste",
            style: TextStyle(
              fontFamily: 'Modak',
              letterSpacing: 1,
              color: Colors.white,
              fontWeight: FontWeight.w100,
              fontSize: (MediaQuery.of(context).size.width / 10) -
                  ((shrinkOffset < expandedHeight - 50
                          ? shrinkOffset
                          : expandedHeight - 50) /
                      10),
            ),
          ),
        ),
        Positioned(
            [...] // Code for that (c) detail
        ),
      ],
    );
  }

这怎么了?我认为这可能与Stack小部件有关,但是我没有找到可以修复它的任何属性。

请帮助我,如何解决?

flutter flutter-layout
1个回答
0
投票

所有问题都是由于将该rinkWrapWrap属性设置为true。

[...]
child: Scaffold(
            body: CustomScrollView(
              scrollDirection: Axis.vertical,
              shrinkWrap: true, // <-- Here
[...]

我不记得为什么将它设置为true ...但这就是问题所在,我花了很长时间才注意到那是问题所在。

© www.soinside.com 2019 - 2024. All rights reserved.