본문 바로가기

프로그래밍/Flutter

[flutter] 특정 값에 따라 Widget 변경

Widget을 업데이트 할 경우 setState(() {}) 를 사용하면 되는데, setState()는 전체 Widget을 초기화하고, build 메쏘드를 호출해 전체 Widget을 다시 생성하게 된다. 특정 Widget만 초기화 하려면 별도의 publisher와 Widget을 사용해야 한다.

 

ValueNotifier<Type>

값의 변화를 퍼블리싱하는 객체

ValueNotifier<bool> _isSignIn = ValueNotifier(false);

 

ValueListenableBuilder

ValueNotifier 의 값이 변경되면 builder 에 정의한 메쏘드가 호출된다.
위의 bool 값에 따라 버튼을 활성화, 비활성화 하는 경우 아래와 같이 구성된다.

@override
Widget build(BuildContext context) {
   return ValueListenableBuilder(
      valueListenable: _isSignIn,
      builder: (context, value, child) {
         if (value == false) {
            return ElevatedButton(
               child: const Text('Button'),
               onPressed: null,
            );
         }
         
         return ElevatedButton(
            child: const Text('Button'),
            onPressed: () {
               Navigator.push(
                  context,
                  MaterialPageRoute(builder: (context) => OtherWidget()),
               );
            },
         );
      }
   );