容器高度侦听器

Question

我正在尝试构建可放置在listView上的可重用searchBar。下面是它的外观示例

我将searchBar绑定到ScrollController，因此可以使用AnimatedContainer缩小容器的大小。

我遇到的问题是，在打开/关闭SearchBar时，子窗口小部件不会正常消失/收缩或重新出现。下面是一个示例。

我正在尝试对它们执行AnimatedOpacity，但看起来我需要在容器本身上绑定一个AnimationController来侦听高度。

我可以附加代码，但我想我的问题是采取的方法。

• 我在容器上尝试了GlobalKey，但并非每个scrollevent都是当我对容器的整个部分进行动画处理时被捕获拉了50％（让它有弹跳的感觉）。
• 我尝试了SizeChangedLayoutNotifier并收到通知，但是当我将其绑定到RenderObject以找到大小，我得到“按计划进行构建在帧期间”错误。

还有其他想法吗？

Answer 1

您可以按照本教程https://www.youtube.com/watch?v=FPcl1tu0gDs

OR

这是您预期结果的一个小例子：

SliverAppBar(
  expandedHeight: _width / 3.0,
  backgroundColor: Colors.white,
  leading: InkWell(
    onTap: () => Navigator.of(context).pop(),
    child: Container(
      alignment: Alignment.center,
      child: Container(
          width:  30,
          height: 30,
        alignment: Alignment.center,
          decoration: BoxDecoration(
            color: Colors.white,
          ),
          child: Icon(Icons.arrow_back,)),
    ),
  ),


  elevation: 0.1,

  title: Container(
    margin: EdgeInsets.only(
      left: 16,
    ),
    child: Text(
      "${widget.title}",
      style: TextStyle(
          color: AppTheme.black, fontSize: 24, fontWeight: FontWeight.w600),
    ),
  ),



  floating: true,
  pinned: true,
  snap: false,
  stretch: true,
  centerTitle: false,

// here is custom app searcbar
  flexibleSpace: CustomSearchHeader(
    color: [
      AppTheme.white,
      AppTheme.white,
    ],
    context: context,
    width: _width,
    height: _height,
    onChange: (String value) {
      _jobBloc.add(SearchAddress(listData: _listData, query: value));
    },
  ),
);