Flutter功能通知插件feature_notifier的使用

Flutter功能通知插件feature_notifier的使用

1. Flutter功能通知插件feature_notifier的介绍

feature_notifier 是是一个用于在应用程序更新后通知用户新功能的Flutter插件。它提供了多种类型的自定义通知，如横条通知、卡片通知、警报对话框和底部模态弹窗，并且可以根据用户的交互来定制这些通知的状态。

2. 示例代码

下面是一个完整的示例代码，展示了如何使用feature_notifier插件创建各种类型的自定义通知。

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

void main() async {
  await FeatureNotifier.init();
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Feature Notifier Test',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: const MyHomePage(title: "Feature Notifier test"),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key, required this.title});

  final String title;

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  void _reset() {
    setState(() {
      FeatureNotifier.persistAll();
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Padding(
                padding: const EdgeInsets.all(20 ),
                child: FeatureCardNotifier(
                  title: "Testing this out",
                  hasButton: true,
                  description:
                      'You can now show items without inviting friends!',
                  featureKey: 1,
                  onClose: () {},
                  onTapCard: () {},
                  showIcon: true,
                  onTapButton: () {},
                )),
            Padding(
                padding: const EdgeInsets.all( 20 ),
                child: FeatureBarNotifier(
                  title:
                      "Testing this out You have pushed the button this many times:",
                  featureKey: 22,
                  onClose: () {},
                  onTapCard: () {},
                  showIcon: true,
                  // icon: Text("dog"),
                )),
          ],
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: _reset,
        tooltip: 'Persist all features',
        child: const Icon(Icons.clear),
      ), // This trailing comma makes auto-formatting nicer for build methods.
    );
  }
}

3. 初始化

在main()函数中初始化FeatureNotifier并等待其完成：

void main() async {
  await FeatureNotifier.init();
  runApp(const MyApp());
}

4. 不同类型的Feature Notifiers

feature_notifier 提供了四种独特的自定义Feature Notifiers：

• 1. 横条通知 (Bar Notifier)

FeatureBarNotifier(
  title: "We just released a new feature!",
  featureKey: 22,
  onClose: () {},
  onTapCard: () {},
  showIcon: true,
)

• 2. 卡片通知 (Card Notifier)

FeatureCardNotifier(
  title: "We just released a new feature!",
  description: "Checkout the nwq feature that we just released and make.",
  featureKey: 22,
  onClose: () {},
  onTapCard: () {},
  showIcon: true,
  hasButton: true,
)

• 3. 警报对话框 (Alert Dialog Notifier)

FeatureAlertNotifier.notify(
  context,
  title: "We just released a new feature!",
  description: "Checkout the nwq feature that we just released and make.",
  onClose: () {},
  featureKey: 3,
  hasButton: true,
);

• 4. 底部模态弹窗 (Bottom Modal Sheet Notifier)

FeatureBottomModalSheetNotifier.notify(
  context,
  title: "We just released a new feature!",
  description: "Checkout the nwq feature that we just released and make.",
  onClose: () {},
  featureKey: 3,
  hasButton: true,
);

5. 自定义Body

从版本1.0.7开始，FeatureAlertNotifier 和 FeatureBottomModalSheetNotifier 可以通过body参数添加自定义内容，以提高展示灵活性。

FeatureBottomModalSheetNotifier.notify(
  context,
  title: "Alert Notifier",
  description: "Modal sheet is a good way to display a feature",
  onClose: () {},
  featureKey: 3,
  hasButton: true,
  body: Row(...)
);

6. 创建自定义通知

feature_notifier 提供了一些方法来创建自定义通知和管理状态：

• FeatureNotifier.close()：关闭自定义Feature Notifier。
• FeatureNotifier.isClosed()：检查特定Feature Notifier是否已关闭。
• FeatureNotifier.persist()：保持特定Feature Notifier活跃，即使它已被关闭。
• FeatureNotifier.persistAll()：保持所有Feature Notifiers活跃，即使它们已被关闭。

8. 参数

以下是可用的参数列表：

int featureKey; /// 用于唯一标识一个特征
String title;
Color? titleColor;
double? titleFontSize;
String description;
Color? descriptionColor;
double? descriptionFontSize;
String? buttonText;
Color? buttonTextColor;
double? buttonTextFontSize;
Color? buttonBackgroundColor;
Widget? icon;
bool? showIcon;
void Function() onClose;
void Function()? onTapButton;
Color? backgroundColor;
Color? strokeColor;
double? strokeWidth;
void Function() onTapCard; /// 当Feature Notifier卡片被点击时触发
bool? hasButton;
Widget? body /// 添加自定义内容到你的通知器