【Flutter】 인기 패키지 사용법 ~shared_preferences편~

머리

2020년이 시작된 후 Flutter를 공부하기 시작했습니다.

스스로 시험에 채팅 앱을 개발해 보고 있습니다.
여러가지 패키지가 있어, 점점 사용해 보고 싶다고 생각하기 시작하고 있습니다.

우선 공부하기 위해, 공식 문서에 있는 「Flutter Favorite」인 패키지로부터 공부해 보기로 했습니다.

우선 shared_preferences를 사용해 보겠습니다.

지금까지 올린 기사
- shared_preferences 소개 ← 지금 이것
- url_launcher 소개
- flutter_slidable 소개

shared_preferences

shared_preferences는 데이터를 플랫폼별 영구 스토리지에 저장할 수 있는 패키지

String

Int

Bool

Double

key?

저장 가능
- getString 에서 불러오기
- setString 에서 쓰기
- remove 에서 삭제
할 수 있다.
getInt와 setInt는 비동기 처리가 필요하며 Future/async/await를 사용하여 함수를 만듭니다.

영구 스토리지에 저장되므로 한 번 저장하면 어떤 클래스와 Widget에서도 얻을 수 있습니다.
물론 다시 빌드해도 그 값이 유지됩니다.

샘플

시도에서 양식에 이름을 입력하면 이름이 표시된다는 샘플을 만들었습니다.
shared_preferences를 사용하면 다시 빌드되어도 마지막으로 입력한 이름이 저장되어 표시됩니다.

import 'package:shared_preferences/shared_preferences.dart';

import 'package:flutter/material.dart';

class SampleSharedPreferences extends StatefulWidget {
  @override
  State<StatefulWidget> createState() => _SampleSharedPreferences();
}

class _SampleSharedPreferences extends State<SampleSharedPreferences> {
  Future<SharedPreferences> _prefs = SharedPreferences.getInstance();

  final _nameController = TextEditingController();
  String _name;

  @override
  void initState() {
    super.initState();
    getName().then((value) {
      setState(() {
        _name = value;
      });
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: Text('shared_preferences'),
        ),
        body: Center(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              Text(
                '$_name',
                style: TextStyle(fontSize: 32),
              ),
              TextFormField(
                controller: _nameController,
                decoration: InputDecoration(hintText: '名前を入力してね'),
              ),
              RaisedButton(
                child: Text('保存'),
                onPressed: () {
                  setName().then((success) {
                    _nameController.clear();
                  });
                },
              ),
              RaisedButton(
                child: Text('削除'),
                onPressed: () {
                  removeName();
                },
              ),
            ],
          ),
        ));
  }

  setName() async {
    SharedPreferences prefs = await _prefs;
    prefs.setString('name', _nameController.text);
    setState(() {
      _name = prefs.getString('name');
    });
  }

  getName() async {
    SharedPreferences prefs = await _prefs;
    return prefs.getString('name');
  }

  removeName() async {
    SharedPreferences prefs = await _prefs;
    prefs.remove('name');
    setState(() {
      _name = null;
    });
  }
}

설명

initState() 에서 getName() 가 움직입니다.getString 에서 영구 저장소에서 가져와 _name 에 넣습니다.

"저장"버튼을 누르면 setName()라는 함수가 움직입니다.prefs.setString('name', _nameController.text); 이 문장으로, 영구 스토리지에 name 라는 이름으로 _nameController.text 를 쓰고 있다.
setState((){}) 로 이름을 _name 로 이름을 넣습니다.
setState(() {
_name = _nameController.text;
});

이것도 문제 없습니다만, 이번은 shared_preferences를 의식하기 위해 getString 를 사용했습니다.
removeName() 는 영구 스토리지 데이터를 삭제하는 함수입니다.prefs.remove('name') 에서 지워집니다._name 도 null로 둡니다.

간단하지만 이런 느낌

생각나는 용도

여러 번 사용하지만 일일이 Firestore 등에서 얻을 때 귀찮은 것을 씁니다.
currentUser의 ID나 디바이스의 토큰 등을 저장하면 좋을까~