颤振：在来回切换过滤器时项目从ListView中消失，滚动时滚动条抖动

当我尝试使用简单的

ListView

过滤时，我遇到了两个困难

当项目不满足筛选规则时，我首先返回高度为零的

容器

，这起作用，但当我筛选项目的一部分，然后向下滚动、禁用筛选并向后滚动时，先前筛选的项目不会再次出现：

然后我返回高度为0.0001的

容器

，问题意外解决：

为什么会这样<代码>高度为0.0001的容器s也不可见，就像高度为零的容器一样。 还有更好的解决办法吗

当我过滤一个和数百个时，

滚动条

在滚动时抖动：

当应用过滤器时，如何使滚动条平滑

代码：

导入“包装：颤振/材料.省道”；
void main（）{
runApp（MyApp（））；
}
类MyApp扩展了StatefulWidget{
_MyAppState createState（）=>\u MyAppState（）；
}
类MyAppState扩展了状态{
最终项目=列表。生成（1000，（索引）=>“$index”）；
var filterOptions=List.of（IntType.values）；
@凌驾
小部件构建（构建上下文）{
返回材料PP(
家：脚手架(
body:buildBody（），
appBar:appBar(
标题：文本（“简单过滤”），
底部：buildAppBarBottom（），
),
),
);
}
Widget buildBody（）{
返回滚动条（//第二个问题
子项：ListView.builder(
itemCount:items.length，
itemBuilder：（上下文，索引）{
最终项目=项目[索引]；
if（filterOptions.any（（option）=>option.length==item.length））{
返回列表（标题：文本（项目））；
}
返回容器（高度：0.0001）；//第一个问题
},
),
);
}
PreferredSizeWidget buildAppBarBottom（）{
返回首选大小(
首选尺寸：尺寸。从高度（50），
孩子：填充(
填充：边缘设置。全部（8），
孩子：排(
子项：IntType.values.map（（选项）{
返回填充(
填充：边缘组。对称（水平：4），
孩子：过滤芯片(
selectedColor:Colors.white，
所选：过滤器选项。包含（选项），
当选：（当选）{
设置状态（）{
如果（当选）{
过滤器选项。添加（选项）；
}否则{
过滤器选项。移除（选项）；
}
});
},
标签：文本（选项名称），
),
);
}).toList（），
),
),
);
}
}
类IntType{
静态常数IntType ones=常数IntType.U1（'ones'，1）；
静态常数IntType tens=常数IntType.U2;（'tens'，2）；
静态常数IntType CHUNDS=常数IntType.U8;（'CHUNDS'，3）；
最后的字符串名；
最终整数长度；
常量IntType.(this.name，this.length）；
静态常量值=[
一个一个，
IntType.tens，
IntType.数百，
];
}

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatefulWidget {
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  final items = List.generate(1000, (index) => '$index');
  var filterOptions = List.of(IntType.values);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: buildBody(),
        appBar: AppBar(
          title: Text('Simple filtering'),
          bottom: buildAppBarBottom(),
        ),
      ),
    );
  }

  Widget buildBody() {
    return Scrollbar(                       // second question
      child: ListView.builder(
        itemCount: items.length,
        itemBuilder: (context, index) {
          final item = items[index];

          if (filterOptions.any((option) => option.length == item.length)) {
            return ListTile(title: Text(item));
          }

          return Container(height: 0.0001); // first question
        },
      ),
    );
  }

  PreferredSizeWidget buildAppBarBottom() {
    return PreferredSize(
      preferredSize: Size.fromHeight(50),
      child: Padding(
        padding: EdgeInsets.all(8),
        child: Row(
          children: IntType.values.map((option) {
            return Padding(
              padding: EdgeInsets.symmetric(horizontal: 4),
              child: FilterChip(
                selectedColor: Colors.white,
                selected: filterOptions.contains(option),
                onSelected: (isSelected) {
                  setState(() {
                    if (isSelected) {
                      filterOptions.add(option);
                    } else {
                      filterOptions.remove(option);
                    }
                  });
                },
                label: Text(option.name),
              ),
            );
          }).toList(),
        ),
      ),
    );
  }
}

class IntType {
  static const IntType ones = const IntType._('Ones', 1);
  static const IntType tens = const IntType._('Tens', 2);
  static const IntType hundreds = const IntType._('Hundreds', 3);

  final String name;
  final int length;

  const IntType._(this.name, this.length);

  static const values = [
    IntType.ones,
    IntType.tens,
    IntType.hundreds,
  ];
}