외부 값과 동기화된 ChangeNotifier를 생성하고 동기화하는 ChangeNotifierProvider입니다. ChangeNotifierProvider의 이 변형을 더 잘 이해하려면 다음의 코드를 살펴볼 수 있습니다.ChangeNotifierProvider( create: (context) { return MyChangeNotifier( myModel: Provider.of(context, listen: false), ); }, child: ...) 이 예제에서는 MyModel이라는 다른 제공자(provider)에서 가져온 값을 사용하여 MyChangeNotifier를 생성했습니다. 이 방법은 MyModel이 절대 변하지 않는 한 작동합니다. 하지만 MyModel이 업데이트..
ChangeNotifier를 듣고 하위 요소에 노출시키며, ChangeNotifier.notifyListeners가 호출될 때마다 종속 요소를 다시 빌드합니다.ChangeNotifier를 생성할지 재사용할지에 따라 다른 생성자를 사용해야 합니다. ChangeNotifier 생성하기값을 생성하려면 기본 생성자를 사용하세요. ChangeNotifierProvider.value를 사용하여 빌드 내에서 인스턴스를 생성하면 메모리 누수 및 잠재적인 부작용이 발생할 수 있습니다. [O] 반드시 create 내에서 새 ChangeNotifier를 생성하세요.ChangeNotifierProvider( create: (_) => new MyChangeNotifier(), child: ...) [X] .valu..
![](http://i1.daumcdn.net/thumb/C148x148/?fname=https://blog.kakaocdn.net/dn/zHAuC/btsnqSZiS1k/ZHBji6ETjBGIl4FIvmq7Z1/img.png)
Provider를 사용하여 등록된 상태에 접근하는 방법은 다양합니다. 가장 일반적으로 사용되는 방법들에 대해서 알아봅시다. Provider.of(context) Provider.of(context)를 사용하면 등록된 T 타입의 객체 또는 상태에 접근할 수 있습니다. 이 방법은 가장 간단하고 직접적인 방법이며, 위젯 트리에서 가장 가까운 상위 Provider를 찾습니다. 기본적으로 리스닝 동작이 활성화되어 있으며, ChangeNotifierProvider의 상태 데이터 변경되거나 setState()로 상태 데이터가 변경되면, 해당 위젯이 리빌드 됩니다. 예시: var myData = Provider.of(context); context.read(): context.read()를 사용하여 등록된 T 타입의 ..
![](http://i1.daumcdn.net/thumb/C148x148/?fname=https://blog.kakaocdn.net/dn/cuM4DG/btsnoDoiMEy/6ZfuKS0uk403nMVoFGPquk/img.png)
플러터의 상태 관리 패키지인 Provider에서 제공하는 ChangeNotifierProvider와 Navgator로 화면 이동한 후에 상태 변화를 확인하기 위해 예제 코드를 만들어 보았다. 다음 이미지처럼 FirstPage에서 SecondPage로 이동하고, SecondPage에서 상태를 변화시켜도 FirstPage에 구독한 상태가 잘 변경되는 것을 확인할 수 있다. FirstPage와 SecondPage가 StatelessWidget인 것을 주목하자. ChangeNotifierProvider로 상태가 공유되기 때문에 상태 변화시 자동으로 위젯이 리빌드 되기 때문에 StatefulWidget처럼 작동하게 된다. import 'package:flutter/material.dart'; import 'pac..
![](http://i1.daumcdn.net/thumb/C148x148/?fname=https://blog.kakaocdn.net/dn/bEbl4h/btsnneg5W20/DygBESLOBnfrT32luJ0q1k/img.png)
플러터의 상태 관리로 사용되는 Provider의 Selector 위젯에 대해서 알아보자. Selector는 Provider 패키지에서 제공하는 위젯 중 하나로, 특정 상태의 일부만 구독하여 해당 상태의 변경에 따라 위젯을 업데이트할 수 있도록 도와준다. Provider 패키니에서 제공하는 Consumer 위젯도 상태를 구독하는데, Selector와 달리 상태 전부를 구독한다는 점이 다르다. 따라서 상태를 전부 구독해야 한다면 Consuer를 사용하고, 상태의 일부만 구독한다면 Selector를 사용하자. Selector의 사용법은 다음과 같다. Selector( selector: (BuildContext context, T value) => S, builder: (BuildContext context, ..
![](http://i1.daumcdn.net/thumb/C148x148/?fname=https://blog.kakaocdn.net/dn/b6t6W4/btsnhdJ7szM/Ho4aTl6symfxCrFc5rwKV0/img.png)
플러터의 상태 관리로 사용되는 Provider가 제공하는 Consumer에 대해서 알아보자. Consumer는 Provider 패키지가 제공하는 위젯 중 하나이다. 특정 상태에 대한 구독을 설정하여 해당 상태의 변경 사항을 감지하고, 이에 따라 자동으로 위젯을 업데이트할 수 있게 도와준다. 따라서 Consumer는 필요한 부분만을 업데이트하고 성능을 최적화하는 데 사용한다. Consumer는 다음과 같은 형태로 사용된다. Consumer( builder: (BuildContext context, T value, Widget? child) { // T 상태가 변경될 때마다 builder가 호출된다. return YourWidget(); }, ) Consumer는 상태 T를 구독하고, 상태가 변경될 때마다 ..
![](http://i1.daumcdn.net/thumb/C148x148/?fname=https://blog.kakaocdn.net/dn/cLJ0U6/btsngJijsdi/mCM1onzZC8Em2AixqX6Mu1/img.png)
현재 프로젝트에서 플러터의 상태 관리를 위해서 ChangeNotifierProvider를 사용하고 있다. ChangeNotifierProvider는 ChangeNotifier로 구현한 클래스에서 notifyListeners()가 호출되면 Provider.of로 구현 클래스를 리스닝하는 위젯을 자동으로 리빌드 해주는 기능이 있다. 하지만 프로젝트를 진행하다 보니 리빌드가 너무 많이 발생하는 문제가 발생했다. 왜 그럴까 열심히 알아본 결과, 내가 Provider.of에 대해 제대로 알고 있지 않아서였다. 다음 간단한 예제코드가 있다. 참고로 코드가 길어서 필요한 코드가 포함시켰다. SuperWidget의 하위에는 다양한 위젯이 있고, 그중에 SubWidget1도 포함되어 있다. 만일 다른 하위 위젯에서 Pr..
![](http://i1.daumcdn.net/thumb/C148x148/?fname=https://blog.kakaocdn.net/dn/chCgn3/btsnbJJTRLQ/Vy2nzLudrlNIRMKJhazGK1/img.png)
플러터에서 ChangeNotifierProvider를 이용해서 코드를 작성하는 중에 아래와 같은 에러가 발생했다. class SubWidget2 extends StatelessWidget { const SubWidget2({super.key}); @override Widget build(BuildContext context) { print("Sub Widget 2 build"); return ElevatedButton( onPressed: () { Provider.of(context).increment(); }, child: const Text("Sub Widget 2"), ); } } ======== Exception caught by gesture =============================..