개발 기록

맥 환경에서 fvm을 사용하여 flutter sdk 버전 관리하는 방법이다. 특정 프로젝트를 빌드할 때, 특정 버전을 사용해야 하는 경우 내 로컬 자체의 flutter 버전을 변경하지 않고,해당 프로젝트에서만 특정 버전을 사용해야 할 필요가 있을 때 fvm을 사용한다. 설치brew install fvm 환경변수 등록터미널에서,vi ~/.zshrc를 한 후,export PATH=$PATH:/Users/사용자이름/fvm/default/binexport PATH="$PATH":"$HOME/.pub-cache/bin"export PATH=/opt/homebrew/bin:$PATH를 추가한다.i 누르면 수정 모드, exc누르고 :wq 하면 저장하면서 닫힙니다.이후source~/.zshrc를 꼭꼭 해줘야 적용된다...

요즘 flutter에서 모델을 선언할 때  json_serializable나 freeze를 통해 code generator로 구현하는 경우가 많다.하지만 code generator에 의존하는 것은 좋다고만 할 수 없다. 왜냐하면 패키지에 의존하는 것이기 때문에, 패키지 지원이 중단될 경우 엄청난 유지보수가 필요할수가 있다. 또한 generate 된 코드 파일은 git에 올라가지 않도록 하는 경우가 대부분이다. 따라서 프로젝트를 가져와서 build runner를 실행하기 전까지는 숨겨진 코드이기 때문에 문제가 발생할 수 있다.  따라서 VS Code에서 지원하는 Dart Data Class Generator를 사용해보았다. https://marketplace.visualstudio.com/items?ite..

Riverpod을 사용하여 개발할 때 StateProvider나 StateNotifierProvider 등을 직접 작성하지 않고,riverpod_annotation을 통해 코드를 생성하는 방법이다. 공부할때는 StateProvider나 StateNotifierProvider을 작성하는 방법으로 공부하였지만, 실제 프로젝트에서 사용할때는 code generation을 통해 작업을 하였다. 사용 패키지flutter_riverpod: ^2.4.9riverpod_annotation: 2.3.3riverpod_generator: 2.3.9build_runner: 2.3.3 flutter pub add flutter_riverpod &&flutter pub add riverpod_annotation &&flutte..

flutter로 개발을 하다보면 위 사진처럼 상단에 import 코드가 너무 많아져서 지저분한 경우가있다. 이 글은 여러 파일에서 사용되는 import 코드를 하나의 파일로 모으고, 지저분한 import코드들을 정리하기 위해library와 part를 사용하여 import코드를 없애는 방법이다. library와 part를 사용하여 import문을 최소화 하는 것은 dart공식문서에도 가이드라인으로 나와있다.https://dart-ko.dev/guides/language/effective-dart/usage 설명 코드는 따로 작성해보았다.   임의로 Class 3개를 만들었다.    그리고 다음과 같이 3개의 Class를 main.dart 와 home.dart에서 사용하기위해 import를 하였다.보다시피..

Flutter에서 기본으로 제공해주는 GridView는 childAspectRatio 속성을 통해 가로세로의 비율을 정하기 때문에,Item의 width와 height를 지정해줄 수 없다.하지만 flutter_staggered_grid_view를 사용하면 지정해줄 수 있다. https://pub.dev/packages/flutter_staggered_grid_view flutter_staggered_grid_view | Flutter packageProvides a collection of Flutter grids layouts (staggered, masonry, quilted, woven, etc.).pub.devflutter_staggered_grid_view 패키지를 사용한다. import 'pac..

flutter 의 get 패키지를 활용하여 MVC와 MVVM 패턴으로 간단한 카운터 기능을 구현해보았다. MVC패턴과 MVVM패턴의 가장 큰 차이는 View와 Controller의 의존성이다. MVC패턴에서 사용자 요청을 처리해야할 때,Controller는 View에 대한 정보를 가지고 있고, 사용자 요쳥에 대한 처리 값을 그 View에 반환해주는 역할을 한다. MVVM패턴에서 사용자 요청을 처리해야할 때,ViewModel은 View에 대한 정보를 가지고 있지 않고, 사용자 요청에 대해서 처리를 했다는 것만 알려주며, 그 변화에 대해 View를 업데이트 하는 것은 View에서 처리한다.  아래는 예제 코드이다.MVC 예제코드import 'package:flutter/material.dart';import..

enum Fruits { apple('red', 1000, true), banana('yellow', 1500, false), grape('purple', 2000, true), ; final String color; final int price; final bool favorite; const Fruits(this.color, this.price, this.favorite); // 특정 색깔인 과일 찾기 factory Fruits.getByColor(String fruitColor) { return Fruits.values .firstWhere((value) => value.color == fruitColor); } } print(Fruits.apple.color); // output : red pri..

Parse Issue (Xcode): Module 'sqflite' not found 에러 해결 rm ios/Podfile flutter build ios

Tabbar 위젯 기본 코드 import 'package:flutter/material.dart'; /// Flutter code sample for [TabBar]. void main() => runApp(const TabBarApp()); class TabBarApp extends StatelessWidget { const TabBarApp({super.key}); @override Widget build(BuildContext context) { return MaterialApp( theme: ThemeData(useMaterial3: true), home: const TabBarExample(), ); } } class TabBarExample extends StatelessWidget { con..

flutter에서 좌측에 고정된 사이드바를 구현하였다. 일반 모바일폰이 아닌 태블릿이나 웹에서 사용하기 용이하다. 모바일폰에서는 sidebar 보다는 drawer을 많이 사용하는 것 같다. 패키지 설치 flutter pub add sidebarx 전체 예제 코드 공식 문서에 있는 example이다. 주석에도 간단하게 설명되어있지만 아래에서 주요 파라미터만 뽑아서 다시 정리하였다. import 'package:flutter/material.dart'; import 'package:sidebarx/sidebarx.dart'; void main() { runApp(NavHome()); } class NavHome extends StatelessWidget { NavHome({Key? key}) : super(..