반응형
비교적 적은 양의 데이터를 내부기기에 저장할 때 쓰인다.
사용예)
1.로그인 정보 (id만 저장하기- 로그인 편의기능)
2.다크모드
3.다음에 팝업창 다시 뜨지 않기
한 번 설정한 값을 어플이 종료되어서 다시 켜도
그 값을 유지 하게 만들 때 많이 쓴다.
중요한 데이터를 저장 할 때는 사용하지 말 것
기본적인 사용법
yaml파일에 등록
-
dependencies:
shared_preferences:
flutter:
sdk: flutter
임포트 하기
import 'package:shared_preferences/shared_preferences.dart';
데이터 저장하기
// obtain shared preferences
final prefs = await SharedPreferences.getInstance();
// set value
await prefs.setInt('counter', counter);
데이터 읽기
final prefs = await SharedPreferences.getInstance();
// Try reading data from the counter key. If it doesn't exist, return 0.
final counter = prefs.getInt('counter') ?? 0;
데이터 제거
final prefs = await SharedPreferences.getInstance();
await prefs.remove('counter');
예시 )
1. 다크모드를 저장 하는 코드
출처 [Flutter] shared_preferences 와 provider로 라이트/다크모드 설정하기 (velog.io)
saveThemeModePrefs(String value) async {
final prefs = await SharedPreferences.getInstance();
// key값은 "themeMode", 저장하는 value값은 String 타입의 "light" or "dark" or "system" 입니다.
await prefs.setString("themeMode", value);
2. 카운터앱
아래는 플러터 앱을 키면 시작하는 카운터 앱
카운터의 값을 핫리로드해도 값이 저장되게 만든 것
import 'dart:html';
import 'package:flutter/material.dart';
import 'package:shared_preferences/shared_preferences.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return MaterialApp(
home: MyHomePage(),
);
}
}
class MyHomePage extends StatefulWidget {
const MyHomePage({Key? key}) : super(key: key);
@override
State<MyHomePage> createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
int _counter = 0;
@override
void initState() {
super.initState();
_loadCounter();
}
//카운터의 값을 로딩딩해서 시작하는 코드
Future<void> _loadCounter() async {
final prefs = await SharedPreferences.getInstance();
setState(() {
_counter = (prefs.getInt('counter')?? 0);
});
}
// 버튼을 누르면 카운터 시작
Future<void> _incrementCounter() async {
final prefs = await SharedPreferences.getInstance();
setState(() {
_counter = (prefs.getInt('counter')??0) +1;
prefs.setInt('counter', _counter);
});
}
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text('연습'),),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
const Text('버튼을 누르면 값이 올라감'),
Text('$_counter',style: Theme.of(context).textTheme.headline4,),
],
),
),
floatingActionButton: FloatingActionButton(
onPressed: _incrementCounter,
tooltip: '증가',
child: const Icon(Icons.add),
),
);
}
}
728x90
반응형
'Flutter-플러터' 카테고리의 다른 글
class constructor 2편 Ingredient 클래스 (0) | 2023.01.05 |
---|---|
class constructor 1편 Food 클래스 (0) | 2023.01.05 |
버튼을 누르면 위젯이 리스트 안에 추가 됨 : Flutter Add Widgets in List (0) | 2023.01.02 |
Flutter 인터넷 권한 부여하기 , 앱 버전 업데이트 후 출시하기 (0) | 2022.12.23 |
플러터 텍스트필드 콤마 적용된 숫자 String => double변환 (1) | 2022.12.10 |