| 일 | 월 | 화 | 수 | 목 | 금 | 토 |
|---|---|---|---|---|---|---|
| 1 | 2 | 3 | 4 | |||
| 5 | 6 | 7 | 8 | 9 | 10 | 11 |
| 12 | 13 | 14 | 15 | 16 | 17 | 18 |
| 19 | 20 | 21 | 22 | 23 | 24 | 25 |
| 26 | 27 | 28 | 29 | 30 | 31 |
- 정리
- FutureProvider
- StateNotifierProvider
- flutter
- flutter_secure_storage
- StreamProvider
- Flutter 상태관리
- 가공
- 데이터
- fetch
- Happy moment
- riverpid
- StateProvider
- Today
- Total
목록Flutter (13)
This Week's Record
1. 데이터를 저장하고 불러와서 관리할 수 있는 로컬 db와 데이터를 각자 다룰 수 있어야함. sql(drift, sqlite 등), nonsql(hive) 등의 패키지가 있고, 이를 잘 구성하여야 함. ( 데이터들 : ) 2. 데이터를 하나의 인스턴스로 만들어서 사용할 수 있는 model을 만든다 (붕어빵 틀) 3. model을 사용해서 ui를 쉽고 빠르게 구성한다. 4. ui를 구성하기 위해선 데이터가 들어와있어야한다는게 보장되어있어야한다! 그래서 이 보장을 위해 future같은 비동기 형태로 데이터를 불러오고 ui를 구성하여야한다. 5. FutureBuilder나 StreamBuilder를 통해서 데이터를 가져온 뒤 데이터 정보에 따라서 ui를 그리는 위젯을 써도 된다. 6. 데이터를 사용하는 ui..
https://pub.dev/packages/go_router go_router | Flutter Package A declarative router for Flutter based on Navigation 2 supporting deep linking, data-driven routes and more pub.dev 세팅하기 이렇게 MaterialApp대신 MaterialApp.router를 써줘야함 그리고 router를 만들어놓고 routerConfig에 넣어주긔 import 'package:flutter/material.dart'; void main() { runApp( const _App(), ); } class _App extends StatelessWidget { const _App({supe..
STEP1 패키지 설치 0. 작업 들어가기전에 패키지부터 설치해주자! 아래 4개는 dependencies에 drift sqlite3_flutter_libs path_provider path 아래 2개는 dev_dependencies에 drift_dev build_runner STEP2 model 작성 1. 먼저 model폴더를 만들고 그 안에 사용할 table들을 정의해준다. import 'package:drift/drift.dart'; class Schedule extends Table { // PRIMARY KEY IntColumn get id => integer().autoIncrement()(); //중복이 안생기도록 autoIncrement // 내용 TextColumn get content ..
코드는 무조건 위에서부터 아래로 작동한다. 변수 타입 정수 int + - * / 실수 double + - * / bool 맞다 틀리다 (true, false) 글자 String print(name+name2) + 가능 print('${name}') 문자열안에 변수를 넣고 ㅅㅍ을때 var vs dynamic var는 한번 선언하면 그 타입으로 지정 dynamic는 타입을 요리조리 바꿀 수 있음 nullable non-nullable null : 아무런 값도 없다. String -> non-nullable String? -> nullable name! -> name은 null이 아니다. final vs const 둘다 값을 한번 선언하면 변경불가 둘다 var 생략가능 (final String name ==..
cd /Users/eju/Desktop/flutter/stampling flutter build apk --release --target-platform=android-arm64 ㄲ
자꾸 이미지가 저화질로 구현되서 이런저런 시도를 좀 해봤다. 더 좋은 방법이나 어떤 간단한 함수가 따로 있을 수도 있겠지만 우선 지금은 아래 방법에 만조쿠! class ic24 extends StatelessWidget { final String iconName; ic24({Key? key, required this.iconName}) : super(key: key); @override Widget build(BuildContext context) { return Container( width: 24, height: 24, decoration: BoxDecoration( image: DecorationImage( image: AssetImage("assets/ic-${iconName}-24@3x.png"..
Column 위젯 위젯이나 기능에 대한 설명을 써준다 블라블라 Code Text 디자인시스템을 반영한 커스텀위젯 코드 class TextSubhead1 extends StatelessWidget { double size; final String text; final Color color; TextSubhead1( {Key? key, this.size = 12, required this.text, required this.color}) : super(key: key); @override Widget build(BuildContext context) { return Text( text, style: TextStyle( color: color, fontSize: size, fontWeight: FontWeig..
해결 1. 맥 터미널에서 이거 입력 sudo arch -x86_64 gem install ffi 2. vs code 터미널에서 이거 입력 cd ios 3. 마지막으로 이거 vscode터미널에서 입력 arch -x86_64 pod install
Text 위젯 글을 화면에 노출시킬 때 Code Minimum Code Text('텍스트 위젯',), Maximul Code Text( '텍스트 위젯', style: TextStyle( fontSize: 35, // 폰트 크기 fontWeight: FontWeight.bold, // 폰트 두께 color: Colors.amber, // 폰트 색상 ), ), Reference 링크링크
글자넣는 Text() Text( '텍스트', style: TextStyle( fontSize: 24, // 폰트 크기 fontWeight: FontWeight.bold, // 폰트 두께 color: Colors.red, // 폰트 색상 ), ), 아이콘 넣을 땐 Icon() Icon(Icons.star) 이미지 넣고 싶으면 Image.asset('assets/dog.png') Image.network("이미지url"), 네모 박스 넣을 땐 Container(), SizedBox() Container( width: 200, // 폭 height: 200, // 높이 color: Colors.green, // 박스 색상 child: Text("This is Container"), // 자식 위젯 ), : C..
Button Button 위젯 위젯이나 기능에 대한 설명을 써준다 블라블라 Code Minimum Code TextButton( child: Text('버튼'), onPressed: (){} ) ElevatedButton( child: Text('버튼'), onPressed: (){} ) IconButton( icon: Icon(Icons.star), onPressed: (){} ) >>결과물 Maximul Code code >>결과물 버튼눌렀을때 화면위에 화면 올리기 vs 화면 갈아치워주기 (안드로이드에서 뒤로가기 눌렀을때 뒤로 가지나 아닌가의 차이로 이해하면될듯) TextButton( child: Text( 'Done Onboarding ', style: TextStyle(fontSize: 20.0)..
상중하로 나눠주는 Scaffold() 위젯 What? 앱은 대부분 [상단바 - body - 하단바] 로 나뉘어 있다. 이를 쉽게 구성하고 싶을 때 쓰는 위젯이 Scaffold()위젯 When? 상중하를 구성할 때 How to Use Scaffold( appBar: 상단에 넣을 다른 위젯, body: 중단에 넣을 다른 위젯, bottomNavigationBar: 하단에 넣을 다른 위젯, floatingActionButton: 플로팅 액션버튼에 넣을 다른 위젯, ), Scaffold( appBar: AppBar( title: Text('상단바')), body: Text('중간'), bottomNavigationBar: BottomAppBar(child: Text('하단바')), floatingActionBu..
I 변수 II 자료형 III 흐름 제어문 IV 함수 V 클래스 들어가기 전 main(){} : main은 Dart에서 처음 시작 시 호출하는 약속된 함수 // : 주석 print() : print의 소괄호 안쪽에 값을 넣으면 console에 값이 출력 ; : Dart에서는 마지막에 세미콜론을 찍어줌 I 변수 변수 만들기 1. 자료형(상자가 담을 수 있는 재료의 종류) var : 처음 담긴 값으로 타입지정 String : 문자만 String? : 문자 또는 null상태 final String : 문자를 한 번 담은 뒤 재할당 불가 2. 변수명(상자의 이름) Dart의 변수명 만드는 규칙 영문, _, $, 숫자 만 사용! 숫자로 시작불가 카멜케이스(camelCase)사용 3. 변수에 담으려는 값(상자에 담기..