Overlap of slivers

128 views Asked by At

I have a problem with SliverPersistentHeaders. I have CustomScroll with CupertinoSliverNavigationBar and custom SliverPersistentHeader, with SearchTextField and button. My custom SliverPersistentHeader is floating. But when i scrolling back, it's staying behind the NavigationBar. What's wrong? How to implement this layout correctly?

This is initial state

initstate

This is overlap. My custom bar under the NavigationBar

overlap

My code here:

It's page layout

class GeneralBalancesScreenLayout extends StatelessWidget {
  const GeneralBalancesScreenLayout({super.key});

  @override
  Widget build(BuildContext context) {
    return CustomScrollView(slivers: [
      //----------------------------------------------------------------------
      //NavigationBar
      //----------------------------------------------------------------------
      const PlatformWidget(
        defaultWidget: SizedBox.shrink(),
        iosWidget: IosSliverNavigationBar(),
      ),

      const PlatformWidget(
          defaultWidget: SizedBox.shrink(), iosWidget: IosSearchBar()),

      SliverList(
          delegate: SliverChildBuilderDelegate(
              (_, index) => const Center(child: Text("-----"))))
    ]);
  }
}

It's custom bar

class IosSearchBar extends StatelessWidget {
  const IosSearchBar({super.key});

  @override
  Widget build(BuildContext context) {
    return SliverPersistentHeader(
      floating: true,
      delegate: GenericSliverHeader(
          maxExtend: 55,
          minExtend: 55,
          backgroundColor:
              CupertinoTheme.of(context).barBackgroundColor.withOpacity(1),
          body: Stack(
            fit: StackFit.expand,
            children: [
              Container(
                  color: CupertinoTheme.of(context).scaffoldBackgroundColor),
              Align(
                alignment: Alignment.bottomCenter,
                child: Row(
                  children: [
                    const Expanded(
                        child: Padding(
                      padding: EdgeInsets.fromLTRB(15, 0, 0, 0),
                      child: CupertinoSearchTextField(),
                    )),
                    CupertinoButton(
                        child: const Text('Добавить'), onPressed: () {})
                  ],
                ),
              )
            ],
          )),
    );
  }
}
0

There are 0 answers