코딩전사의 기록

[Flutter] Facebook Login ① - 준비 소셜 로그인 구현 첫번째는 페이스북 로그인 입니다. 파이어베이스 사용여부와 상관없이 세팅방법은 똑같습니다. Meta for Developers Conversations 2022: 제1회 Meta 비즈니스 메시지 콘퍼런스 가장 인기 dalgoodori.tistory.com 이전 포스팅에서 페이스북 로그인을 위한 모든 셋팅을 완료하였습니다. 이번 포스팅에서는 페이스북 로그인을 구현하고 유저의 이메일, 이름을 가져오는 것 까지 구현해보겠습니다. pubspec.yaml flutter_facebook_auth | Flutter Package The easiest way to add facebook login to your flutter app. Featur..

소셜 로그인 구현 첫번째는 페이스북 로그인 입니다. 파이어베이스 사용여부와 상관없이 세팅방법은 똑같습니다. Meta for Developers Conversations 2022: 제1회 Meta 비즈니스 메시지 콘퍼런스 가장 인기 있는 메시지 플랫폼에서 더욱 빠르고 개선된 경험을 구축하고자 하는 비즈니스, 개발자 및 파트너를 위한 제1회 콘퍼런스를 개최 developers.facebook.com 앱 만들기 로그인 후 '내 앱' 클릭 '앱 만들기' 클릭 유형은 소비자 , 상세정보에서는 표시할 이름을 넣어줍니다. 대시보드에서 제품추가 >> Facebook 로그인 설정 을 눌러줍니다. Android 설정 빠른 시작에서 안드로이드를 눌러줍니다. 1,2 번은 생략하고 3번에서 패키지 이름과 패키지 이름.MainA..

Firebase Firebase는 고품질 앱을 빠르게 개발하고 비즈니스를 성장시키는 데 도움이 되는 Google의 모바일 플랫폼입니다. firebase.google.com Firebase 프로젝트 추가 로그인 후 콘솔로 이동하여 프로젝트 추가를 누릅니다. 프로젝트 이름을 정한 후 생성해줍니다. 앱 추가 프로젝트가 생성되었으면 Flutter 를 눌러 앱을 추가해주세요. Firebase CLI 설치 터미널에서 아래의 명령어 들을 써주세요. 설치 후 firebase 로그인 하면 끝납니다. curl -sL https://firebase.tools | bash firebase login FlutterFire CLI 설치 dart pub global activate flutterfire_cli flutterfire..

이전 포스팅에서 photo_manager 를 통해 기기의 이미지 정보들을 불러와서 일부 기능들을 구현했습니다. [Flutter] photo picker - ① photo_manager 를 이용하여 간단한 photo picker 를 구현하려고 합니다. photo_manager 의 기본 셋팅과 사용법은 아래 링크에서 확인해주세요. [Flutter] photo_manager 디바이스의 이미지 정보를 불러오고 싶을.. dalgoodori.tistory.com 파란 부분까지가 이전 포스팅에서 구현했던 부분이고 이번 포스팅에서는 이미지 선택, 해제 부분을 구현하겠습니다. 기기에 저장되어있는 이미지 목록을 불러온다. 이때 이미지는 그리드 형태로 한 줄에 3개 보여줍니다. 드롭다운 형태로 앨범 이동이 가능해야 하며 '..

간단하게 기기의 이미지를 가져올 수 있는 image_picker 에 대해서 간단하게 포스팅 합니다. image_picker | Flutter Package Flutter plugin for selecting images from the Android and iOS image library, and taking new pictures with the camera. pub.dev pubspec.yaml dependencies: image_picker: ^0.8.5+3 ios / Runner / Info.plist http://www.apple.com/DTDs/PropertyList-1.0.dtd"> . . . // 추가 NSCameraUsageDescription Used to demonstrate imag..

photo_manager 를 이용하여 간단한 photo picker 를 구현하려고 합니다. photo_manager 의 기본 셋팅과 사용법은 아래 링크에서 확인해주세요. [Flutter] photo_manager 디바이스의 이미지 정보를 불러오고 싶을 때 유용한 photo_manager 에 대해서 포스팅 합니다. photo_manager | Flutter Package A Flutter plugin that provides assets abstraction management APIs on Android,.. dalgoodori.tistory.com 구현하려는 photo picker 의 기능은 다음과 같으며 이번 포스팅에서는 빨간 글씨로 된 부분까지만 구현하겠습니다. 기기에 저장되어있는 이미지 목록을 불..

디바이스의 이미지 정보를 불러오고 싶을 때 유용한 photo_manager 에 대해서 포스팅 합니다. photo_manager | Flutter Package A Flutter plugin that provides assets abstraction management APIs on Android, iOS, and macOS. pub.dev 셋팅 pubspec.yaml dependencies: photo_manager: ^2.1.4 android/app/src/main/AndroidManifest.xml

TabBar TabBar 는 TabController 와 List 인 tabs 를 필수로 받습니다. TabBar( controller: _tabController, tabs: [ Tab(text: 'First'), Tab(text: 'Second'), Tab(text: 'Third'), ], ) 속성 1. Indicator 현재 선택된 탭의 위치를 나타내는 indicator 를 꾸미는 인자는 다음과 같습니다. // indicator 의 색상 설정 indicatorColor: Colors.black, // indicator 색상 자동 설정 여부 automaticIndicatorColorAdjustment: true, // indicator 의 굵기 설정 indicatorWeight: 2.0, // indi..

웬만한 앱에는 다 있는 BottomNavigationBar 에 대해서 포스팅 합니다. BottomNavigationBar Scaffold 내부에 bottomNavigationBar 를 통해 구현합니다. BottomNavigationBar 위젯에 List items 속성을 필수로 받습니다. import 'package:flutter/material.dart'; class SampleScreen extends StatefulWidget { const SampleScreen({Key? key}) : super(key: key); @override State createState() => _SampleScreenState(); } class _SampleScreenState extends State { @ove..

http 통신을 위해 사용되는 dio 에 대해서 포스팅 합니다. dio | Dart Package A powerful Http client for Dart, which supports Interceptors, FormData, Request Cancellation, File Downloading, Timeout etc. pub.dev pubspec.yaml dependencies: dio: ^4.0.6 사용 void main() async { final dio = Dio(); // get await dio.get('path'); // add queryParameters await dio.get('path', queryParameters: { 'page' : 1, "order" : "desc" }); //..