달망이 삽질인생

스터디/Flutter+Dart37

Flutter Database (SQLite) 사용하기 (1) 프로그램의 꽃은 데이터 저장! 그 저장과 불러오기를 쉽게 도와주는 것이 데이터베이스 인데요 이번 강좌에서는 데이터베이스의 한 종류인 SQLite를 써서 개발하는 방법을 소개해 볼까 합니다. 저도 Flutter에 입문한지 얼마 안되서 잘 모르지만! Flutter에서는 Database를 어떻게 접근하고 어떻게 하면 더 편리하게 접근할 수 있는지 소개해보겠습니다 개발 목표 우리가 구현할 모습을 미리 GIF로 한번 보시죠 1) 플러스(+) 버튼을 누르면 강아지 이름이 리스트에 추가되고, 2) 슬라이드하게되면 이름이 삭제되고, 3) 새로고침(⎋) 버튼을 누르면 목록이 전체가 초기화 되고, 4) 앱을 종료했다 다시 실행해도 이전 데이터를 그대로 보여주는게 이 게시물의 목표 입니다 개발에 앞서 Package 안내 아..

Flutter 폴더작명 (Folder Naming) 우리는 대부분 Flutter 예제에서 main.dart에서 모든 코드를 작성하는 경우를 많이 봐 왔습니다 실제 프로젝트를 구현할 때는 dart 파일이 점점 많아져서 결국엔 폴더로 그룹화 시켜야 편하게 관리할 수 있는데. 폴더의 이름 짓기도 꾀나 어렵더라구요... 저는 위젯 폴더는 widgets, flutter에서 화면을 route라고 하니까 폴더 이름을 routes로 하고, 그 외는 utils, managers로 지었었는데.. 막상 혼자만의 이름으로 짓자니 다른분과 협업하게 될경우 서로 어색한 사이가 될 수도 있겠다 라는 생각이 들더군요 그래서 큰 패키지의 프로젝트를 보면서 비교해보니, 폴더 이름에도 어느정도 틀이 있어서 그 틀을 간단히 소개해보고자 합니다 1. 네이밍 방법 GNU Naming 이란 네이..

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

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 런처아이콘(LauncherIcon) 안드로이드, 아이폰 동시에 간편하게 설정하기 휴가 갔다가 개발도 바쁘게 했다가, 오랜만에 글 쓰네요 앱을 실행할 수 있는 안드로이드의 홈 스크린 또는 앱 서랍, 아이폰의 홈 스크린에 있는 이미지를 런처아이콘(LauncherIcon)이라 합니다 안드로이드 런처 아이콘 세팅 안드로이드에서는 화면 사이즈별로 ldpi, mdpi, hdpi, xhdpi, xxhdpi, xxxhdpi를 설정해주고, 벡터형으로 모든 아이콘 크기를 대응하는 anydpi가 있습니다. 최근에는 adaptive-icon(반응형 아이콘)이라 해서 foreground와 background를 별도로 처리해서 1개의 아이콘으로 만들어주는 방법도 사용하고 있습니다. iOS 런처 아이콘 세팅 아이폰은... 정말 할께 많습니다... 물론 사이즈가 겹치는 부분도 있습니다만 이제는 앱스토어용 102..

Flutter Permission 권한확인 (permission_handler) 이번에는 Permission에 대해서 써볼까 합니다 권한은 사용자에게 허락을 맡고 쓰는 기능을 말하는데요. 주로 파일을 쓸 때, 쓸 수 있는 권한을 앱에 부여할 것인지. 카메라나 갤러리에 접근할 수 있는 권한을 부여할 것인지를 사용자에게 물어보게 됩니다. 이런 기능들이 은근히 귀찮은 부분들이 많은데. 안드로이드는 박상권님의 Permission Library를 쓰면 정말 간단히 되고, 아이폰에서는 오히려 쉽게 되다 보니 딱히 안써본거 같습니다 잡소리를 이만하고 시작해보겠습니다!.. 플러터의 권한확인 패키지 https://pub.dev/packages/permission_handler permission_handler | Flutter Package Permission plugin for Flutter. T..

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 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 SharedPreferences (앱이 종료되도 남아있는 데이터, Key-Value) 이번에는 앱이 종료되도 남아 있는 데이터인 SharedPreferences에 대해서 설명하고자 합니다 데이터가 Key-Value형태로 저장되게 됩니다. 저장될때는 파일 입출력을 사용하기 때문에 사용량이 많을 경우엔 추천하지 않습니다. 팝업창을 '다음에 보지않기' 라는 체크 박스를 저장하는 정도의 간단한 데이터만 저장합니다. 다른 플랫폼에서는 이와 같은 기능을 웹에서는 캐시, 아이폰에서는 UserDefaults, 안드로이드에서는 SharedPreferences라는 개념으로 말합니다. 데이터 베이스를 소개 할 수도 있지만 간단한 접근이 아니고 기본적인 지식이 필요하기 때문에 다음 게시글로 넘길까 합니다 0.지원하는 기능 1) 초기화 SharedPreferences prefs = await SharedPref..

Flutter Screen(Route,Activity) 컨트롤 (화면 이동, Data전달) Android 에선 Activity, iOS에선 UIViewController 로 창을 만들고 이동하는데 Flutter에선 어떻게 하는지 알아보겠습니다 화면을 만드는 방법, 다른 화면 이동시 애니메이션 방법 화면끼리 데이터를 주고 받는 방법 1. 화면 준비 우선 화면을 준비해보겠습니다 class FirstRoute extends StatelessWidget { @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar( title: Text('First Route'), ), body: Center( child: RaisedButton( child: Text('Open route'), onPressed: () { // Nav..

이전 1 2 3 4 다음

티스토리툴바