Change position of a Flutter Snackbar below Bottom Navigation Bar

huangapple go评论62阅读模式
英文:

Change position of a Flutter Snackbar below Bottom Navigation Bar

问题

可以在底部导航栏下显示 Snackbar 吗?

期望效果:

Change position of a Flutter Snackbar below Bottom Navigation Bar

实际效果:

Change position of a Flutter Snackbar below Bottom Navigation Bar

任何回复都感激 Change position of a Flutter Snackbar below Bottom Navigation Bar

谢谢!

英文:

Can i show Snackbar below Bottom Navigation Bar ?

what i want :

Change position of a Flutter Snackbar below Bottom Navigation Bar

reality :

Change position of a Flutter Snackbar below Bottom Navigation Bar

Any reply is appreciated Change position of a Flutter Snackbar below Bottom Navigation Bar
Thank you so much

答案1

得分: 2

以下是翻译好的内容:

假设底部导航栏被称为 Scaffold 类内部使用的 BottomNavigationBar,并且 snackbar 是 SnackBar 类。我认为这很难实现。这是因为 SnackBar 就像是屏幕上的一个叠加层,底部导航栏无法知道是否显示了 snackbar。而且根据 snackbar 移动底部导航栏上下本身就是一个挑战。

如果我想创建您想要的效果,我会像这样做。我会创建一个类似 snackbar 的自定义小部件。这个小部件的结构如下:

Column(
  children: [
    Expanded(
      child: Scaffold(
        appBar: AppBar(
          title: const Text("Hallo"),
        ),
        body: const Center(
          child: Text("Hello"),
        ),
      ),
    ),
    CustomSnackBarLikeWidget(),
  ],
);

CustomSnackBarLikeWidget() 通常不可见(高度为 0),使 Scaffold 使用整个屏幕高度,从而底部导航栏粘贴在底部。在 CustomSnackBarLikeWidget() 显示时,它具有某种内容(一些高度),并会将底部导航栏推上去,就像导航栏下面的 snackbar

CustomSnackBarLikeWidget() 也将是一个复杂的小部件。该小部件将不断监视您是否调用了该小部件以显示任何 snackbar 内容。

我不知道我的回答是否有帮助,但请随时向我提问。

英文:

Assuming the bottom navigation bar is referred to as the BottomNavigationBar used inside Scaffold class, and snackbar is the SnackBar class, I believe it is hard to achieve. This is because the SnackBar is like an overlay on the screen and the bottomnav class can't tell whether a snackbar is shown or not. Also moving the bottomnav up and down accordingly with the snackbar is a challenge itself.

If I wanted to create what you want, I'd do something like this. I'll creat a custom snackbar-like widget. This widget is structured like this

Column(
  children: [
    Expanded(
      child: Scaffold(
        appBar: AppBar(
          title: const Text("Hallo"),
        ),
        body: const Center(
          child: Text("Hello"),
        ),
      ),
    ),
    CustomSnackBarLikeWidget(),
  ],
);

the CustomSnackBarLikeWidget() is normally not shown (height is 0) making the scaffold use the whole screen height thus the bottomnav sticking to the bottom. In cases when the CustomSnackBarLikeWidget() is shown, it has some sort of contents (some height) and will shove the bottomnav upwards, like snackbar below navigation bar

the CustomSnackBarLikeWidget() will also be a complicated widget. This widget will constantly be watching if you have called this widget to show any snackbar contents.

I don't know if my answer helps but feel free to ask me questions.

huangapple
  • 本文由 发表于 2023年4月17日 12:56:36
  • 转载请务必保留本文链接:https://go.coder-hub.com/76031820.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定