[flutter] 플러터 Slider를 사용하여 데이터베이스에서 값을 불러오는 방법은?

08 Dec 2023

flutter

먼저, Flutter 앱에서 데이터베이스를 사용하기 위해 sqflite 패키지를 설치해야 합니다. 이 패키지를 사용하면 간단하게 SQLite 데이터베이스를 다룰 수 있습니다. 아래는 pubspec.yaml 파일에 패키지를 추가하는 예시입니다.

dependencies:
  flutter:
    sdk: flutter
  sqflite: ^2.0.0

다음으로, 데이터베이스와 상호작용할 수 있는 데이터 모델을 만들어야 합니다. 다음은 간단한 예시입니다.

class SliderData {
  int id;
  double value;

  SliderData({this.id, this.value});

  Map<String, dynamic> toMap() {
    return {
      'id': id,
      'value': value,
    };
  }

  factory SliderData.fromMap(Map<String, dynamic> map) {
    return SliderData(
      id: map['id'],
      value: map['value'],
    );
  }
}

데이터베이스를 초기화하고 값을 불러오기 위해 다음과 같은 함수를 사용할 수 있습니다.

import 'package:sqflite/sqflite.dart';
import 'package:path/path.dart';

Future<double> getSliderValueFromDatabase() async {
  // 데이터베이스 초기화
  var databasesPath = await getDatabasesPath();
  String path = join(databasesPath, 'slider.db');
  Database database = await openDatabase(path, version: 1,
      onCreate: (Database db, int version) async {
    await db.execute(
        'CREATE TABLE sliders (id INTEGER PRIMARY KEY, value REAL)');
  });

  // 데이터 가져오기
  List<Map> result = await database.query('sliders', orderBy: 'id DESC', limit: 1);

  if (result.length > 0) {
    SliderData data = SliderData.fromMap(result.first);
    return data.value;
  } else {
    return 0.0; // 기본값
  }
}

이제 Slider 위젯을 만들어서 데이터베이스에서 값을 불러와 연동할 수 있습니다.

double _value = 0.0;

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

void _loadSliderValue() async {
  double value = await getSliderValueFromDatabase();
  setState(() {
    _value = value;
  });
}

@override
Widget build(BuildContext context) {
  return Slider(
    value: _value,
    onChanged: (double value) {
      setState(() {
        _value = value;
      });
      // 값을 데이터베이스에 저장
      // saveSliderValueToDatabase(value);
    },
  );
}

위 코드에서 _loadSliderValue() 함수는 앱이 시작될 때 데이터베이스에서 값을 불러와 Slider의 초기값을 설정합니다. 또한 Slider의 값이 변경될 때마다 해당 값을 데이터베이스에 저장할 수 있습니다.

이제 플러터 앱에서 Slider를 사용하여 데이터베이스에서 값을 불러오고 저장하는 방법에 대해 알아보았습니다. 이를 통해 사용자는 슬라이더를 조작하고 데이터베이스에서 값을 관리할 수 있게 됩니다.