스터디164 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. Dart Quick Start 2 - 빠르게 한번쯤 훑고 지나가야하는 정보들 (11~20) 지난번 퀵스타트에 이은 정보입니다 지난 게시글 : Dart Quick Start 1 (https://dalgonakit.tistory.com/113) 11. Getter, Setter 객체의 속성에 대해 읽기 및 쓰기를 제공하는 방법입니다 함수를 사용할때 처럼 () 괄호를 사용하지 않고, 변수에 접근하는 것처럼 . 점 으로 사용이 가능합니다 12. Mixin (with) 상속이 아닌 클래스의 모든 변수와 함수를 재사용 할 때 with 키워드를 사용합니다. 또한 여러개를 받아올 수도 있습니다 13. Factory factory패턴(여러개의 물건을 생산하는 공장처럼, 여러가지 클래스를 반환해주는 패턴)을 도와주는 factory키워드를 제공해주고 있습니다. 14. Cascade Operator (..) .. .. 스터디/Flutter+Dart 2019. 8. 30. Dart Quick Start 1 - 빠르게 한번쯤 훑고 지나가야하는 정보들 (1~10), Flutter개발전 필독 안녕하세요~ 오랜만에 Dart 게시글로 찾아왔습니다! Flutter 개발을 하다보니 Java와 Javascript와 비슷한 Dart 문법이 많이 궁금해지더군요 저도 복잡한걸 싫어하다보니, 간단히 코드와 함께 설명해보도록 하겠습니다~ 참고 [. Dart 2.4.0 부터 작성된 게시글 입니다 ] 1. Main Dart는 많은 언어에서 처럼, main() 함수를 시작으로 프로그램이 시작됩니다 main 함수안에 간단한 print 함수를 통해서 "Hello, World!" 글자를 Console에 출력해보겠습니다 (우측에 있는 Run 버튼을 눌러보세요!) 2. 변수 다양한 종류가 있겠지만, 기본적으로 문자, 숫자(정수, 소수), 리스트, 맵 등이 있습니다 변수명 앞에 키워드(keyword)로 자료형을 직접 적어줄 .. 스터디/Flutter+Dart 2019. 8. 27. Flutter 런처아이콘(LauncherIcon) 안드로이드, 아이폰 동시에 간편하게 설정하기 휴가 갔다가 개발도 바쁘게 했다가, 오랜만에 글 쓰네요 앱을 실행할 수 있는 안드로이드의 홈 스크린 또는 앱 서랍, 아이폰의 홈 스크린에 있는 이미지를 런처아이콘(LauncherIcon)이라 합니다 안드로이드 런처 아이콘 세팅 안드로이드에서는 화면 사이즈별로 ldpi, mdpi, hdpi, xhdpi, xxhdpi, xxxhdpi를 설정해주고, 벡터형으로 모든 아이콘 크기를 대응하는 anydpi가 있습니다. 최근에는 adaptive-icon(반응형 아이콘)이라 해서 foreground와 background를 별도로 처리해서 1개의 아이콘으로 만들어주는 방법도 사용하고 있습니다. iOS 런처 아이콘 세팅 아이폰은... 정말 할께 많습니다... 물론 사이즈가 겹치는 부분도 있습니다만 이제는 앱스토어용 102.. 스터디/Flutter+Dart 2019. 8. 20. Flutter Permission 권한확인 (permission_handler) 이번에는 Permission에 대해서 써볼까 합니다 권한은 사용자에게 허락을 맡고 쓰는 기능을 말하는데요. 주로 파일을 쓸 때, 쓸 수 있는 권한을 앱에 부여할 것인지. 카메라나 갤러리에 접근할 수 있는 권한을 부여할 것인지를 사용자에게 물어보게 됩니다. 이런 기능들이 은근히 귀찮은 부분들이 많은데. 안드로이드는 박상권님의 Permission Library를 쓰면 정말 간단히 되고, 아이폰에서는 오히려 쉽게 되다 보니 딱히 안써본거 같습니다 잡소리를 이만하고 시작해보겠습니다!.. 플러터의 권한확인 패키지 https://pub.dev/packages/permission_handler permission_handler | Flutter Package Permission plugin for Flutter. T.. 스터디/Flutter+Dart 2019. 7. 31. Flutter Alert Dialog, Progress, Auto Close 화면 개발 다음으로 중요한것이 사용자에게 상태를 알리거나 동작을 물어보는 용도로 많이 쓰는 알림 화면(Alert Dialog, Popup)입니다. 물론 다른 방식도 많겠지만 쉽게 접근할 수 있는 Alert Dialog부터 시작해보겠습니다 Alert Dialog 위쪽은 제목 영역(1), 중간에 내용 영역(2), 아래에 있는 액션 영역(3) 으로 구성되어 있습니다. Flutter에서도 AlertDialog는 제목(Title), 내용(Body), 액션(Actions) 영역으로 구분됩니다 AlertDialog( title: new Text("Alert Dialog title"), content: new Text("Alert Dialog body"), actions: [ new FlatButton( child: .. 스터디/Flutter+Dart 2019. 7. 30. Flutter JSON < > Model json은 개발을 하다보면 정말 많이 사용하는 key-value 표현 방식입니다 데이터를 저장하고 불러올때, 데이터를 수신받고 전송할때 많이 쓰입니다 사용자 JSON 예제 { "name": "Dalmangyi", "email": "dalmangyi@email.com" } JSON -> Map 변환 Map user = jsonDecode(jsonString); print('Howdy, ${user['name']}!'); print('We sent the verification link to ${user['email']}.'); dart에서 제공하는 jsonDecode 함수를 이용하면 가뿐하게 Map 객체로 변환할 수 있습니다 Map 객체는 Key-Value 형태로 담을 수 있는 데이터 구조로 flutter.. 스터디/Flutter+Dart 2019. 7. 29. 이전 1 ··· 9 10 11 12 13 14 15 ··· 17 다음