플러터의 상태 관리로 사용되는 Provider가 제공하는 Consumer에 대해서 알아보자. Consumer는 Provider 패키지가 제공하는 위젯 중 하나이다. 특정 상태에 대한 구독을 설정하여 해당 상태의 변경 사항을 감지하고, 이에 따라 자동으로 위젯을 업데이트할 수 있게 도와준다. 따라서 Consumer는 필요한 부분만을 업데이트하고 성능을 최적화하는 데 사용한다. Consumer는 다음과 같은 형태로 사용된다. Consumer( builder: (BuildContext context, T value, Widget? child) { // T 상태가 변경될 때마다 builder가 호출된다. return YourWidget(); }, ) Consumer는 상태 T를 구독하고, 상태가 변경될 때마다 ..
현재 프로젝트에서 플러터의 상태 관리를 위해서 ChangeNotifierProvider를 사용하고 있다. ChangeNotifierProvider는 ChangeNotifier로 구현한 클래스에서 notifyListeners()가 호출되면 Provider.of로 구현 클래스를 리스닝하는 위젯을 자동으로 리빌드 해주는 기능이 있다. 하지만 프로젝트를 진행하다 보니 리빌드가 너무 많이 발생하는 문제가 발생했다. 왜 그럴까 열심히 알아본 결과, 내가 Provider.of에 대해 제대로 알고 있지 않아서였다. 다음 간단한 예제코드가 있다. 참고로 코드가 길어서 필요한 코드가 포함시켰다. SuperWidget의 하위에는 다양한 위젯이 있고, 그중에 SubWidget1도 포함되어 있다. 만일 다른 하위 위젯에서 Pr..
플러터에서 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 =============================..
플러터에서 showDialog()를 사용하는 코드를 작성하였다. import 'package:flutter/material.dart'; void main() { runApp(const MyApp()); } class MyApp extends StatelessWidget { const MyApp({super.key}); @override Widget build(BuildContext context) { return MaterialApp( home: Scaffold( appBar: AppBar(title: const Text("MyApp")), body: Center( child: ElevatedButton( onPressed: () { showDialog( context: context, builder: ..
플러터에서 백 버튼을 제어하는 방법을 알아보자. 백 버튼은 뒤로 가기 버튼, 되돌리기 등 다양한 명칭으로 사용된다. 여기서는 백 버튼이라고 하겠다. 이전 화면으로 돌아가는 방법 플러터에서 내비게이터로 화면을 이동하면 이전 화면으로 돌아가기 위해 기본적으로 2가지 방법을 제공한다. 1. 앱바의 백 버튼 2. 안드로이드 시스템의 백 버튼 보통은 백 버튼의 기능을 그대로 사용해도 문제는 없다. 하지만 데이터가 입력된 폼이 있다면 사용자에게 입력을 취소할 것인지 묻는다든지, 비밀번호를 입력해야 앱을 사용할 수 있어야 한다면 백 버튼의 기능을 제어해야 한다. 여기서는 각각의 백 버튼을 제어하는 방법을 알아보겠다. 1. 앱바의 백 버튼 제어하기 MaterialPageRoute로 이동한 화면의 앱바에는 자동으로 백 ..
플러터에서 게비게이터(navigator)로 화면을 이동하는 코드를 작성하고 실행하였는데, 아래와 같은 에러가 발생했다. The following assertion was thrown while handling a gesture: Navigator operation requested with a context that does not include a Navigator. The context used to push or pop routes from the Navigator must be that of a widget that is a descendant of a Navigator widget. 에러 내용을 해석하면, '네비게이터에서 이동하려면 사용되는 콘텍스트(context)는 네비게이터 위젯의 하위 위젯..
안드로이드 스튜디오와 플러터 SDK를 설치하고, 첫 플러터 프로젝트를 생성해 보자. 1. 프로젝트 생성하기 먼저 플러터 앱 프로젝트를 생성해 보자. 안드로이드 스튜디오를 실행하고 New Flutter Project를 선택한다. 다음으로 Flutter SDK가 설치된 path를 설정해야 한다. 보통 자동으로 설정되니 Next를 클릭한다. Project name에 프로젝트 이름을 설정한다. 여기서는 first_app으로 하였다. 프로젝트 이름은 소문자와 _(언더바)로만 만들 수 있다. Organization은 세상에서 유일한 값이 되어야 한다. 보통 자신의 블로그나 웹 사이트의 도메인을 사용하면 된다. 여기서는 com.example.first_app으로 하였다. 이렇게 두 개만 설정하면 프로젝트를 생성할 수..
맥 OS에 플러터(flutter)를 설치해 보자. 현재 내 개발환경은 다음과 같다. macOS Monterey version 12.6.1 Mac Studio(2022) Apple M1 Max Memory 32GB 플러터 설치방법은 공식 사이트에 잘 나와 있다. 하지만 초보자에게는 생략된 몇몇 부분으로 인해서 설치가 힘든 것이 사실이다. https://docs.flutter.dev/get-started/install Install Install Flutter and get started. Downloads available for Windows, macOS, Linux, and Chrome OS operating systems. docs.flutter.dev 만일 자신의 CPU가 맥 실리콘이면 터미널에 다..