🎉

ListView を下に引っ張った時に戻る処理を1回だけ発火させる方法【 Flutter 】

2024/07/17に公開

https://youtu.be/l_CypJii3_8

これがやりたい。と思ってさっき思いついた手法。
改めて感があると当たり前すぎた。

dart
final testProvider = StateProvider.autoDispose((ref) => true);

class _DialogWidget extends HookConsumerWidget {
  const _DialogWidget();

  @override
  Widget build(BuildContext context, WidgetRef ref) {
    final sc = useScrollController();
    ref.listen(testProvider, (preValue, newValue) {
      if (preValue ?? true && !newValue) {
        Navigator.pop(context);
      }
    });

    return SizedBox(
      height: context.deviceHeight * 0.6,
      child: ListView(
        controller: sc
          ..addListener(() {
            print(sc.position.pixels);
            if (sc.position.pixels < -100) {
              ref.read(testProvider.notifier).state = false;
            }
          }),
        children: [
          for (var i = 0; i < 100; i++) const Text('テキスト'),
        ],
      ),
    );
  }
}

Discussion