달망이 삽질인생

스터디/Flutter+Dart37

Flutter로 Web 만들기 (덤으로 안드로이드, iOS 앱이 만들어질 뿐) 크로스플랫폼의 끝판왕 Flutter가 2.0버전 부터 웹을 정식으로 지원하면서 한 번 더 끝판왕으로 성장했습니다! (2021년 5월 18일 기준으로 Flutter 2.2버전이 되었습니다.) 이전에 1.7버전에서 Web으로 빌드 할 때는 많은 문제가 있었는데, 이번 업데이트로 많이 안정화된 걸 확인 할 수 있었습니다. 하지만 여러 글을 보니 아직까진 상용화로 사용하기엔 문제가 있어보입니다... 시작하기 전에!! 기본 세팅을 안 하신 분은 이전 글을 참고해주세요 https://dalgonakit.tistory.com/98 Flutter 시작하기 | 맥북 | VSCode 안드로이드와 아이폰은 개발한지도 오래 됬는데.. 최근 회사 업무가 빠르게 구현해야 될 것들이 생겨서 안그래도 눈 여겨 보던 Flutter를 ..

Flutter 3.3.10 시작하기 | 맥북 M1,M2 | VSCode 세팅 2022년 12월 27일 기준으로 Flutter 3.3.10 버전으로 내용을 수정해두었습니다. ========== 안드로이드와 아이폰은 개발한지도 오래 됬는데.. 최근 회사 업무가 빠르게 구현해야 될 것들이 생겨서 안그래도 눈 여겨 보던 Flutter를 해보려 합니다 Flutter를 다루는 Dart 언어는 항상 배우지 말아야 할 언어 순위안에 들고 있지만 아이폰 개발도 하다보니 Dart보다 더한 Objective-C언어를 배운 입장에서는 그냥 그러려니 하고 시작해 볼까 합니다 ㅎㅎ 초기 1.0 이하 버전의 Flutter는 정말 문제가 많았다곤 하는데 지금은 그래도 SDK가 1.7 버전이 넘은걸 보니 왠만큼 해결 했으리라 생각되었습니다. 2.0 버전부터는 웹을 공식지원하고, 3.0 이상부터는 맥OS와 윈도..

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 IDE툴은 뭘로? (VSCode, AndroidStudio) 저도 처음엔 안드로이드 개발이 아니니까 웹 개발할때 많이 사용하던 VSCode나 써볼까하는 생각에 VSCode를 먼저 접했었습니다. 그래서 제 블로그엔 Flutter VSCode 세팅법이 적혀있습니다 ㅎㅎ 오랬동안 사용하면서 이것저것 비교를 하게 되고 결국엔 AndroidStudio로 갈아 탔습니다 IDE툴 스크린샷 비교 개발하면서 비교할 것들이 많지만 제가 AndroidStudio로 넘어가게된 결정적 요인을 말씀드리겠습니다 1. 단축키 안드로이드 개발 10년차에 Android Studio의 단축키는 정말 손에 익어서 VSCode를 사용하게 되면 개발 속도가 조금이나마 하락하는게 느껴졌었습니다.. 그래서 익숙한 AndroidStudio를 쓰기로 정했습니다. 2. Gradle Sync VSCode에서 간혹..

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 AndroidStudio에서 명령어로 스크린샷 찍기 안녕하세요~ 이번 강좌에서는 안드로이드 스튜디오에서 플러터를 빌드했는데 스크린샷은 어떻게 찍을까? 하고 고민하시는 분들을 위해 작성된 게시글 입니다! 0. 플러터 세팅을 다 한 전제하에 소개하겠습니다 1. 터미널 실행 2. 기기명 알아내기 스크린샷을 찍으려면 먼저 기기명을 알아야합니다 $flutter devices 명령어을 실행한 결과 총 2개의 기기가 검색되었고, 이름은 [SM G935L], [iPhone Xr] 이네요 3. 스크린샷 명령어 사용 앞서 말한 기기명과 스크린샷 명령어를 같이 입력해야 합니다. 기기명은 스페이스바도 인식하니까 위에서 알아낸 'SM G935L'을 적어보겠습니다 $flutter screenshot -d SM G935L 명령어를 실행하면 잠시 뒤에 스크린샷이 저장되었다는 결과가 ..

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 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 Network Image (웹 이미지, 캐슁, 만료일) 이번 게시글에선 네트워크 이미지에 대해서 다뤄보겠습니다 급하신분은 '3.extended_image'로 이동하셔 보셔도 됩니다 서론 온라인에 있는 이미지를 다루다 보면 많은 문제에 부딛히게 됩니다 1. 네트워크 코딩 온라인에 있는 이미지는 해당 URL에 접속시도하고 접속하고 다운로드하고 실패할때 대처하는 코딩이 필요합니다 2. 최적화 (썸네일화,캐슁) 이미지의 경우 다운로드해서 바로 보여주면 좋겠지만, 컴퓨터 자원의 한계로 인해서 보여주는 각 환경에 맞게 최적화를 해줘야 합니다. 많은 최적화 방법이 있지만 그중 몇가지 예를 들면 원본 이미지 사이즈와 다르게 작은 이미지로 변경한걸 보여준다던가 (썸네일화) 네트워크 이미지를 다운받아두었다가 다시 호출시에 다운받아 놓은 이미지를 보여주는 방법이 있습니다. (캐..

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..

이전 1 2 3 4 다음

티스토리툴바