Flutter媒体键检测插件media_key_detector_macos的使用

media_key_detector_macos

media_key_detector_macos 是 media_key_detector 插件的 macOS 实现。

使用

此包是 推荐插件（endorsed federated plugin），这意味着你可以直接正常使用 media_key_detector。当你这样做的时候，此包会自动包含在你的应用中。

完整示例代码

以下是一个完整的 Flutter 应用示例，展示如何使用 media_key_detector_macos 插件来检测 macOS 的媒体按键事件。

import 'package:flutter/material.dart';
import 'package:media_key_detector/media_key_detector.dart'; // 导入媒体键检测库

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: MediaKeyDetectorExample(),
    );
  }
}

class MediaKeyDetectorExample extends StatefulWidget {
  @override
  _MediaKeyDetectorExampleState createState() => _MediaKeyDetectorExampleState();
}

class _MediaKeyDetectorExampleState extends State<MediaKeyDetectorExample> {
  String _eventLog = ''; // 用于存储媒体按键事件的日志

  @override
  void initState() {
    super.initState();
    // 初始化媒体键监听器
    MediaKeyDetector.instance.addListener(onKeyEvent);
  }

  @override
  void dispose() {
    // 移除监听器以避免内存泄漏
    MediaKeyDetector.instance.removeListener(onKeyEvent);
    super.dispose();
  }

  void onKeyEvent(KeyEvent event) {
    // 更新日志并重新渲染界面
    setState(() {
      _eventLog += '${event.key} pressed\n';
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('媒体键检测示例'),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Text(
              '按下媒体按键以查看事件:',
              style: TextStyle(fontSize: 18),
            ),
            SizedBox(height: 20),
            Container(
              padding: EdgeInsets.all(16),
              decoration: BoxDecoration(
                border: Border.all(color: Colors.grey),
                borderRadius: BorderRadius.circular(8),
              ),
              width: 300,
              height: 200,
              child: SingleChildScrollView(
                child: Text(_eventLog), // 显示媒体按键事件日志
              ),
            ),
          ],
        ),
      ),
    );
  }
}

代码说明

1. 导入库

   import 'package:media_key_detector/media_key_detector.dart';

   导入 media_key_detector_macos 插件的核心库。

2. 初始化监听器
   在 initState 方法中添加事件监听器：

   MediaKeyDetector.instance.addListener(onKeyEvent);

3. 移除监听器
   在 dispose 方法中移除事件监听器，防止内存泄漏：

   MediaKeyDetector.instance.removeListener(onKeyEvent);

4. 处理媒体按键事件
   当媒体按键被触发时，onKeyEvent 回调函数会被调用，更新日志并在界面上显示：

   void onKeyEvent(KeyEvent event) {
     setState(() {
       _eventLog += '${event.key} pressed\n';
     });
   }

5. UI 界面
   使用 Text 和 Container 展示媒体按键事件的日志：

   Container(
     padding: EdgeInsets.all(16),
     decoration: BoxDecoration(
       border: Border.all(color: Colors.grey),
       borderRadius: BorderRadius.circular(8),
     ),
     width: 300,
     height: 200,
     child: SingleChildScrollView(
       child: Text(_eventLog),
     ),
   )