오늘하루도 우힣ㅎ

앞에서 만들었던 Todo List를 이어서 만들어 보려고 합니다. 앞에서는 간단히 모델, 데이터를 보여주는 리스트, 체크 박스를 눌렀을때의 반응, listTile을 눌렀을때의 반응에 대한 기본적인 동작에 대해 다루었습니다. 여기서 부터는 실제로 데이터를 추가하는 방법에 대해 포스팅을 할려 합니다. 그러기 위해서는 미리 만들어 두었던 Todo Add page의 layout을 짜야 합니다. 1. todo_add.dart에 레이아웃 짜기 레이아웃의 경우 아래처럼 짤려고 합니다. 그러기 위해서는 2개의 텍스트 컨트롤러, 하나의 Raised Button, 마지막으로 달력을 보이게 할수 있는 것을 만들어야 합니다. 전의 포스팅 처럼 코드를 올리고 각각에 주석을 다는 형식으로 진행을 하겠습니다. import 'pac..

앱을 만들때도 웹을 만들때도 가장 흔한 예제중 하나는 Todo List이다. 이 Todo List를 Bloc을 통하여 만들어 볼려 한다. 이미 많은 예제 들과 많은 형식들이 존재 하지만 Bloc을 이해하기에 좋은 예라고 생각이 되어 적어 볼려한다. 디렉토리 구조는 다음과 같다. lib |____blocs | |_____todoBloc | |____bloc.dart | |____todo_bloc.dart | |____todo_state.dart | |____todo_event.dart |____models | |____todoModel.dart | |____main.dart |____todo_add.dart |____todo_list.dart 이번 포스팅에서는 기본적으로 List 들로 데이터를 띄우는 것에..

bloc에 대한 설명은 했지만 flutter에서 사용하는 bloc widget을 설명하지 않아 두번에 거쳐 포스팅 하려한다. 기본적인 내용은 https://bloclibrary.dev/#/flutterbloccoreconcepts?id=blocbuilder 에서 참고하여 적은 것들이다. flutter에서는 flitter_bloc이란 dart pakage를 제공하여 준다. 해당 패키지는 아래의 페이지서 볼 수 있으며 사용전 pubspec.yaml파일에 추가할수 있도록 하자! https://pub.dev/packages/flutter_bloc flutter_bloc | Flutter Package Flutter Widgets that make it easy to implement the BLoC (Busin..

앞의 포스팅에서는 BLoC에 대한 정보를 알아 보았다. 이 포스팅에서는 플러터 프로젝트 처음생성시 만들어지는 couter를 BLoC으로 만들어보려 한다. 1. 파일 구조 파일 구조는 lib folder 아래에 bloc 폴더를 만들고 그안에 필요한 bloc floder를 만든다. 프로젝트가 거대해지면 그만큼 많은 수의 bloc들이 생기게 될것이고 그것을 쉽게 관리하기 위해 bloc별로 폴더를 만들어 관리하는 것이 더 쉽다고 느꼈다. UI부분과 BLoC부분을 나누어 주는데 확실한 구분점들 두기 위해 나는 UI부분들은 Page 폴더를 만들어 모아 두는 것을 선호한다. 해당 예제는 main.dart하나에서 모두 관리가 가능하기에 따로 나누지는 않았다. 2. main.dart 분석 class _MyHomePage..

1. BLoC의 개요 UI와 Business Logic을 분리하여 만드는 방식을 의미한다. Flutter의 state를 관리하는 디자인 패턴중 하나이다. 이를 통하여 UI와 state코드를 분리 시킬수있다. - State 관리란? 사용자의 행동에 따라 바뀌게 되는 데이터들을 의미한다 기존의 SetState를 사용하게 되면 한 페이지에서 사용하던 데이터를 다른페이지에서 사용할때 코드가 꼬여 버릴 가능성이 커지게 된다. - BLoC의 장점 UI코드 쪽에서는 UI만 건들면 되고, BLoC쪽에서 대부분의 Logic을 생각할수가 있다. 협업시 다른사람이 만들어 놓은 BLoC을 새로이 만들필요 없이 재사용이 가능하다. setState()를 사용하는 것 보다 코드를 더 단순하게 만들수가 있다. - BLoC속 주요 개..