728x90
211008 금
개학한 친구들 벌써 시험기간이라고 한다.
나는 이 시험 기간을 이용해서 지금까지 배운거 복습하고 앞으로 배울 거 예습해야겠다!
📌 플러터에서 앱의 데이터를 저장하는 방법
- 공유 환경 설정: 비교적 적은 양의 간단한 데이터를 저장하는 용도, Shared Preferences 클래스 사용
- 파일: 공유 환경 설정보다 더 복잡하고 다양한 데이터(사진, 음성, 동영상, 긴 텍스트 등)를 다룰 수 있다.
- 데이터베이스 이용
데모 앱의 카운트값 저장하기(공유 환경 설정)
📌 기본으로 만들어지는 플러터 데모 앱에는 +모양의 플로팅 버튼이 있다. 버튼을 누르면 화면의 카운트값이 증가한다.
하지만 앱을 종료하고 다시 실행하면 숫자 0으로 초기화 된다. 이전에 눌렀던 숫자를 유지하는 앱을 만들자!
dependencies:
flutter:
sdk: flutter
cupertino_icons: ^1.0.2
shared_preferences: 2.0.6
👉🏻 패키지 등록
import 'package:shared_preferences/shared_preferences.dart';
class _MyHomePageState extends State<MyHomePage> {
int _counter = 0;
//데이터 저장 함수
void _setData(int value) async {
var key = 'count';
SharedPreferences pref = await SharedPreferences.getInstance();
pref.setInt(key, value);
}
//데이터 가져오는 함수
void _loadData() async {
var key = 'count';
SharedPreferences pref = await SharedPreferences.getInstance();
setState(() {
var value = pref.getInt(key);
if (value == null) {
_counter = 0;
} else {
_counter = value;
}
});
}
👉🏻 공유 환경설정에 저장하는 데이터는 키-값 쌍으로 구성되어야 한다.
✍🏻 pref로 SharedPreferences 클래스의 인스턴스를 생성한다.
✍🏻 setInt() 함수는 SharedPreferences 클래스가 제공하는 세터 함수이다. 세터 함수란 데이터를 저장하는 역할을 하는 함수이다. 이렇게 count라는 키에 대응하는 카운트값을 공유 환경설정에 저장한다.
✍🏻 getInt() 함수라는 게터 함수를 만들었다. 게터 함수는 데이터를 불러오는 역할을 한다. 데이터를 찾기 위한 key를 인자로 넣는다.
@override
void initState() {
super.initState();
_loadData();
}
void _incrementCounter() {
setState(() {
_counter++;
_setData(_counter);
});
}
👉🏻 카운트 값을 저장하는 _loadData는 앱 실행될 때 호출하기 위해 initState함수에 넣고 _setData는 버튼 누를 때마다 호출되는 _incrementCounter함수에 넣는다.
📌 이제 앱 종료하고 켜면 이전에 누른 카운터 만큼 숫자가 남아있다!
(영상)
728x90
'그 땐 App했지 > 그 땐 Flutter했지' 카테고리의 다른 글
[TAVE/Study]Do it! Flutter 10장 데이터베이스에 데이터 저장하기① (0) | 2021.10.13 |
---|---|
[TAVE/Study]Do it! Flutter 9장 내부 저장소 이용하기② (0) | 2021.10.12 |
[TAVE/Study]Do it! Flutter 8장 내비게이션 활용하기② (0) | 2021.10.06 |
[TAVE/Study]Do it! Flutter 8장 내비게이션 활용하기① (0) | 2021.10.06 |
[TAVE/Study]Do it! Flutter 7장 네트워크를 이용해 통신하기② (0) | 2021.10.06 |