- Android Material & iOS Cupertino 위젯이 양대산맥임.
최초의 세팅에서 home은 첫번째 위젯에서 어떤걸 보여줄 것인가~를 뜻함.
Scaffold를 쓰면 원하는 곳에 쉽게 배치할 수 있는 가설물을 설치하는 것과 같음.
- 위젯은 대문자로 시작함!
- VSCode에선 opt esc 누르면 옵션들이 뜸.
- final은 값을 재할당 할 수 없음.
- 중괄호 {}로 감싸진 매개변수를 이름지정 매개변수 (named parameter)라 부름:
void main() {
say(from: "나다");
say();
}
void say({String? from}) {
print("$from: 개댁기야");
}
- 자바스크립트와 같이 중괄호 안쪽 코드가 한줄이면 화살표 함수 ㅆㄱㄴ
- void는 아무것도 반환하지 않는다는 의미임.
- Dart에서 시작할 때 호출하기로 약속된 함수는 main임. 이름 변경 X
- 속성 property는 클래스 내 변수를 일컫. 메소드는 클래스 내 함수. 클래스명과 동일한 함수를 생성자(constructor)라 부름. 생성자 함수에 입력 값을 전달 받아 속성에 넣어줄 수도 있음.
- 비유: 클래스(빵틀) -> 생성자 호출(빵 만듦) -> 인스턴스(빵) // 클래스의 형태를 따른 데이터 객체를 인스턴스라 부름.
- stateless함수를 상속 받으면 필수적으로 빌드 함수를 만들어야 하는데, 이건 위젯을 반환하는 함수임. override는 stateless widget이 가지고 있는 빌드 함수를 override밑에 정의한 함수로 덮어씌우겠다는 의미임.
- stateful widget은 기본적으로 두 개의 클래스로 구성됨. 생성자는 첫번째 함수에 들어가고, 빌드함수는 두번째 함수에 들어감. override는 두 클래스를 연결해주는 친구라 이해하면 됨.
- 빌드함수는 항상 MaterialApp으로 반환거래.
- setState누르면 화면 갱신시켜줌 (두번째 빌드함수를 다시 실행하는 것)
- Navigator.pop(context)에서 context는 빌드함수에서 컨텍스트를 전달받는데, 현재 실행되고 있는 위젯의 위치 및 정보를 담고있는 매개변수임. 그래서 그걸 팝!시키라는 의미임.
- Navigator.pushReplacement() 하면 페이지 이동 후 전 페이지로 돌아가는 버튼 없음. 보통 온보딩 페이지 이후 홈페이지 이동시 쓰임.
- url로 이미지 가져왔을 땐 Image.network, 에셋파일에서 정적이미지 가져올 땐 Image.asset
- ListView 위젯은 동일한 레이아웃에 다른 정보를 보여줄 때 사용하면 유용함. (eg. instagram)
ListView.builder(
itemCount: 100, // 전체 아이템 개수
itemBuilder: (context, index) { // index는 0 부터 99까지 증가
return Text("$index"); // 100번 실행
}
),
이런식.
- 클래스의 인스턴스가 여러개일 수 있는데, this는 여러 인스턴스 중 자기 자신을 가리키는 것.
- 언더바_는 외부 파일 접근 안돼.
- StatefulWidget의 상태클래스에서 widget.변수명으로 전달받은 변수에 접근할 수 있음.
- main.dart파일에서 MaterialApp이 갖고 있는 기능 중 하나가 예를 들어 textTheme을 바꾼다 하면 전역적으로 적용시켜줌.
***
- 이때까지 기초 강의의 모든 코드는 메모리에서 실행됐는데, 데이터를 메모리가 아닌 다른 곳에 저장해 앱을 재시작해도 이전 데이터를 유지하는 방법들 참고:
1. 기기에 파일로 저장 (shared_preferences 패키지 활용)
2. 기기 내 데이터베이스에 저장 (모든 폰엔 SQLite가 있음)
3. 서버에 저장 (내가 백엔드 플젝하며 했던 방법이 되겠다)
섹션4, 22강 25~~~분쯤 async await 및 late 함수 설명이 친절함 && shared preferences 패키지 활용법 알려줌.
섹션4에서 버킷리스트 앱 만들며 CRUD 다룸.
섹션4, 24~25강 Provider 패키지 사용하여 상태관리.
- ListTile 위젯은 박스 안 여러 영역에 다른 위젯을 손쉽게 배치할 수 있게 해줌.
- 중복되는 코드는 (예를 들어 삭제 창 따위) 적절히 extract할 것.
- Provider package를 통해 서비스를 위젯트리 꼭대기에 배치하고, 어디서든 쉽게 접근할 수 있도록 해줄 수 있음.
대략적 개념도:
- 정리하자면, ChangeNotifier 클래스를 상속받아 notifyListeners();를 통해 데이터를 사용하는 화면을 갱신함 (setState가 불필요해지는 듯?).
- Provider 패키지를 최상단 위젯 서비스에 등록하고, 해당 클래스에 접근하는 방법으론, Consumer<클래스>로 정보 갱신시 notifyListener 호출하면 빌더 부분이 새로고침 됨. (또 하나의 방법을 context.read임)
- Consumer로 return하면, 위젯트리 꼭대기에서 builder내 두번째 매개변수로 반환함!!!
- json에서 문자열은 무조건 큰따옴표 ""
- JSON 데이터에서 원하는 값만 뽑아오는 작업을 파싱(parsing)이라고 부름.
파이어베이스는 살짝 아웃데이티드 됐는지 잘 안돼서 패스.
출처: 유데미/Flutter 앱 개발 기초 (Dev Story)
[Flutter] Todo 앱 (상태관리 Cubit, BLoC, riverpod, get_it, GetX, 아키텍처) (0) | 2024.04.30 |
---|---|
[Flutter] 고급 문법 (stream, iterable, lamda, SOLID, singleton - 디자인패턴) (0) | 2024.04.30 |
[Flutter] 간단 또스2 (애니메이션) (0) | 2024.04.24 |
[Flutter] 간단 또스 (Pagination, GetX, 폴더 구조, 개발 순서) (0) | 2024.04.24 |
[Flutter] 간단 흔들기 카운트 앱 (xcode 국가설정, license 표시, splash screen) (0) | 2024.04.23 |