GETX (25) 썸네일형 리스트형 [Flutter] Clone - 당근마켓33(InputScreen - image picker/Getx) 이번에는 InputScreen 의 image picker 부분을 getx 로 구현해보겠습니다. 이전에는 multi_image_select.dart 에서 구현했으나 상위 화면인 InputScreen 에서도 접근이 필요해서 getx 로 구현합니다. 개발환경 : 윈도우11, 안드로이드 스튜디오, flutter 3.0.1 오늘 구현한 화면은 아래와 같습니다. refactorying 한 기능이 정상적으로 동작한다. ./src/router/locations.dart - Controller 추가 GetPage( name: '/input', page: () => const InputScreen(), transition: Transition.fadeIn, binding: BindingsBuilder((){ Get.put.. [Flutter] Clone - 당근마켓29(InputScreen - category 구현) 이번에는 InputScreen 의 category 부분을 getx 로 구현해보겠습니다. 개발환경 : 윈도우11, 안드로이드 스튜디오, flutter 3.0.1 오늘 구현한 화면은 아래와 같습니다. 카테고리 항목을 선택후 수정할때는 이전에 선택한 항목의 색상이 변경되어 있다. 파일명 변경 user_state.dart --> user_controller.dart ./src/states/category_controller.dart - 카테고리 관리는 getx 로 구현하였습니다. index 를 이용하여 영문/한글 값을 찾고, 찾은 값을 이용하여 카테고리 정보는 영문 값으로 저장 import 'package:get/get.dart'; class CategoryController extends GetxControl.. [Flutter] Clone - 당근마켓22(userModel 구현) 이번에는 사용자 정보(userModel)를 실제 쓰고, 읽기를 구현해보겠습니다. 개발환경 : 윈도우11, 안드로이드 스튜디오, flutter 3.0.1 ./src/repo/user_service.dart import 'package:cloud_firestore/cloud_firestore.dart'; import '../constants/data_keys.dart'; import '../models/user_model.dart'; class UserService { // 싱글톤 디자인 패턴 *************************************** // 인스턴스가 한번만 생성되고, 2번째 생성시에는 처음 생성한 인스턴스를 리턴, static final UserService _userServi.. [Flutter] Design Pattern - MVC, MVVM with GetX, Provider 이번에는 Getx 와 Provider 를 이용하여 MVVM 을 구현해보겠습니다. 개발환경 : 윈도우11, 안드로이드 스튜디오, flutter 3.0.1 GetX 로 구현한 샘플입니다. // mvvm_getx_controller.dart import 'package:get/get.dart'; import '../model/model.dart'; class MVVMGetXController extends GetxController { late Model model; RxInt count = 0.obs; @override void onInit() { super.onInit(); model = Model(); } void incrementCounter() { model.incrementCounter(); // .. [Flutter] Quiz - level3(Getx login) 이번에는 코딩셰프 도장깨기 레벨2 입니다. 개발환경 : 윈도우11, 안드로이드 스튜디오, flutter 3.0.1 소스코드 위치 - Release 02_done · mike-bskim/dojang_level3 · GitHub Release 02_done · mike-bskim/dojang_level3 github.com 미션은 아래와 같습니다. 1. lgoin 기능 구현 2. 웰컴 페이지 이동시 인디케이터 추가 3. 사용자 이메일 주소를 윌컴 페이지에서 보이게 추가 4. 보너스 문제, sign up 할때 사용자 이름도 입력받고 그걸 Storage 에 user 컬렉션 아래에 추가할것. 화면은 아래와 같습니다. main.dart import 'package:firebase_core/firebase_core... [Flutter] Clone - 당근마켓8(authorization-login) 이번에는 auth page 에서 인증 성공후 Home Screen 으로 이동하는 기능을 추가해보겠습니다 (실제 사용자관리는 차후 예정). 개발환경 : 윈도우11, 안드로이드 스튜디오, flutter 3.0.1 기존에 네비게이션을 beamer 와 getx 로 이중으로 진행하였는데, beamer 보다 getx 가 가성비가 좋은거 같아서 이후로는 getx 로 네비게이션을 구현할 예정입니다. 특히, beamer 의 BeamGuard 의 기능은 GetX 에서는 middlewares 로 구현 가능하다. 그래서 상태관리도 GetX 로 구현할 예정입니다. 화면 흐름은 아래와 같다. ./src/apple_app.dart - refactorying 및 initialBinding 추가 import 'package:beame.. [Flutter] Clone - 당근마켓2(Navigation) 이번에는 Navigation 관련 2가지 패키지에 대해서 알아보겠습니다. Beamer, GetX 를 이용한 네비게이션에 대해서 알아보겠습니다. 개발환경 : 윈도우11, 안드로이드 스튜디오, flutter 3.0.1 기본 화면 이동은 아래와 같습니다. 관련 패키지는 아래와 같습니다. 버전은 현재 최신 버전을 사용합니다. get: ^4.6.5 beamer: ^1.5.0 ./src/apple_app.dart import 'package:apple_market3/src/middleware/check_auth.dart'; import 'package:beamer/beamer.dart'; import 'package:flutter/material.dart'; import 'package:get/get.dart'; .. [Flutter] Widgets - FCM(Firebase Cloud Messaging) 이번 카테고리는 Firebase Cloud Messaging 에 대해서 알아보겠습니다. 개발환경 : 윈도우11, 안드로이드 스튜디오, flutter 3.0.1 소스코드 위치 - Release 04_FCM_latest_upgrade · mike-bskim/FCM_test · GitHub Release 04_FCM_latest_upgrade · mike-bskim/FCM_test github.com 초기 화면은 아래와 같습니다. 기본적인 Firebase 설정은 아래 설정을 참고하세요. 1,2번까지만 설정하면 됩니다. 단, SHA1 부분은 필요없습니다. (3. Firebase 프로젝트에서 구글 인증 활성화 부터 필요없습니다.) 2021.08.06 - [Flutter/01 SNS login] - [Flutter.. 이전 1 2 3 4 다음 목록 더보기
