Flutter动画与交互插件reflex的使用
Flutter动画与交互插件reflex的使用
Reflex
Flutter插件用于通知读取与回复。
兼容性
✅ Android
❌ iOS (问题: iOS支持reflex)
显示一些爱心并收藏仓库
为什么使用Reflex?
Reflex插件的特点包括:
- 快速、高性能且兼容性强
- 免费且开源
- 生产就绪
- 使应用具备响应能力
特点
以下所有功能都可以在运行时执行:
- 获取通知流
- 读取通知
- 从通知中回复
- 自动回复
演示
快速开始
步骤1:将插件添加到项目中
在 pubspec.yaml
文件中添加依赖:
dependencies:
reflex: <最新版本>
运行 pub get
获取包。
步骤2:在 AndroidManifest.xml
中添加服务
在 <application>
标签内添加以下服务:
<service
android:label="notifications"
android:name="com.devsonflutter.reflex.notification.NotificationListener"
android:permission="android.permission.BIND_NOTIFICATION_LISTENER_SERVICE">
<intent-filter>
<action android:name="android.service.notification.NotificationListenerService" />
</intent-filter>
</service>
对于Android 12及以上版本,添加 android:exported="true"
字段以使其兼容:
<service
android:label="notifications"
android:name="com.devsonflutter.reflex.notification.NotificationListener"
android:permission="android.permission.BIND_NOTIFICATION_LISTENER_SERVICE"
android:exported="true">
<intent-filter>
<action android:name="android.service.notification.NotificationListenerService" />
</intent-filter>
</service>
步骤3:实例化Reflex
只允许实例化一次:
Reflex reflex = Reflex();
示例
前往 pub.dev
的示例部分查看完整的示例代码。
在GitHub中,前往 example/lib/main.dart
查看完整的示例代码。
导入
单个导入即可使用reflex:
import 'package:reflex/reflex.dart';
监听与回复
StreamSubscription<ReflexEvent>? _subscription;
final List<ReflexEvent> _notificationLogs = [];
final List<ReflexEvent> _autoReplyLogs = [];
bool isListening = false;
Reflex reflex = Reflex(
debug: true,
packageNameList: ["com.whatsapp", "com.tyup"],
packageNameExceptionList: ["com.facebook"],
autoReply: AutoReply(
packageNameList: ["com.whatsapp"],
message: "[Reflex] 这是一个自动回复。",
),
);
@override
void initState() {
super.initState();
initPlatformState();
}
Future<void> initPlatformState() async {
startListening();
}
void onData(ReflexEvent event) {
setState(() {
if (event.type == ReflexEventType.notification) {
_notificationLogs.add(event);
} else if (event.type == ReflexEventType.reply) {
_autoReplyLogs.add(event);
}
});
debugPrint(event.toString());
}
void startListening() {
try {
_subscription = reflex.notificationStream!.listen(onData);
setState(() {
isListening = true;
});
} on ReflexException catch (exception) {
debugPrint(exception.toString());
}
}
void stopListening() {
_subscription?.cancel();
setState(() => isListening = false);
}
快速指南
调试
调试允许你调试插件的功能,日志会显示在控制台。
默认情况下调试日志已启用。你可以通过在 Reflex
类中使用 debug
字段进行配置:
Reflex reflex = Reflex(
debug: false,
);
监听通知权限
检查是否已经授予了监听通知的权限:
bool isPermissionGranted = await Reflex.isPermissionGranted;
请求监听通知权限
使用该函数来请求监听通知的权限:
await Reflex.requestPermission();
通知流
使用 reflex
对象获取通知流,以便在Flutter应用中监听通知:
StreamSubscription<ReflexEvent>? _subscription;
_subscription = reflex.notificationStream!.listen((event) {
// 应用逻辑
});
该流会在收到通知时订阅 ReflexEvent
。
Reflex事件
传入的 ReflexEvent
包含以下信息:
- 类型:当收到通知时为
ReflexEventType.notification
,当发送自动回复时为ReflexEventType.reply
。 - 包名:接收通知的应用程序的包名。
- 标题:通知标题。
- 消息:包含在通知中的消息及发送回复时的消息。
- 时间戳:通知接收和回复发送的时间戳。
监听特定应用的通知
指定要监听通知的应用程序列表:
如果 packageNameList: null
,插件将监听所有包的通知。
Reflex reflex = Reflex(
debug: true,
packageNameList: ["com.whatsapp", "com.facebook"],
);
避免特定应用的通知
指定包名异常列表以避免监听某些应用程序的通知:
如果 packageNameExceptionList: null
,插件将监听 packageNameList
(如果不为空)的通知。
Reflex reflex = Reflex(
debug: true,
packageNameExceptionList: ["com.whatsapp"],
);
自动回复
在监听通知时发送自动回复:
AutoReply autoReply = AutoReply(
message: "[Reflex] 这是一个自动回复。",
),
特定应用的自动回复
在 AutoReply
中指定 packageNameList
以对特定应用进行自动回复:
AutoReply autoReply = AutoReply(
packageNameList: ["com.whatsapp"],
message: "[Reflex] 这是一个自动回复。",
),
AutoReply
对象由 Reflex
的 autoReply
字段用于自动回复应用程序。
Reflex reflex = Reflex(
debug: true,
packageNameList: ["com.whatsapp", "com.tyup"],
packageNameExceptionList: ["com.miui.securitycenter"],
autoReply: AutoReply(
packageNameList: ["com.whatsapp"],
message: "[Reflex] 这是一个自动回复。",
),
);
更多关于Flutter动画与交互插件reflex的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html
更多关于Flutter动画与交互插件reflex的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html
当然,关于在Flutter中使用Reflex进行动画与交互,这里有一个简单的代码示例来展示其基本用法。Reflex是一个强大的Flutter包,它允许开发者通过声明式API轻松创建复杂的动画和交互。
首先,确保你已经在pubspec.yaml
文件中添加了Reflex依赖:
dependencies:
flutter:
sdk: flutter
reflex: ^latest_version # 请替换为最新的版本号
然后运行flutter pub get
来安装依赖。
以下是一个简单的示例,展示了如何使用Reflex来创建一个点击按钮时产生缩放动画的效果:
import 'package:flutter/material.dart';
import 'package:reflex/reflex.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(
title: Text('Reflex Animation Example'),
),
body: ReflexAnimationExample(),
),
);
}
}
class ReflexAnimationExample extends StatefulWidget {
@override
_ReflexAnimationExampleState createState() => _ReflexAnimationExampleState();
}
class _ReflexAnimationExampleState extends State<ReflexAnimationExample> with SingleTickerProviderStateMixin {
ReflexController _controller;
@override
void initState() {
super.initState();
_controller = ReflexController();
}
@override
void dispose() {
_controller.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
return Reflex(
controller: _controller,
child: Center(
child: ReflexAnimatable(
key: UniqueKey(), // 确保每次重建时有唯一的Key
animations: {
ReflexAction.tap: ReflexActionData(
actions: [
ReflexActionItem(
animation: ReflexTween(
begin: 1.0,
end: 1.2,
duration: Duration(milliseconds: 300),
curve: Curves.easeInOut,
),
property: ReflexProperty.scale,
),
ReflexActionItem(
animation: ReflexTween(
begin: 1.2,
end: 1.0,
duration: Duration(milliseconds: 300),
curve: Curves.easeInOut,
delay: Duration(milliseconds: 300), // 动画结束后恢复原状
),
property: ReflexProperty.scale,
),
],
),
},
child: Container(
width: 100,
height: 100,
color: Colors.blue,
child: Center(
child: Text(
'Tap Me',
style: TextStyle(color: Colors.white),
),
),
),
),
),
);
}
}
在这个示例中,我们做了以下几件事:
- 创建了一个
ReflexController
来控制动画。 - 使用
Reflex
包裹整个动画区域。 - 使用
ReflexAnimatable
来定义可动画化的子组件,并为其设置动画属性。 - 在
animations
属性中定义了点击(ReflexAction.tap
)时要执行的动画,这里我们定义了一个缩放动画,点击时放大到1.2倍,然后300毫秒后恢复原始大小。
这个示例只是一个起点,Reflex支持多种动画属性和复杂的交互逻辑,你可以根据需求进一步探索和自定义动画效果。