오늘하루도 우힣ㅎ

Flutter가 버전 2.0이 발표 된이후 가장 큰 변경점중 하나가 Null safety라고 생각합니다.. Swift에서 옵셔널의 기능과 비슷하다고 생각하면 될거 같습니다. 처음에 해당 기능을 사용 할때는 헷갈리기도 했고, 초기에 항상 값을 하나 정해주면 굳이 필요할 기능일까 라는 생각도 했지만 사용에 익숙해지고 나서는 없어서는 안될 기능이 된거 같습니다. Null Safety 잘못 보면 Null을 아예 없애는 코딩을 해야 한다라고 보일수도 있습니다. 그런 의미는 아니고 개발중 런타임에 null을 참조 했다는 에러를 한번쯤은 봤을 거라고 생각합니다. 이때문에 개발에 대한 속도가 늦춰지는 경우고 있습니다. 이와 같은 상황을 피해가기 위해서 Null Safety가 도입이 됐습니다. Null Safety는 컴..

생각보다 처음 flutter를 시작할때 Column과 Row를 사용하는데 애를 먹고는 했던 기억이 갑자기 나서 블로그로 남겨 볼까 한다. 사실 따로 쓰게 되면 쉽게 사용하게 되는데 필요에 따라 Column과 Row를 섞어 쓰게 될때 혼돈이 왔던거 같다. Column과 Row는 열과 행으로 생각하면 된다. Column1, Column2, Column3... / Row1, Row2, Row3... 과 같이 이들은 모두 children에 들어가는 순서와 같다. Column -Column은 세로용 레이아웃이라 생각하자! Column1 Column2 Column3 Column4 Column5 Column의 optional parameter에는 MainAxisAlignment와 CrossAxisAlignment가 ..

어플을 사용할때 한번 로그인을 하게 되면 계속해서 로그인이 유지 되는것을 볼 수 있다. 사용할때는 당영하다고 생각을하고 편리함을 잊고 살고는 한다. 하지만 자동 로그인이 없다면 어플을 실행할때마다 다시 로그인을 해야하는 귀찮은 과정을 겪어야 한다. 이는 사용자들의 이탈을 불러일으키게 될 것이다. 이에 자동 로그인 기능을 만들어 내기 위해서 flutter_secure_storage를 사용하려 한다. flutter secure storage는 플랫폼별로 다른 형식으로 작동을 하는데 ios의 경우 KeyChain방식을 이용하고, android의 경우 KeyStore방식이 사용이 된다. KeyChain과 KeySotre에 대한 정확한 정보를 확인하고 싶으면 아래의 사이트에서 확인을 할 수 있습니다. - KeyC..

flutter.dev/docs/development/ui/animations/hero-animations Hero animations How to animate a widget to fly between two screens. flutter.dev 이런 저런 앱을 만들다 보면 앱이 너무 단조로워 보일때가 있습니다. 이럴때 마다 페이지가 넘어가는 곳에 애니메이션을 바꿔 보기도 하고 swipe 효과를 주기도 했습니다. 하지만 앱을 화려(?)하게 만드는데 있어 가장 최고는 Hero Animation이 아닐까 싶습니다. 정말 몇줄 안되는 코드로 좀 더 직관적이고 풍부한 앱을 만들수 있는 것 같습니다. 별로 어렵지 않으니 바로 코드로 들어가겠습니다!! 파일은 이 두가지만 있으면 됩니다. 더불어 yaml파일에 아무..

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..

학생 편의를 위한 어플리케이션을 동아리원들과 함께 만들고 있다. 그 중 학교내 행사를 등록하고 보여줄수 있는 페이지가 있다. 하지만 하나의 이미지만으로는 해당 행사가 어떤것임을 제대로 알려주지 못하는 경우도 있고 여러가지의 사진을 한번에 넣을수 있도록 하는게 더 좋을것 같다는 의견이 있었다. 그래서 해당 기능을 찾다 보니 multi_image_picker라는 좋은 패키지가 있었다. 해당 패키지는 아래에 링크에 존재한다. https://pub.dev/packages/multi_image_picker#-readme-tab- multi_image_picker | Flutter Package Flutter plugin that allows you to display multi image picker on iOS..

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

학교에서 2명의 사람과 함께 산학프로젝트를 하면서 각자 맡은 부분에대해 UI를 만든적이 있다. 이때 각자 디자인을 보고 다른 글자크기, 자간, 색상등을 사용하여 나중에 통일시키는 작업을 하는데 큰 애를 먹었었다(아직도 그런 곳들이 있어서 너무 힘들다...언제 다 통일을 시키지...). 이와 같은 번거로운 일을 하지 않기 위해서는 Theme을 사용하는것이 중요하다. Flutter 의 THEME는 앱전체에서 특정한 색상이나 글꼴을 통일시켜주기 위해서 사용이 되어진다. 또한 전체가 아닌 설정한 THEME를 통해 부분적으로 변화를 주거나, 부분적으로 적용이 가능하기도 하다. 1. 시작 코드는 아래와 같다. main.dart에서는 first_page.dart를 부른다. first_page에서는 메인에서 선언한 테..