flutter - 使用flutter向下滚动时如何隐藏bottomAppBar-6ren

flutter - 使用flutter向下滚动时如何隐藏bottomAppBar

转载作者：行者123 更新时间：2023-12-03 04:46:33

我有一个简单的BottomAppBar作为以下代码:

bottomNavigationBar: BottomAppBar(
        elevation: 0,
        shape: CircularNotchedRectangle(),
        notchMargin: 10,
        child: Container(
          height: 60,
          child: Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: <Widget>[
              Row(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: <Widget>[
                  MaterialButton(
                    padding: EdgeInsets.all(0),
                    minWidth: 155,
                    onPressed: () {
                      setState(() {
                        // currentScreen =
                        //     Chat(); // if user taps on this dashboard tab will be active
                        currentTab = 1;
                      });
                    },
                    child: Column(
                      mainAxisAlignment: MainAxisAlignment.center,
                      children: <Widget>[
                        Icon(
                          Icons.home,
                          color: currentTab == 1 ? Colors.blue : Colors.grey,
                        ),
                        Text(
                          'Home',
                          style: TextStyle(
                            color: currentTab == 1 ? Colors.blue : Colors.grey,
                          ),
                        ),
                      ],
                    ),
                  )
                ],
              ),

              // Right Tab bar icons

              Row(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: <Widget>[
                  MaterialButton(
                    padding: EdgeInsets.all(0),
                    minWidth: 60,
                    onPressed: () {
                      setState(() {
                        // currentScreen =
                        //     Settings(); // if user taps on this dashboard tab will be active
                        currentTab = 3;
                      });
                    },
                    child: Column(
                      mainAxisAlignment: MainAxisAlignment.center,
                      children: <Widget>[
                        Icon(
                          Icons.view_list,
                          color: currentTab == 3 ? Colors.blue : Colors.grey,
                        ),
                        Text(
                          'Property List',
                          style: TextStyle(
                            color: currentTab == 3 ? Colors.blue : Colors.grey,
                          ),
                        ),
                      ],
                    ),
                  ),
                  MaterialButton(
                    padding: EdgeInsets.all(0),
                    minWidth: 77,
                    onPressed: () {
                      setState(() {
                        // currentScreen =
                        //     Settings(); // if user taps on this dashboard tab will be active
                        currentTab = 4;
                      });
                    },
                    child: Column(
                      mainAxisAlignment: MainAxisAlignment.center,
                      children: <Widget>[
                        Icon(
                          Icons.location_searching,
                          color: currentTab == 4 ? Colors.blue : Colors.grey,
                        ),
                        Text(
                          'Map',
                          style: TextStyle(
                            color: currentTab == 4 ? Colors.blue : Colors.grey,
                          ),
                        ),
                      ],
                    ),
                  ),
                ],
              )
            ],
          ),
        ),
      ),

编辑:
这是我的整个代码:

// import 'package:provider/provider.dart';
import 'package:flutter/rendering.dart';

import '../providers/properties.dart';
import '../providers/cities.dart';
import '../providers/property.dart';
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
// import './model/homelist.dart';
// import './providers/properties.dart';
// import './providers/properties.dart';
import '../widgets/properties_grid.dart';
// import '../providers/property.dart';
import '../app_theme.dart';
// import './widgets/property_item.dart';

class MyHomePage extends StatefulWidget {
  const MyHomePage({Key key}) : super(key: key);

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> with TickerProviderStateMixin {
  int currentTab = 0;
  ScrollController _scrollController = ScrollController();
  bool _showBottomBar = true;

  _scrollListener() {
    if (_scrollController.position.userScrollDirection ==
        ScrollDirection.reverse) {
      setState(() {
        _showBottomBar = false;
      });
    } else if (_scrollController.position.userScrollDirection ==
        ScrollDirection.forward) {
      setState(() {
        _showBottomBar = true;
      });
    }
  }
  // final PageStorageBucket bucket = PageStorageBucket();
  var _showOnlyFavorites = false;
  // List<HomeList> homeList = HomeList.homeList;
  AnimationController animationController;
  bool multiple = true;

  @override
  void initState() {
    animationController = AnimationController(
        duration: const Duration(milliseconds: 2000), vsync: this);
    super.initState();
  }

  Future<bool> getData() async {
    await Future<dynamic>.delayed(const Duration(milliseconds: 0));
    return true;
  }

  @override
  void dispose() {
    animationController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    // final properties = Provider.of<Properties>(context, listen: false);
    return Scaffold(
      extendBody: true,
      floatingActionButton: FloatingActionButton(
        child: Icon(Icons.add),
        onPressed: () {},
      ),
      floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
      bottomNavigationBar: BottomAppBar(
        elevation: 0,
        shape: CircularNotchedRectangle(),
        notchMargin: 10,
        child: Container(
          height: 60,
          child: Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: <Widget>[
              Row(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: <Widget>[
                  MaterialButton(
                    padding: EdgeInsets.all(0),
                    minWidth: 155,
                    onPressed: () {
                      setState(() {
                        // currentScreen =
                        //     Chat(); // if user taps on this dashboard tab will be active
                        currentTab = 1;
                      });
                    },
                    child: Column(
                      mainAxisAlignment: MainAxisAlignment.center,
                      children: <Widget>[
                        Icon(
                          Icons.home,
                          color: currentTab == 1 ? Colors.blue : Colors.grey,
                        ),
                        Text(
                          'Home',
                          style: TextStyle(
                            color: currentTab == 1 ? Colors.blue : Colors.grey,
                          ),
                        ),
                      ],
                    ),
                  )
                ],
              ),

              // Right Tab bar icons

              Row(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: <Widget>[
                  MaterialButton(
                    padding: EdgeInsets.all(0),
                    minWidth: 60,
                    onPressed: () {
                      setState(() {
                        // currentScreen =
                        //     Settings(); // if user taps on this dashboard tab will be active
                        currentTab = 3;
                      });
                    },
                    child: Column(
                      mainAxisAlignment: MainAxisAlignment.center,
                      children: <Widget>[
                        Icon(
                          Icons.view_list,
                          color: currentTab == 3 ? Colors.blue : Colors.grey,
                        ),
                        Text(
                          'Property List',
                          style: TextStyle(
                            color: currentTab == 3 ? Colors.blue : Colors.grey,
                          ),
                        ),
                      ],
                    ),
                  ),
                  MaterialButton(
                    padding: EdgeInsets.all(0),
                    minWidth: 77,
                    onPressed: () {
                      setState(() {
                        // currentScreen =
                        //     Settings(); // if user taps on this dashboard tab will be active
                        currentTab = 4;
                      });
                    },
                    child: Column(
                      mainAxisAlignment: MainAxisAlignment.center,
                      children: <Widget>[
                        Icon(
                          Icons.location_searching,
                          color: currentTab == 4 ? Colors.blue : Colors.grey,
                        ),
                        Text(
                          'Map',
                          style: TextStyle(
                            color: currentTab == 4 ? Colors.blue : Colors.grey,
                          ),
                        ),
                      ],
                    ),
                  ),
                ],
              )
            ],
          ),
        ),
      ),
      backgroundColor: AppTheme.white,
      body: Stack(
        children: <Widget>[
          FutureBuilder<bool>(
            future: getData(),
            builder: (BuildContext context, AsyncSnapshot<bool> snapshot) {
              if (!snapshot.hasData) {
                return const SizedBox();
              } else {
                return Padding(
                  padding:
                      EdgeInsets.only(top: MediaQuery.of(context).padding.top),
                  child: Column(
                    mainAxisAlignment: MainAxisAlignment.center,
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: <Widget>[
                      appBar(),
                      Expanded(
                        child: FutureBuilder<bool>(
                          future: getData(),
                          builder: (BuildContext context,
                              AsyncSnapshot<bool> snapshot) {
                            if (!snapshot.hasData) {
                              return const SizedBox();
                            } else {
                              return ChangeNotifierProvider(
                                create: (context) => Properties(),
                                child: PropertiesGrid(_showOnlyFavorites),
                              );
                            }
                          },
                        ),
                      ),
                    ],
                  ),
                );
              }
            },
          ),
        ],
      ),
    );
  }

  Widget appBar() {
    return SizedBox(
      height: AppBar().preferredSize.height,
      child: Row(
        mainAxisAlignment: MainAxisAlignment.center,
        children: <Widget>[
          Padding(
            padding: const EdgeInsets.only(top: 8, left: 8),
            child: Container(
              width: AppBar().preferredSize.height - 8,
              height: AppBar().preferredSize.height - 8,
            ),
          ),
          Expanded(
            child: Center(
              child: Padding(
                padding: const EdgeInsets.only(top: 4),
                child:
                    Image.asset('assets/images/logo.png', fit: BoxFit.contain),
              ),
            ),
          ),
          Padding(
            padding: const EdgeInsets.only(top: 8, right: 8),
            child: Container(
              width: AppBar().preferredSize.height - 8,
              height: AppBar().preferredSize.height - 8,
              color: Colors.white,
              child: Material(
                color: Colors.transparent,
                child: InkWell(
                  borderRadius:
                      BorderRadius.circular(AppBar().preferredSize.height),
                  child: Icon(
                    Icons.location_on,
                    color: AppTheme.dark_grey,
                  ),
                  onTap: () {
                    setState(() {
                      multiple = !multiple;
                    });
                  },
                ),
              ),
            ),
          ),
        ],
      ),
    );
  }

编辑2

return Scaffold(
      resizeToAvoidBottomPadding: false,
      extendBody: true,
      floatingActionButton: FloatingActionButton(
        child: Icon(Icons.add),
        onPressed: () {},
      ),
      floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
      bottomNavigationBar: AnimatedContainer(
        duration: Duration(milliseconds: 500),
        child: _showBottomBar
            ? BottomAppBar(
                elevation: 0,
                shape: CircularNotchedRectangle(),
                notchMargin: 10,
                child: Container(
                  height: 60,
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: <Widget>[
                      Row(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: <Widget>[
                          MaterialButton(
                            padding: EdgeInsets.all(0),
                            minWidth: 155,
                            onPressed: () {
                              setState(() {
                                // currentScreen =
                                //     Chat(); // if user taps on this dashboard tab will be active
                                currentTab = 1;
                              });
                            },
                            child: Column(
                              mainAxisAlignment: MainAxisAlignment.center,
                              children: <Widget>[
                                Icon(
                                  Icons.home,
                                  color: currentTab == 1
                                      ? Colors.blue
                                      : Colors.grey,
                                ),
                                Text(
                                  'Home',
                                  style: TextStyle(
                                    color: currentTab == 1
                                        ? Colors.blue
                                        : Colors.grey,
                                  ),
                                ),
                              ],
                            ),
                          )
                        ],
                      ),

                      // Right Tab bar icons

                      Row(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: <Widget>[
                          MaterialButton(
                            padding: EdgeInsets.all(0),
                            minWidth: 60,
                            onPressed: () {
                              setState(() {
                                // currentScreen =
                                //     Settings(); // if user taps on this dashboard tab will be active
                                currentTab = 3;
                              });
                            },
                            child: Column(
                              mainAxisAlignment: MainAxisAlignment.center,
                              children: <Widget>[
                                Icon(
                                  Icons.view_list,
                                  color: currentTab == 3
                                      ? Colors.blue
                                      : Colors.grey,
                                ),
                                Text(
                                  'Property List',
                                  style: TextStyle(
                                    color: currentTab == 3
                                        ? Colors.blue
                                        : Colors.grey,
                                  ),
                                ),
                              ],
                            ),
                          ),
                          MaterialButton(
                            padding: EdgeInsets.all(0),
                            minWidth: 77,
                            onPressed: () {
                              setState(() {
                                // currentScreen =
                                //     Settings(); // if user taps on this dashboard tab will be active
                                currentTab = 4;
                              });
                            },
                            child: Column(
                              mainAxisAlignment: MainAxisAlignment.center,
                              children: <Widget>[
                                Icon(
                                  Icons.location_searching,
                                  color: currentTab == 4
                                      ? Colors.blue
                                      : Colors.grey,
                                ),
                                Text(
                                  'Map',
                                  style: TextStyle(
                                    color: currentTab == 4
                                        ? Colors.blue
                                        : Colors.grey,
                                  ),
                                ),
                              ],
                            ),
                          ),
                        ],
                      )
                    ],
                  ),
                ),
              )
            : Container(
                color: Colors.white,
                width: MediaQuery.of(context).size.width,
              ),
      ),
      backgroundColor: AppTheme.white,
      body: Stack(
        children: <Widget>[
          FutureBuilder<bool>(
            future: getData(),
            builder: (BuildContext context, AsyncSnapshot<bool> snapshot) {
              if (!snapshot.hasData) {
                return const SizedBox();
              } else {
                return Padding(
                  padding:
                      EdgeInsets.only(top: MediaQuery.of(context).padding.top),
                  child: Column(
                    mainAxisAlignment: MainAxisAlignment.center,
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: <Widget>[
                      appBar(),
                      Expanded(
                        child: FutureBuilder<bool>(
                          future: getData(),
                          builder: (BuildContext context,
                              AsyncSnapshot<bool> snapshot) {
                            if (!snapshot.hasData) {
                              return const SizedBox();
                            } else {
                              return ChangeNotifierProvider(
                                create: (context) => Properties(),
                                child: PropertiesGrid(_showOnlyFavorites),
                              );
                            }
                          },
                        ),
                      ),
                    ],
                  ),
                );
              }
            },
          ),
        ],
      ),
    );

现在，当向下滚动时，我需要隐藏此底部栏...有没有办法通过简单的动画来做到这一点？
我也在中央有一个 float Action 按钮，所以如果有可能在向下滚动时用栏隐藏此 FloatButton？
希望有人能帮助我解决这个问题...

最佳答案

ScrollController用于管理小部件的滚动方向，该小部件具有类似的回调

_scrollController.addListener(_scrollListener);

示例:

class HomeScreen extends StatefulWidget {
  @override
  _HomeScreenState createState() => _HomeScreenState();
}

class _HomeScreenState extends State<HomeScreen> {
  int currentTab = 1;

  ScrollController _scrollController = ScrollController();
  bool _showBottomBar = true;

  _scrollListener() {
    if (_scrollController.position.userScrollDirection ==
        ScrollDirection.reverse) {
      setState(() {
        _showBottomBar = false;
      });
    } else if (_scrollController.position.userScrollDirection ==
        ScrollDirection.forward) {
      setState(() {
        _showBottomBar = true;
      });
    }
  }

  @override
  void initState() {
    _scrollController.addListener(_scrollListener);
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        resizeToAvoidBottomPadding: false,
        bottomNavigationBar: AnimatedContainer(
        duration: Duration(milliseconds: 500),
        height: 60.0,
        child: _showBottomBar? BottomAppBar(
          elevation: 0,
          shape: CircularNotchedRectangle(),
          notchMargin: 10,
          child: Container(
            height: 60,
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: <Widget>[
                Row(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: <Widget>[
                    MaterialButton(
                      padding: EdgeInsets.all(0),
                      minWidth: 155,
                      onPressed: () {
                        setState(() {
                          // currentScreen =
                          //     Chat(); // if user taps on this dashboard tab will be active
                          currentTab = 1;
                        });
                      },
                      child: Column(
                        mainAxisAlignment: MainAxisAlignment.center,
                        children: <Widget>[
                          Icon(
                            Icons.home,
                            color: currentTab == 1 ? Colors.blue : Colors.grey,
                          ),
                          Text(
                            'Home',
                            style: TextStyle(
                              color: currentTab == 1 ? Colors.blue : Colors.grey,
                            ),
                          ),
                        ],
                      ),
                    )
                  ],
                ),

                // Right Tab bar icons

                Row(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: <Widget>[
                    MaterialButton(
                      padding: EdgeInsets.all(0),
                      minWidth: 60,
                      onPressed: () {
                        setState(() {
                          // currentScreen =
                          //     Settings(); // if user taps on this dashboard tab will be active
                          currentTab = 3;
                        });
                      },
                      child: Column(
                        mainAxisAlignment: MainAxisAlignment.center,
                        children: <Widget>[
                          Icon(
                            Icons.view_list,
                            color: currentTab == 3 ? Colors.blue : Colors.grey,
                          ),
                          Text(
                            'Property List',
                            style: TextStyle(
                              color: currentTab == 3 ? Colors.blue : Colors.grey,
                            ),
                          ),
                        ],
                      ),
                    ),
                    MaterialButton(
                      padding: EdgeInsets.all(0),
                      minWidth: 77,
                      onPressed: () {
                        setState(() {
                          // currentScreen =
                          //     Settings(); // if user taps on this dashboard tab will be active
                          currentTab = 4;
                        });
                      },
                      child: Column(
                        mainAxisAlignment: MainAxisAlignment.center,
                        children: <Widget>[
                          Icon(
                            Icons.location_searching,
                            color: currentTab == 4 ? Colors.blue : Colors.grey,
                          ),
                          Text(
                            'Map',
                            style: TextStyle(
                              color: currentTab == 4 ? Colors.blue : Colors.grey,
                            ),
                          ),
                        ],
                      ),
                    ),
                  ],
                )
              ],
            ),
          ),
        ): Container(
          color: Colors.white,
          width: MediaQuery.of(context).size.width,
        ),
      ),
      appBar: AppBar(),
      body: Container(
        child: ListView.builder(
            controller: _scrollController,
            itemCount: 10,
            itemBuilder: (ctx, index) {
              return Column(
                children: <Widget>[
                  Container(
                    color: Colors.black54,
                    width: double.infinity,
                    height: 120,
                  ),
                  SizedBox(
                    height: 20,
                  )
                ],
              );
            }),
      ),
    );
  }
}

关于flutter - 使用flutter向下滚动时如何隐藏bottomAppBar，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/62175139/

文章推荐： flutter - 在Statelesswidget中为启动屏幕调用方法吗？

文章推荐： git - 检测 jenkins 上的测试失败

文章推荐： flutter - Dart引用的回调带有返回值

文章推荐： firebase - Firestore查询中的文档ID错误

flutter - flutter :从 flutter 应用程序构建apk失败
我正在尝试从flutter应用程序构建apk，但出现此错误: Note: /mnt/Software/Linux/Flutter/flutter/.pub-cache/hosted/pub.dartl
flutter - 将一个 Flutter 应用程序集成到另一个 Flutter 应用程序中
我有一个名为 X 的较大应用程序，还有另一个名为 Y 的较小应用程序。他们现在彼此分开，并且工作正常。我想将应用程序 Y 集成到 X 中。我想将 Y 的代码放入 X 项目中，但它们应该有不同的 Mai
android-studio - Flutter : What are the differences between Flutter Plugin, Flutter 包和 Flutter 模块？
在android Studio中选择Create New Flutter Project，出现如下4个选项。 Flutter 应用程序 Flutter 插件 Flutter 包 flutter 模块
flutter - `ios/Flutter/Flutter.podspec` 是做什么的？
我看到我的 flutter 项目生成了一个文件 ios/Flutter/Flutter.podspec ，这个文件有什么用？如果它与生成的 Flutter.framework 有关? 我应该将它包含
flutter - 找不到 flutter 命令/flutter 医生
我尝试过的在包含flutter SDK的位置添加/编辑.bash_profile.rtf文件。导出PATH = / Users / temur / Documents / Projects / F
flutter - 设置 Flutter 日志级别/Flutter 打印数千行详细信息
Flutter 日志会打印数千个详细/垃圾邮件日志。我正在尝试调试一个复杂的应用程序，但是打印太冗长了，以至于我很难找到我自己打印的东西。有没有办法禁用详细？就像是: Logger.level.
flutter - flutter : flutter 1.22更新后，我在Lineargradient属性中遇到错误
在flutter 1.22更新之后，我在Lineargradient colors属性中遇到错误，这给我一个错误，即未定义名称colors参数。.在Android中更新flutter和flutter插
flutter - 为什么我收到错误，flutter statfulwidget flutter 中的常量值无效
在下面的代码 widget.hintText 中给出错误，我试图将日期选择器作为单独的组件，并在从其他文件调用它时动态传递提示文本值。 import 'package:date_field/date_
flutter - 为什么我收到错误，flutter statfulwidget flutter 中的常量值无效
在下面的代码 widget.hintText 中给出错误，我试图将日期选择器作为单独的组件，并在从其他文件调用它时动态传递提示文本值。 import 'package:date_field/date_
flutter - 是否必须克隆 flutter repo 才能设置 Flutter
Flutter 1.0 发布后，我正在按照步骤搭建 Flutter 开发环境。在步骤中(如所附屏幕截图所示)，它说要更新 $PATH 两次，一次使用 flutter 工具的路径 export PAT
flutter - 如何将 flutter 移动应用程序迁移到 flutter web
我有一个用 flutter 编写的移动应用程序，我想将其转换为 flutter_web 应用程序(集成 flutter_web 尚不可用)。我目前遇到包裹问题。我已按照本网站中列出的说明进行操作 h
flutter - 如何在我的 Flutter 应用程序中向我的 Flutter 路由添加自定义转换
如何向我的 Flutter 路由添加自定义转换？这是我目前的路线结构。 class MyApp extends StatelessWidget { // This widget is the
flutter-web - Flutter Webview 不适用于 Flutter web
我正在尝试通过 URL 在 webview 中显示网页。我试过 flutter_webview_plugin 插件，但是当我在浏览器上运行项目时它不起作用。在 flutter web applica
flutter - 具有动态高度的动画容器 Flutter
我正在使用 animatedContainer 在按下按钮时显示 listView.builder()。这是一个要显示的简单子(monad)列表，但问题是我不知道 ListView 构建器的高度会传递
flutter - 如何将这个lottie动画展开填满整个屏幕 - Flutter
我目前正在我的应用程序中制作渐变背景动画......我正在使用 lottie 动画的帮助下这样做!我试图将它封装在一个容器中并成功地做到了。但是有一个问题，尽管我将高度更改为大于 2000 的东西，但
flutter - flutter 中的谷歌标签管理器
美好的一天! 我无法弄清楚如何使用 google 标签管理器设置 flutter。我找到了 this package包括标签管理器 api。但是我不知道如何正确配置它。 (在网络上我只需要复制粘贴一个
flutter - 难以将商品添加到购物车 - Flutter
我的购物车模型如下 class Cart { String description; double unitCost; double amount; int quantity; S
flutter - Flutter 中的跨平台文件缓存
在 Flutter 应用程序中，我想为在线托管的资源(图像、视频等)实现缓存。我希望它能在原生平台 (Android/iOS)(例如使用文件系统)和网络(例如使用 IndexedDB)上运行。 Fl
flutter - flutter 中容器的自动高度
我写了一个页面，在顶部一切都很好，应该是这样。在底部我有一个事件的历史。我的容器的宽度是自动确定的(取决于屏幕的宽度)，而高度 - 不，在不同的设备上有不同的高度(底部的缩进是不同的)。是否可以自动确
flutter - 如何将小部件放置在可调整大小页面的特定位置？ [ flutter ]
我正在处理一个页面，其中有一些字段，例如 textfield 和 slider。在页面的末尾必须有一个用于进行下一步的按钮，该按钮被包裹在 Align 中以在页面之间具有固定位置。另一方面，resi

行者123

个人简介

我是一名优秀的程序员,十分优秀！

作者热门文章

滴滴打车优惠券免费领取

全站热门文章

首页

博学

6Ren·AI

商城

flutter - 使用flutter向下滚动时如何隐藏bottomAppBar