Front-End/Flutter

[Flutter] Shared preferences

Voyage_dev 2023. 10. 28. 17:35

Shared Preferences

  • 앱을 껐다가 켜면 state는 초기화된다. 그래서 state 안에 있던 데이터를 어딘가 저장해 두고 싶으면 서버로 보내서 DB에 저장을 하든가 아니면 shared preferences라는 로컬 공간에 저장하면 된다. 이는 웹에서 로컬 스토리지처럼 앱 데이터 삭제를 누르지 않는 이상 영구적으로 남아있다.

shared_preferences 설치

shared_preferences: ^2.0.11
import 'package:shared_preferences/shared_preferences.dart';
import 'dart:convert'; // 유용한 함수가 들어있는 기본 패키지

shared preferences에 데이터 저장하는 법

saveData(){
  var storage = await SharedPreferences.getInstance();
  storage.setString('name', 'john');
}
  • SharedPreferences.getInstance() 이거 실행해야 저장소를 불러올 수 있고
  • setString('자료이름', '저장할자료') 쓰면 저장된다.

저장했던 자료 출력하는 법

saveData(){
  var storage = await SharedPreferences.getInstance();
  storage.setString('name', 'john');
  var result = storage.getString('name');
  print(result);
}
  • getString('자료이름') 쓰면 저장해놨던 자료가 출력된다.
  • 실은 getString() 말고 get() 만 써도 출력되긴 하는데 getString() 이래야 타입지정도 잘해준다.
  • 진짠지 확인해보려면 saveData() 이거 initState() 이런데 안에서 실행해 보면된다.

다양한 저장가능

storage.setString('name', 'john');
storage.setBool('name', true);
storage.setInt('name', 20);
storage.setDouble('name', 20.5);
storage.setStringList('name', ['john', 'park']);
  • 숫자, 문자, Bool, List<String> 자료형도 저장가능.
  • 참고로 List<int> 이런거 저장 못해서 List<String>으로 바꿔서 저장하든 해야된다.

자료 삭제

storage.remove('name');

Map 자료 저장

storage.setString('map', jsonEncode({ 'age' : 20 }) );
  • Map 저장은 바로 못 하기 때문에 Map 데이터를 문자로 변환해야 저장이 가능하다
  • jsonEncode()를 쓰면 Map ⇒ JSON으로 변환한다
  • JSON는 따옴표친 Map인데 문자취급을 해 주기 때문에 저장이 가능하다
var result = storage.getString('map') ?? '없는데요';
print(jsonDecode(result));
  • JSON으로 저장하면 자료 꺼내도 JSON
  • JSON -> Map 변환하고 싶으면 반대로 jsonDecode() 안에 넣어주면 된다.
  • ?? 이건 null check 위해서 쓴다.
  • 유저의 앱 설정같은걸 넣어둘 수도 있고
  • 게임의 경우 게임 세이브파일을 보관하기도 하고
  • 메모나 캘린더앱의 경우 유저가 작성한 데이터를 보관해둘 수도 있고
  • 인스타그램의 경우 이미 본 게시물들은 shared_preferences에 저장해두면 GET요청 없이도 빨리 기존 게시물을 띄워줄 수 있다.
  • 하지만 문자만 저장가능해서 이미지 같은건 못집어 넣는다.
  • 이미지도 미리 저장해두고 싶으면 cached_network_image 이런 패키지를 공부해 보자

 

출처: 코딩애플