본문 바로가기

Flutter-플러터

shared preferences

반응형

 

 

비교적 적은 양의 데이터를 내부기기에 저장할 때 쓰인다.

사용예)

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
반응형