[flutter] shared_preferences 를 사용하여 사용자가 저장한 메모를 저장하는 방법은 무엇인가요?

05 Dec 2023

flutter

먼저, shared_preferences 패키지를 프로젝트에 추가해야 합니다. pubspec.yaml 파일에 다음 코드를 추가하세요:

dependencies:
  flutter:
    sdk: flutter
  shared_preferences: ^2.0.5

그런 다음, 패키지를 가져오기 위해 다음 코드를 main.dart 파일 상단에 추가하세요:

import 'package:flutter/material.dart';
import 'package:shared_preferences/shared_preferences.dart';

사용자가 저장한 메모를 저장하기 위해 SharedPreferences 객체를 사용하겠습니다. 메모 저장 및 불러오기와 관련된 기능을 구현하기 위해 별도의 클래스를 만들어보겠습니다.

class MemoStorage {
  static const String _kMemoKey = 'memo';

  static Future<void> saveMemo(String memo) async {
    SharedPreferences prefs = await SharedPreferences.getInstance();
    await prefs.setString(_kMemoKey, memo);
  }

  static Future<String?> loadMemo() async {
    SharedPreferences prefs = await SharedPreferences.getInstance();
    return prefs.getString(_kMemoKey);
  }
}

MemoStorage 클래스는 saveMemo 메소드를 사용하여 메모를 저장하고, loadMemo 메소드를 사용하여 저장된 메모를 불러옵니다. 이때, SharedPreferences.getInstance() 메소드를 사용하여 SharedPreferences 객체를 가져옵니다.

프로젝트에서 이 클래스를 사용하기 위해 다음 코드를 main.dart 파일에 추가합니다:

void main() {
  runApp(MyApp());
}

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  String? memo;

  @override
  void initState() {
    super.initState();
    loadMemo();
  }

  void loadMemo() async {
    String? storedMemo = await MemoStorage.loadMemo();
    setState(() {
      memo = storedMemo;
    });
  }

  void saveMemo(String memo) {
    setState(() {
      this.memo = memo;
    });
    MemoStorage.saveMemo(memo);
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('메모 앱'),
        ),
        body: Column(
          children: [
            TextField(
              onChanged: saveMemo,
              decoration: InputDecoration(
                labelText: '메모를 입력하세요',
              ),
            ),
            SizedBox(height: 16),
            Text('저장된 메모: $memo'),
          ],
        ),
      ),
    );
  }
}

이제 앱을 실행하면, 사용자가 입력한 메모가 저장되고 출력되는 것을 확인할 수 있습니다. MemoStorage 클래스를 통해 사용자의 메모가 장치에 저장되기 때문에, 앱을 종료하고 다시 실행해도 저장된 메모가 유지됩니다.

이 방법을 사용하면, 사용자가 메모를 저장하고 불러오는 기능을 간단하게 구현할 수 있습니다. Flutter에서 shared_preferences를 사용하면 사용자 데이터를 쉽게 저장하고 관리할 수 있습니다.