[flutter] shared_preferences 를 사용하여 사용자가 본 웹사이트의 방문 횟수를 저장하는 방법은 무엇인가요?

05 Dec 2023

flutter

shared_preferences란?
shared_preferences 설치하기
본 웹사이트의 방문 횟수 저장하기

shared_preferences란?

shared_preferences는 Flutter 애플리케이션에서 간단한 데이터를 영구적으로 저장하기 위한 패키지입니다. 이를 통해 사용자가 앱을 종료하고 다시 실행할 때도 데이터를 유지할 수 있습니다.

shared_preferences 설치하기

먼저, shared_preferences 패키지를 사용하기 위해 pubspec.yaml 파일에 아래와 같이 의존성을 추가해야 합니다:

dependencies:
  shared_preferences: ^2.0.6

그리고 pubspec.yaml 파일이 있는 경로에서 터미널을 실행하여 아래 명령을 입력합니다:

flutter pub get

의존성을 성공적으로 추가하면 shared_preferences 패키지를 사용할 준비가 끝났습니다.

본 웹사이트의 방문 횟수 저장하기

간단한 예시로 사용자가 앱에서 본 웹사이트의 방문 횟수를 저장하는 기능을 구현해 보겠습니다.

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

class WebsiteVisitCounter extends StatefulWidget {
  @override
  _WebsiteVisitCounterState createState() => _WebsiteVisitCounterState();
}

class _WebsiteVisitCounterState extends State<WebsiteVisitCounter> {
  int visitCount = 0;

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

  Future<void> _loadVisitCount() async {
    SharedPreferences prefs = await SharedPreferences.getInstance();
    setState(() {
      visitCount = prefs.getInt('visitCount') ?? 0;
    });
  }

  Future<void> _incrementVisitCount() async {
    SharedPreferences prefs = await SharedPreferences.getInstance();
    setState(() {
      visitCount++;
      prefs.setInt('visitCount', visitCount);
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Website Visit Counter'),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Text(
              '본 웹사이트를 방문한 횟수:',
              style: TextStyle(fontSize: 18),
            ),
            Text(
              visitCount.toString(),
              style: TextStyle(fontSize: 24, fontWeight: FontWeight.bold),
            ),
          ],
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: _incrementVisitCount,
        child: Icon(Icons.add),
      ),
    );
  }
}

위의 코드는 shared_preferences 패키지를 사용하여 사용자가 앱에서 본 웹사이트의 방문 횟수를 저장하고 표시하는 기능을 구현한 것입니다.

SharedPreferences 인스턴스를 사용하여 데이터를 로드하고 저장합니다.
방문 횟수를 증가시키는 _incrementVisitCount 메서드를 정의하고, 이를 플로팅 액션 버튼의 onPressed 콜백으로 설정합니다.
방문 횟수를 화면에 표시합니다.
앱을 실행하면 방문 횟수가 표시되고, 앱을 종료한 후 다시 실행해도 방문 횟수가 유지됩니다.

이제 위의 예시를 참고하여 본인의 앱에 shared_preferences를 사용하여 본 웹사이트의 방문 횟수를 저장하는 기능을 추가해보세요.

참고 자료

shared_preferences 패키지 - Pub.dev