Flutter桌面通知插件xdg_status_notifier_item的使用

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

Flutter桌面通知插件xdg_status_notifier_item的使用

允许在Linux桌面使用状态通知（即系统托盘）通过 StatusNotifierItem规范。

import 'package:xdg_status_notifier_item/xdg_status_notifier_item.dart';

late final StatusNotifierItemClient client;

void main() async {
  client = StatusNotifierItemClient(
      id: 'test-client',
      iconName: 'computer-fail-symbolic',
      menu: DBusMenuItem(children: [
        DBusMenuItem(label: 'Hello'),
        DBusMenuItem(label: 'World', enabled: false),
        DBusMenuItem.separator(),
        DBusMenuItem(
            label: 'Quit', onClicked: () async => await client.close()),
      ]));
  await client.connect();
}

示例代码

以下是一个完整的示例代码，展示了如何使用 xdg_status_notifier_item 插件创建一个带有菜单项的桌面通知。

import 'package:xdg_status_notifier_item/xdg_status_notifier_item.dart';

late StatusNotifierItemClient client;
var itemClicked = false;
var checkmarkIsActive = true;
var activeRadio = 1;

// 构建菜单项
DBusMenuItem buildMenu() {
  return DBusMenuItem(children: [
    DBusMenuItem(
        label: itemClicked ? '点击项目' : '项目',
        onClicked: () async => await handleClick()),
    DBusMenuItem(label: '禁用项目', enabled: false),
    DBusMenuItem(label: '不可见项目', visible: false),
    DBusMenuItem.separator(),
    DBusMenuItem(label: '子菜单', children: [
      DBusMenuItem(
          label: '子菜单 1',
          onClicked: () async => print('子菜单项 1 被点击！')),
      DBusMenuItem(
          label: '子菜单 2',
          onClicked: () async => print('子菜单项 2 被点击！')),
      DBusMenuItem(
          label: '子菜单 3',
          onClicked: () async => print('子菜单项 3 被点击！'))
    ]),
    DBusMenuItem.separator(),
    DBusMenuItem.checkmark('复选框',
        state: checkmarkIsActive,
        onClicked: () async => await toggleCheckmark()),
    DBusMenuItem.separator(),
    DBusMenuItem.checkmark('单选 1',
        state: activeRadio == 1, onClicked: () async => await setRadio(1)),
    DBusMenuItem.checkmark('单选 2',
        state: activeRadio == 2, onClicked: () async => await setRadio(2)),
    DBusMenuItem.checkmark('单选 3',
        state: activeRadio == 3, onClicked: () async => await setRadio(3)),
    DBusMenuItem.separator(),
    DBusMenuItem(label: '退出', onClicked: () async => await client.close()),
  ]);
}

// 更新菜单项
Future<void> rebuild() async {
  await client.updateMenu(buildMenu());
}

// 处理点击事件
Future<void> handleClick() async {
  itemClicked = true;
  await rebuild();
}

// 切换复选框状态
Future<void> toggleCheckmark() async {
  checkmarkIsActive = !checkmarkIsActive;
  await rebuild();
}

// 设置单选按钮状态
Future<void> setRadio(int active) async {
  activeRadio = active;
  await rebuild();
}

// 主函数
void main() async {
  client = StatusNotifierItemClient(
      id: 'dart-test', iconName: 'computer-fail-symbolic', menu: buildMenu());
  await client.connect();
}

更多关于Flutter桌面通知插件xdg_status_notifier_item的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter桌面通知插件xdg_status_notifier_item的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


在Flutter中，使用xdg_status_notifier_item插件来实现桌面通知，主要是针对Linux桌面环境的一种解决方案。这个插件允许你的Flutter应用在Linux桌面上显示系统托盘图标，并通过该图标发送通知。

以下是一个基本的示例，展示如何在Flutter项目中使用xdg_status_notifier_item插件。请注意，你需要确保你的开发环境已经设置好了Flutter和Dart，并且你的Linux系统支持xdg-utils。

1. 添加依赖

首先，在你的pubspec.yaml文件中添加xdg_status_notifier_item的依赖：

dependencies:
  flutter:
    sdk: flutter
  xdg_status_notifier_item: ^0.x.x  # 请替换为最新版本号

2. 导入包并初始化

在你的Flutter项目的Dart文件中（例如main.dart），导入该包并初始化：

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

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

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  late XdgStatusNotifierItem? notifierItem;

  @override
  void initState() {
    super.initState();
    // 初始化托盘图标
    notifierItem = XdgStatusNotifierItem(
      title: 'My Flutter App',
      icon: 'path/to/your/icon.png',  // 托盘图标的路径
      category: 'ApplicationStatus',
    );

    // 设置点击事件
    notifierItem!.onActivated!.listen((_) {
      // 这里可以添加点击托盘图标后的逻辑
      print('Tray icon clicked!');
    });

    // 显示托盘图标
    notifierItem!.show();
  }

  @override
  void dispose() {
    // 清理资源
    notifierItem?.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('Flutter Desktop Notification'),
        ),
        body: Center(
          child: ElevatedButton(
            onPressed: () {
              // 发送桌面通知
              _showNotification();
            },
            child: Text('Show Notification'),
          ),
        ),
      ),
    );
  }

  void _showNotification() {
    // 这里假设你已经有了notifierItem的实例
    if (notifierItem != null) {
      notifierItem!.showMessage(
        summary: 'New Message',
        body: 'This is a desktop notification from Flutter!',
        icon: 'path/to/your/notification_icon.png',  // 通知图标的路径
      );
    }
  }
}

3. 运行应用

确保你的Linux系统支持xdg-utils，然后运行你的Flutter应用：

flutter run -d linux

注意事项

  1. 图标路径：确保你提供的图标路径是正确的，并且图标文件存在于该路径下。
  2. 权限：在某些Linux发行版上，可能需要额外的权限来显示系统托盘图标或发送桌面通知。
  3. 插件版本：由于Flutter和插件生态的快速变化，确保你使用的是最新版本的xdg_status_notifier_item插件。

这个示例展示了如何在Flutter桌面应用中初始化托盘图标，并发送桌面通知。根据你的具体需求，你可以进一步自定义和扩展这个示例。

回到顶部