form (6) 썸네일형 리스트형 [Flutter] Clone - 당근마켓36(ItemModel upload - validators) 지난번에 "거래 등록" 화면에 작성한 글/이미지를 Firebase 에 업로드하는것을 구현한 이후 폼빌더 및 검증 패키지 를 이용한 데이터 유효성 검증 방법을 구현해 보겠습니다. 개발환경 : 윈도우11, 안드로이드 스튜디오, flutter 3.0.1 구현된 화면 이미지는 아래와 같습니다. 이미지와 카테고리 선택에 대한 검증은 if 문으로 처리하였습니다. 필요한 패키지는 아래와 같습니다. flutter_form_builder: ^7.6.0 form_builder_validators: ^8.3.0 ./src/screens/input/input_screen.dart - 전체 코드는 "더보기" 클릭하세요 더보기 import 'dart:typed_data'; import 'package:extended_image/.. [Flutter] Clone - 당근마켓7(PageView - auth page) 이번에는 PageView 의 내부에 auth page 를 추가해보겠습니다. 개발환경 : 윈도우11, 안드로이드 스튜디오, flutter 3.0.1 새로운 페이지 이름이 기존 페이지인 auth_screen 과 비슷하여 이름을 수정하였습니다. auth_screen.dart => start_screen.dart AuthScreen() => StartScreen() 화면 구성은 아래와 같습니다. 자세한 기능은 모델링도 필요하여 차후에 구현하겠습니다. 새로운 패키지 추가 - 입력값을 쉽게 검증하기 위함 flutter_multi_formatter: ^2.5.8 start_screen.dart - 새로운 페이지 추가 class StartScreen extends StatelessWidget { StartScreen(.. [Flutter] Widgets - FormBuilder 4 이번 카테고리는 form 관련 위젯인 FormBuilder 에 대해서 알아보겠습니다. 입력받은 정보를 다른 페이지에 전달하는 방법에 대해서 알아보겠습니다. 개발환경 : 윈도우11, 안드로이드 스튜디오, flutter 3.0.1 소스코드 위치 - Release 06_data_transfer · mike-bskim/flutter_form_builder_test · GitHub Release 06_data_transfer · mike-bskim/flutter_form_builder_test github.com 화면은 아래와 같습니다. main.dart 수정 - 데이터를 정리하여 다음 페이지로 전달. // final inputValues = _fbKey.currentState!.value; Map tempVal.. [Flutter] Widgets - FormBuilder 3 이번 카테고리는 form 관련 위젯인 FormBuilder 에 대해서 알아보겠습니다. 라디오버튼, 체크박스에 대해서 알아보겠습니다. 개발환경 : 윈도우11, 안드로이드 스튜디오, flutter 3.0.1 소스코드 위치 - Release 05_radio&checkBox · mike-bskim/flutter_form_builder_test · GitHub Release 05_radio&checkBox · mike-bskim/flutter_form_builder_test github.com 화면은 아래와 같습니다. main.dart 에서 추가된 부분만 표시하겠습니다. 전체 소스는 상단의 "소스코드 위치"를 참고하시기 바랍니다. FormBuilderRadioGroup( name: 'urgent', orienta.. [Flutter] Widgets - FormBuilder 2 이번 카테고리는 form 관련 위젯인 FormBuilder 에 대해서 알아보겠습니다. 개발환경 : 윈도우11, 안드로이드 스튜디오, flutter 3.0.1 소스코드 위치 - Release 04_dropdown&TypeAhead&TextField · mike-bskim/flutter_form_builder_test · GitHub Release 04_dropdown&TypeAhead&TextField · mike-bskim/flutter_form_builder_test github.com 화면은 아래와 같습니다. 관련 패키지들 flutter_form_builder: ^7.3.1 form_builder_validators: ^8.1.1 flutter_typeahead: ^4.0.0 // FormBuilde.. [Flutter] Widgets - FormBuilder 이번 카테고리는 form 관련 위젯인 FormBuilder 에 대해서 알아보겠습니다. 개발환경 : 윈도우11, 안드로이드 스튜디오, flutter 3.0.1 소스코드 위치 - Release 03_start&end_date · mike-bskim/flutter_form_builder_test · GitHub Release 03_start&end_date · mike-bskim/flutter_form_builder_test github.com 화면은 아래와 같습니다. 관련 패키지들 flutter_form_builder: ^7.3.1 form_builder_validators: ^8.1.1 intl: ^0.17.0 main.dart import 'package:flutter/material.dart'; imp.. 이전 1 다음
