flutter32 Flutter 화면 나누기 (Row, Column, Expanded) 안녕하세요 !! 오랜만에 Flutter로 찾아뵙습니다! 오랜만에 해보니 그사이 화면 나누는 방법도 까먹었더라구요. 제 자신의 블로그에서 찾아볼려 했지만 없었어요 (과거의 저는 미래의 저에게 친절하지 않았어요... ) 이번 강좌에서는 1. 위젯을 가로로 배치하는 방법 2. 위젯을 세로로 배치하는 방법 3. 내부 정렬 방법 4. 차지한 영역을 비율로 나누는 방법 에 대해 배워보겠습니다 기본적인 예제 화면 import 'package:flutter/material.dart'; void main() { runApp(MyApp()); } class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return Materia.. 스터디/Flutter+Dart 2021. 3. 1. Flutter IDE툴은 뭘로? (VSCode, AndroidStudio) 저도 처음엔 안드로이드 개발이 아니니까 웹 개발할때 많이 사용하던 VSCode나 써볼까하는 생각에 VSCode를 먼저 접했었습니다. 그래서 제 블로그엔 Flutter VSCode 세팅법이 적혀있습니다 ㅎㅎ 오랬동안 사용하면서 이것저것 비교를 하게 되고 결국엔 AndroidStudio로 갈아 탔습니다 IDE툴 스크린샷 비교 개발하면서 비교할 것들이 많지만 제가 AndroidStudio로 넘어가게된 결정적 요인을 말씀드리겠습니다 1. 단축키 안드로이드 개발 10년차에 Android Studio의 단축키는 정말 손에 익어서 VSCode를 사용하게 되면 개발 속도가 조금이나마 하락하는게 느껴졌었습니다.. 그래서 익숙한 AndroidStudio를 쓰기로 정했습니다. 2. Gradle Sync VSCode에서 간혹.. 스터디/Flutter+Dart 2019. 10. 8. flutter android.support.v4.content does not exist, cannot find symbol ActivityCompat, ContextCompat 뭔가 검색을 해도 마땅한게 안나오고... 하란대로 해봐도 잘 안되고;;. android 문제같긴한데... Package 패키지가 만들어지는 시점에서 여러가지 빌드 환경이 주어지게 됩니다. 빌드 환경이 조금만 달라도 빌드가 안될 수 있기 때문에 신경써서 맞춰줘야 합니다. 왠만하면 gradle버전, compileSdkVersion, minSdkVersion까지 맞추는걸 추천합니다. AndroidX (제트팩 라이브러리) 안드로이드 팀에서 여러가지를 지원하는 라이브러리(SupportLibrary)를 각각 제공하다가, 최근에 AndroidX 통합 라이브러리를 제공하기 시작했고, Android 9.0(API 28) 이상부터는 AndroidX를 사용이 필수가 되었습니다. 그래서 발빠른 flutter package 개.. 스터디/Flutter+Dart 2019. 9. 27. Flutter AndroidStudio에서 명령어로 스크린샷 찍기 안녕하세요~ 이번 강좌에서는 안드로이드 스튜디오에서 플러터를 빌드했는데 스크린샷은 어떻게 찍을까? 하고 고민하시는 분들을 위해 작성된 게시글 입니다! 0. 플러터 세팅을 다 한 전제하에 소개하겠습니다 1. 터미널 실행 2. 기기명 알아내기 스크린샷을 찍으려면 먼저 기기명을 알아야합니다 $flutter devices 명령어을 실행한 결과 총 2개의 기기가 검색되었고, 이름은 [SM G935L], [iPhone Xr] 이네요 3. 스크린샷 명령어 사용 앞서 말한 기기명과 스크린샷 명령어를 같이 입력해야 합니다. 기기명은 스페이스바도 인식하니까 위에서 알아낸 'SM G935L'을 적어보겠습니다 $flutter screenshot -d SM G935L 명령어를 실행하면 잠시 뒤에 스크린샷이 저장되었다는 결과가 .. 스터디/Flutter+Dart 2019. 9. 19. Flutter FCM (Firebase Cloud Messaging) 적용부터 사용까지 (Android, iOS) 이번에는 안드로이드와 아이폰을 동시에 Push 지원해 주는 FCM을 연결해보고 직접 푸쉬를 보내는 방법까지 다뤄보겠습니다. 이 강좌를 언제 올릴까....... 고민...... 고민...... 고민........ 하다가 이제야 올려봅니다 0단계. Flutter준비 Flutter 준비는 다른 게시물을 참고해주세요! 이번 게시물에서는 Android Studio에서 진행됩니다 1단계. Flutter 프로젝트 생성 및 패키지 확인 1. 프로젝트 생성 AndroidStudio > File > New > New Flutter Project 클릭 !프로젝트 이름하고 프로젝트 위치는 저와 다르게 새팅해주세요! 저는 프로젝트 이름을 로 설정하였습니다 프로젝트 위치는 작업하고자 하는 공간을 설정해주세요 import 'pac.. 스터디/Flutter+Dart 2019. 9. 18. Flutter Error initializing ADB : Android Debug Bridge not found. for Mac Android Studio로 Android 프로젝트에서는 Device File Explorer가 잘 작동하더니. Android Studio로 Flutter 프로젝트에서는 위와 같은 에러 모습이 뜨면서 안되더군요... Android Studio에서 Flutter New Project를 누르면 세팅되는 기본 세팅이 이상해서 그런건데요. 해결 방법은 간단합니다 1. Android Studio > File > Project Structure... 클릭! 2. 좌측 메뉴에서 Modules > *_android 클릭 저는 프로젝트 만들때 flutter_fcm2라고 지었기 때문에, flutter_fcm2_android 를 클릭했습니다. 3. 우측 패널에서 Dependencies를 클릭합니다 4. 클릭후 Android.. 스터디/Flutter+Dart 2019. 9. 17. Flutter Network Image (웹 이미지, 캐슁, 만료일) 이번 게시글에선 네트워크 이미지에 대해서 다뤄보겠습니다 급하신분은 '3.extended_image'로 이동하셔 보셔도 됩니다 서론 온라인에 있는 이미지를 다루다 보면 많은 문제에 부딛히게 됩니다 1. 네트워크 코딩 온라인에 있는 이미지는 해당 URL에 접속시도하고 접속하고 다운로드하고 실패할때 대처하는 코딩이 필요합니다 2. 최적화 (썸네일화,캐슁) 이미지의 경우 다운로드해서 바로 보여주면 좋겠지만, 컴퓨터 자원의 한계로 인해서 보여주는 각 환경에 맞게 최적화를 해줘야 합니다. 많은 최적화 방법이 있지만 그중 몇가지 예를 들면 원본 이미지 사이즈와 다르게 작은 이미지로 변경한걸 보여준다던가 (썸네일화) 네트워크 이미지를 다운받아두었다가 다시 호출시에 다운받아 놓은 이미지를 보여주는 방법이 있습니다. (캐.. 스터디/Flutter+Dart 2019. 9. 16. Flutter Database (SQLite) 사용하기 (2) - 좀 더 편하게! (BLoC, Json) 지난번 게시글에서 SQLite를 Flutter에서 사용하는 방법을 알아봤습니다 ( 지난 게시글 : https://dalgonakit.tistory.com/116 ) Flutter Database (SQLite) 사용하기 (1) 프로그램의 꽃은 데이터 저장! 그 저장과 불러오기를 쉽게 도와주는 것이 데이터베이스 인데요 이번 강좌에서는 데이터베이스의 한 종류인 SQLite를 써서 개발하는 방법을 소개해 볼까 합니다. 저도 Flutter에 입.. dalgonakit.tistory.com 이번에는 지난 번 게시글에 이어서 어떻게 하면 좀 더 Database를 편하게 접근 하고 어떻게 하면 좀 더 Flutter 답게 쓸 수 있는지 알아 보겠습니다 sqflite 살펴보기 https://pub.dev/packages.. 스터디/Flutter+Dart 2019. 9. 11. Flutter Database (SQLite) 사용하기 (1) 프로그램의 꽃은 데이터 저장! 그 저장과 불러오기를 쉽게 도와주는 것이 데이터베이스 인데요 이번 강좌에서는 데이터베이스의 한 종류인 SQLite를 써서 개발하는 방법을 소개해 볼까 합니다. 저도 Flutter에 입문한지 얼마 안되서 잘 모르지만! Flutter에서는 Database를 어떻게 접근하고 어떻게 하면 더 편리하게 접근할 수 있는지 소개해보겠습니다 개발 목표 우리가 구현할 모습을 미리 GIF로 한번 보시죠 1) 플러스(+) 버튼을 누르면 강아지 이름이 리스트에 추가되고, 2) 슬라이드하게되면 이름이 삭제되고, 3) 새로고침(⎋) 버튼을 누르면 목록이 전체가 초기화 되고, 4) 앱을 종료했다 다시 실행해도 이전 데이터를 그대로 보여주는게 이 게시물의 목표 입니다 개발에 앞서 Package 안내 아.. 스터디/Flutter+Dart 2019. 9. 10. Flutter 폴더작명 (Folder Naming) 우리는 대부분 Flutter 예제에서 main.dart에서 모든 코드를 작성하는 경우를 많이 봐 왔습니다 실제 프로젝트를 구현할 때는 dart 파일이 점점 많아져서 결국엔 폴더로 그룹화 시켜야 편하게 관리할 수 있는데. 폴더의 이름 짓기도 꾀나 어렵더라구요... 저는 위젯 폴더는 widgets, flutter에서 화면을 route라고 하니까 폴더 이름을 routes로 하고, 그 외는 utils, managers로 지었었는데.. 막상 혼자만의 이름으로 짓자니 다른분과 협업하게 될경우 서로 어색한 사이가 될 수도 있겠다 라는 생각이 들더군요 그래서 큰 패키지의 프로젝트를 보면서 비교해보니, 폴더 이름에도 어느정도 틀이 있어서 그 틀을 간단히 소개해보고자 합니다 1. 네이밍 방법 GNU Naming 이란 네이.. 스터디/Flutter+Dart 2019. 9. 9. 이전 1 2 3 4 다음