Flutter 51

[Flutter] Firebase + Kakao Login 로그인 기능 만들기

Flutter 에서 Firebase Authentication 과 Kakao Login 을 활용해서 카카오 로그인 기능을 만드는 방법 순서는 다음과 같습니다.1. Kakao 애플리케이션 생성 및 네이티브 앱 키 & Client Secret 키 생성2. Firebase OpenID Connect 셋팅3. Flutter 프로젝트 pubspec.yaml 파일에 kakao 패키지 추가4. 플랫폼별 설정 작업5. main() KakaoSDK 초기화 작업6. 로그인 코드 구현7. kakao developers 에서 각 플랫폼 등록8. kakao developers 로그인에서 OpenID Connect 활성화 설정 1. Kakao 애플리케이션 생성1. 애플리케이션 추가kakao developers 방문해서 애플리케이..

Dev/Flutter 2024.12.26

[Flutter] Json 데이터를 객체로 변환하는 방법

class Human { String name; int age; Human({required this.name, required this.age}); factory Human.fromJson(Map json) : this( name: json['name'], age: json['age'] );} fromJson() 는 JSON 데이터를 객체로 변환하기 위해 만들었습니다. 일반적으로, API 호출이나 파일 읽기 등의 작업에서 데이터를 JSON 형식으로 받는 경우가 많습니다.JSON 데이터는 Dart에서 Map 형태로 표현됩니다.하지만 JSON 데이터만으로는 객체지향 프로그래밍의 장점을 살리기 어렵습니다. 따라서, 이 데이터를 우리가 정의한 클래스 객체로 변환해야 할 필요가 있습니다..

Dev/Flutter 2024.12.03

함수형 위젯 vs 클래스형 위젯, 어떻게 하는게 좋을까?

Flutter 에서 함수형 위젯과 클래스형 위젯 선택을 어떻게 하면 좋을지에 대해서 공부한 내용을 공유합니다. 기본적으로 공식(?) 영상을 봤습니다만 생각보다 궁금한 부분들이 잘 해소되진 않았습니다.https://youtu.be/IOyq-eTRhvo?si=VSz-YpbZeAghi6kS   해당 유튜브 영상을 바탕으로 블로그, Medium 글들을 여럿 읽고 GPT와 열심히 대화를 하면서 학습을 했습니다. 학습을 통해서 얻은 내용을 요약하면 다음 4가지 입니다. 클래스형 위젯 vs 함수형 위젯, 4가지 결론1. UI 가 복잡하면 클래스형 위젯, 복잡하지 않으면 함수형 위젯2. 재사용을 할것이면 클래스형 위젯, 재사용하지 않을꺼면 함수형 위젯3. DevTools 로 디버깅 잘하고 싶으면 클래스형 위젯, 디버깅..

Dev/Flutter 2024.12.02

[Flutter] 버튼 Radius 주는 방법은 Style 로!!!

여러가지 버튼 위젯으로 BorderRadius(테두리) 를 변경하는 방법을 설명하고자 한다. 설명에는 ElevatedButton, TextButton, OutlinedButton 을 활용한 변경과 기본적인 Container 를 사용한 방법을 소개한다.1. ElevatedButton 테두리 변경하기ElevatedButton( onPressed: () { // 버튼 클릭 시 동작 }, style: ElevatedButton.styleFrom( shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular(16), ), ), child: Text("Rounded Button"),)1.1 ElevatedButton 에서 ..

Dev/Flutter 2024.11.18

Flutter DropdownButton 글자 중앙정렬

Flutter 에서 DropdowButton 의 텍스트를 중앙정렬 하기 위한 방법 1. DropdownButton 을 최대로 확장한다. DropdownButton( isExpanded: true, ... ) 2. DropdownButton 의 DropdownMenuItem 에서 child 를 Center 로 감싸준다. return DropdownMenuItem( value: value, child: Center( child: Text( value, textAlign: TextAlign.center, ), ), ); https://stackoverflow.com/a/63995395/3897810 How to center text in DropdownButton? I'm trying to make the D..

Dev/Flutter 2023.12.16

Flutter - Cannot provide both a color and a decorationTo provide both, use "decoration: BoxDecoration(color: color)".

오류 Cannot provide both a color and a decoration To provide both, use "decoration: BoxDecoration(color: color)". 'package:flutter/src/widgets/container.dart': Failed assertion: line 270 pos 15: 'color == null || decoration == null' 이유 Container 위젯 안에 색 설정이 중복으로 들어가서 발생한 오류이기에, BoxDecoration 에서만 배경색을 설정하면 된다. 잘못된 형식 Container( decoration: BoxDecoration( color: Colors.red, ... ), ... color: Colors...

Dev/Error 2023.11.24

Flutter - ../../../.pub-cache/hosted/pub.dev/watcher-1.0.2/lib/src/constructable_file_system_event.dart:7:57: Error: The class 'FileSystemEvent' can't be extended, implemented, or mixed in outside of its library because it's a sealed class.

오류 ../../../.pub-cache/hosted/pub.dev/watcher-1.0.2/lib/src/constructable_file_system_event.dart:7:57: Error: The class 'FileSystemEvent' can't be extended, implemented, or mixed in outside of its library because it's a sealed class. Dart 을 업그레이드 해주니 해결 dart pub upgrade 해결 : https://github.com/dart-lang/sdk/issues/52570 Watcher fails with `class 'FileSystemEvent' can't be extended`, for dart, no..

Dev/Error 2023.11.24

Flutter TextField 에 텍스트 입력하는 방법

1. (사용할 곳 어딘가에) TextField() 위젯을 생성 ... TextFiled() ... 2. TextField 위젯에 넣을 컨트롤러 생성 var textFieldEditingController = TextFieldEditingController(); 3. 위의 콘트롤러를 TextField 위젯에 넣기 TextField(controller: textFieldEditingController); 4. TextFiledEditingController 의 text 함수에 텍스트를 넣으면 된다. textFieldEditingController.text = '입력하고자 하는 텍스트';

Dev/Flutter 2023.10.27