Flutter偏好设置管理插件prefman的使用

发布于 1周前 作者 bupafengyu 来自 Flutter

Flutter偏好设置管理插件prefman的使用

PrefMan

Pub Version

PrefMan 是一个结构化的方式来管理偏好设置。

Preference 类

var settings = AppPreferences();

class AppPreferences extends SettingManifest {
  final theme = Preference<String>.options(
    key: 'theme',
    defaultValue: 'blue',
    options: [
      Option('blue'),
      Option('red'),
      Option('orange'),
    ],
  );

  final username = Preference<String>.any(
    key: 'username',
    defaultValue: 'user',
  );

  final volume = Preference.integer(
    key: 'volume',
    defaultValue: 10,
    min: 0,
    max: 15,
  );

  final askAgain = Preference.boolean(
    key: 'ask_again',
    defaultValue: true,
  );

  List<Preference> get preferences => [theme, username, volume, askAgain];
}

使用

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await PrefMan.initialize();
  // ...
}
 var username = settings.username.get();
 settings.username.setValue('new username');

持久化变量

你不必在 SettingManifest 中声明你的偏好设置,也可以将它们作为持久化变量使用。

final count = Preference.integer(key: 'counter', defaultValue: 0);

[@override](/user/override)
Widget build(BuildContext context) {
  return Scaffold(
    body: Center(
      child: Text(count.get().toString()),
    ),
    floatingActionButton: FloatingActionButton(
      child: Icon(Icons.add),
      onPressed: () async {
        await count.setValue(count.get() + 1);
        setState(() {});
      },
    ),
  );
}

计数器将在每次运行时保持持久性!

可观察性

Preference 类实现了 Listenable 接口,因此你可以使用它与 AnimatedBuilder 或其他方式来响应其变化。

final count = Preference.integer(key: 'counter', defaultValue: 0);

[@override](/user/override)
Widget build(BuildContext context) {
  return Scaffold(
    body: Center(
      child: AnimatedBuilder(
        animation: count,
        builder: (context, _) => Text(count.get().toString()),
      ),
    ),
    floatingActionButton: FloatingActionButton(
      child: Icon(Icons.add),
      onPressed: () => count.setValue(count.get() + 1),
    ),
  );
}

更多关于Flutter偏好设置管理插件prefman的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter偏好设置管理插件prefman的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


当然,关于Flutter中的偏好设置管理插件prefman的使用,下面是一个具体的代码案例来展示如何使用该插件来存储和读取应用的偏好设置。

首先,确保你已经在pubspec.yaml文件中添加了prefman依赖:

dependencies:
  flutter:
    sdk: flutter
  prefman: ^^最新版本号(请替换为实际最新版本号)

然后,运行flutter pub get来安装依赖。

接下来,是一个简单的示例,展示如何使用prefman来存储和读取用户偏好设置,比如主题模式(亮色或暗色)。

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

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Prefman Demo',
      theme: ThemeData(
        brightness: Brightness.light, // 默认主题
      ),
      home: ThemeSelector(),
    );
  }
}

class ThemeSelector extends StatefulWidget {
  @override
  _ThemeSelectorState createState() => _ThemeSelectorState();
}

class _ThemeSelectorState extends State<ThemeSelector> {
  Brightness _currentBrightness;

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

  Future<void> _loadBrightness() async {
    final PrefService prefService = await PrefService.getInstance();
    Brightness? brightness = prefService.get('brightness', defaultValue: Brightness.light);
    setState(() {
      _currentBrightness = brightness!;
      // 更新应用主题
      if (brightness == Brightness.dark) {
        ThemeData theme = Theme.of(context).copyWith(brightness: Brightness.dark);
        MediaQuery.of(context).copyWith(theme: theme).build(context);
      }
    });
  }

  Future<void> _saveBrightness(Brightness brightness) async {
    final PrefService prefService = await PrefService.getInstance();
    await prefService.set('brightness', brightness);
    setState(() {
      _currentBrightness = brightness;
      // 更新应用主题
      if (brightness == Brightness.dark) {
        ThemeData theme = Theme.of(context).copyWith(brightness: Brightness.dark);
        MediaQuery.of(context).copyWith(theme: theme).build(context);
      } else {
        ThemeData theme = Theme.of(context).copyWith(brightness: Brightness.light);
        MediaQuery.of(context).copyWith(theme: theme).build(context);
      }
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Theme Selector'),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Text(
              'Current Theme: ${_currentBrightness == Brightness.dark ? 'Dark' : 'Light'}',
              style: TextStyle(fontSize: 24),
            ),
            SizedBox(height: 20),
            ElevatedButton(
              onPressed: () => _saveBrightness(Brightness.light),
              child: Text('Light Theme'),
            ),
            SizedBox(height: 10),
            ElevatedButton(
              onPressed: () => _saveBrightness(Brightness.dark),
              child: Text('Dark Theme'),
            ),
          ],
        ),
      ),
    );
  }
}

代码说明:

  1. 依赖引入:在pubspec.yaml文件中引入prefman依赖。
  2. PrefService实例化:使用PrefService.getInstance()来获取PrefService的实例。
  3. 读取偏好设置:在_loadBrightness方法中,从偏好设置中读取brightness值,并更新应用的主题。
  4. 保存偏好设置:在_saveBrightness方法中,将用户选择的主题(亮色或暗色)保存到偏好设置中,并更新应用的主题。
  5. UI界面:创建了一个简单的界面,允许用户选择亮色或暗色主题,并显示当前的主题。

这个示例展示了如何使用prefman插件来管理Flutter应用中的偏好设置。你可以根据需要扩展和修改这个示例以适应你的应用需求。

回到顶部