滚动时如何隐藏顶部的应用程序栏

Question

当我们尝试从正文向上滚动时如何隐藏应用栏。我有自定义应用栏，当我尝试从正文滚动时，我想隐藏应用栏。我尝试了很多，但都没有成功。

Scaffold(
  appBar: PreferredSize(
      child: ClipPath(
        clipper: CustomAppBar(),
        child: Container(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              Text(
                ' Bike Guru',
                style: GoogleFonts.caveatBrush(
                  fontSize: 40,
                  color: Colors.black,
                  fontWeight: FontWeight.bold,
                ),
              ),
            ],
          ),
        ),
      ),
      preferredSize: Size.fromHeight(kToolbarHeight + 150))

Answer 1

试试这个对我有用

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: NestedScrollView(
        headerSliverBuilder: (context, innerBoxIsScrolled) {
          return <Widget>[
            SliverAppBar(
              backgroundColor: Colors.transparent,
              title: Center(
                child: PreferredSize(
                    child: ClipPath(
                      clipper: CustomAppBar(),
                      child: Container(
                        width: MediaQuery.of(context).size.width,
                        height: 60,
                        child: Column(
                          mainAxisAlignment: MainAxisAlignment.center,
                          children: <Widget>[
                            Text(
                              ' Bike Guru',
                            ),
                          ],
                        ),
                      ),
                    ),
                    preferredSize: Size.fromHeight(kToolbarHeight + 150)),
              ),
              floating: false,
              pinned: false,
            ),
          ];
        },
        body: Center(
          child: Text("Sample Text"), // Actual body content
        ),
      ),
    );
  }