时间戳

首页 > 解决方案 > 是否有一个 AppBar 完全动态的高度和背景颜色？

android - 是否有一个 AppBar 完全动态的高度和背景颜色？

问题描述

我正在尝试做一个动态的应用栏，当页面的滚动偏移量为0时，背景颜色需要透明，标志需要是白色和标高0，并且当滚动偏移量从0改变时，需要过渡以将背景颜色更改为白色，高度为 5，徽标颜色为红色

滚动偏移量为0时的图像

这是滚动偏移量大于 0 的情况

我已经尝试过这段代码：

 @override
  void initState() {
    super.initState();
    _scrollController = ScrollController()
      ..addListener(() {
        setState(() {
          offset = _scrollController.offset;
        });
      });
  }

...

final double transitionColor = min(max(offset, 0), 100) / 100;
final double transitionElevation = min(max(offset, 0), 50) / 10;

LjAppBar.getAppBar(
  brandingColor: offset != 0 ? LjTheme.ljPrimary.withOpacity(transitionColor) : Colors.white,
  backgroundColor: Colors.white.withOpacity(transitionColor),
  elevation: transitionElevation,
),

但是，效果和应用程序是如此缓慢并且效果不佳......我希望有人可以帮助我

标签： androidiosflutterflutter-layout

解决方案

据我所知，解决这个问题的唯一方法是使用SliverAppBar。Flutter 中的 Sliver 是可以动态响应不同滚动状态的小部件。查看Slivers，从 Flutter 团队的 Emily Fortuna 那里获得关于该主题的精彩介绍。

在您的情况下，使用 SliverAppBar，您可以根据列表的滚动来更改应用栏的颜色、高度等。为此，您将需要SliverList。

围绕 Sliver 小部件有点难以理解，但不要气馁！一旦你习惯了它们，你将能够实现你想要的。

推荐阅读