[Flutter] Riverpod 상태 관리와 StreamBuilder

기존 프로젝트의 상태관리를 setState > Riverpod으로 마이그레이션 중에 생긴 버그

버그

ListView 스크롤 방향에 따라 FloatingActionButton을 보이고 숨기는 기능에 Riverpod을 도입했다

initState

@override
  void initState() {
    super.initState();
    
    final FabVisible fabVisibleNotifier = ref.read(fabVisibleProvider.notifier);
    
    _dietListController.addListener(() {
      if (_dietListController.position.userScrollDirection ==
          ScrollDirection.reverse) {
        fabVisibleNotifier.hide();
      } else {
        fabVisibleNotifier.show();
      }
    });
  }

build

@override
Widget build(BuildContext context) {
	return StreamBuilder(...);
}

문제는 initState에서 구독한 listener에서 지정한 함수가 호출될 때마다 리빌드 현상이 일어났다.
계속해서 스크롤이 최상단으로 초기화되는 버그가 일어났다.

해결

그냥 riverpod 쓰는 김에 StreamProvider로 대신 stream관리를 하고, build 내부의 StreamBuilder를 없애버렸더니 해결되었다!

Widget 외부

final streamProvider = StreamProvider((ref) => Stream());

build

@override
Widget build(BuildContext context) {

  final AsyncValue dietListStream = ref.watch(dietListStreamProvider);

  return Padding(
  	padding: const EdgeInsets.symmetric(horizontal: 20),
    child: dietListStream.when(
    	data: (data) {  }, // stream 데이터 사용
        error: (error, stackTrace) {  }, // 에러 발생 시
        loading: () {  }, // 로딩 중일 때
    ));

마무리

더 관리하기 편한듯..? 진작 사용해볼걸
StreamProvider, FutureProvider를 적극적으로 사용해보자!