[flutter] shared_preferences 를 사용하여 사용자가 선택한 키보드 언어 설정을 저장하는 방법은 무엇인가요?

05 Dec 2023

flutter

먼저, shared_preferences 패키지를 프로젝트에 추가해야 합니다. 이 패키지는 Flutter 앱에서 간단한 데이터를 로컬에 저장하는 데 사용됩니다. pubspec.yaml 파일에 다음 의존성을 추가하세요:

dependencies:
  shared_preferences: ^2.0.5

그런 다음, 키보드 언어 설정을 저장할 메소드를 작성합니다. 예를 들어, 사용자가 언어 설정을 변경할 수 있는 화면에서 언어를 선택하고, 선택한 언어를 저장하고자 합니다.

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

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Keyboard Language Demo',
      home: KeyboardLanguageScreen(),
    );
  }
}

class KeyboardLanguageScreen extends StatefulWidget {
  @override
  _KeyboardLanguageScreenState createState() => _KeyboardLanguageScreenState();
}

class _KeyboardLanguageScreenState extends State<KeyboardLanguageScreen> {
  String selectedLanguage = '';

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

  void loadSelectedLanguage() async {
    SharedPreferences prefs = await SharedPreferences.getInstance();
    String language = prefs.getString('keyboard_language') ?? 'English';
    setState(() {
      selectedLanguage = language;
    });
  }

  void saveSelectedLanguage(String language) async {
    SharedPreferences prefs = await SharedPreferences.getInstance();
    await prefs.setString('keyboard_language', language);
    setState(() {
      selectedLanguage = language;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Keyboard Language'),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Text(
              'Selected Language: $selectedLanguage',
              style: TextStyle(
                fontSize: 18,
                fontWeight: FontWeight.bold,
              ),
            ),
            SizedBox(height: 20),
            ElevatedButton(
              onPressed: () {
                saveSelectedLanguage('Korean');
              },
              child: Text('Change Language to Korean'),
            ),
            ElevatedButton(
              onPressed: () {
                saveSelectedLanguage('English');
              },
              child: Text('Change Language to English'),
            ),
          ],
        ),
      ),
    );
  }
}

위의 예제에서는 selectedLanguage 변수를 사용하여 현재 선택된 언어를 표시합니다. loadSelectedLanguage 메소드는 SharedPreferences에서 저장된 언어를 로드하고, saveSelectedLanguage 메소드는 선택한 언어를 저장합니다.

언어 선택 버튼을 누르면 saveSelectedLanguage 메소드가 호출되어 선택한 언어를 저장하고, 화면에 선택된 언어가 표시됩니다.

이제 사용자가 선택한 키보드 언어 설정을 저장하고 나중에 다시 로드할 수 있습니다.