如何在Flutter应用中集成Fire TV遥控器控制功能？

Fire TV遥控器的本质是Android按键事件，你可以通过Flutter原生API、第三方插件或原生通道三种方式处理，以下是具体实现方案：

一、直接用Flutter原生API监听全局按键 #

Flutter的RawKeyboardListener和FocusNode可以直接捕获遥控器按键事件，Fire TV常用按键对应逻辑键如下：

• 方向键：LogicalKeyboardKey.arrowUp/Down/Left/Right
• OK键：LogicalKeyboardKey.select
• 返回键：LogicalKeyboardKey.androidBack
• 菜单键：LogicalKeyboardKey.contextMenu

示例代码：

class FireTVRemotePage extends StatefulWidget {
  const FireTVRemotePage({super.key});

  @override
  State<FireTVRemotePage> createState() => _FireTVRemotePageState();
}

class _FireTVRemotePageState extends State<FireTVRemotePage> {
  final FocusNode _remoteFocusNode = FocusNode();

  @override
  void initState() {
    super.initState();
    _remoteFocusNode.requestFocus();
    RawKeyboard.instance.addListener(_handleRemoteKey);
  }

  @override
  void dispose() {
    RawKeyboard.instance.removeListener(_handleRemoteKey);
    _remoteFocusNode.dispose();
    super.dispose();
  }

  void _handleRemoteKey(RawKeyEvent event) {
    if (event is RawKeyDownEvent) {
      final key = event.logicalKey;
      switch (key) {
        case LogicalKeyboardKey.arrowUp:
          print("遥控器向上键触发");
          // 执行向上导航逻辑
          break;
        case LogicalKeyboardKey.arrowDown:
          print("遥控器向下键触发");
          break;
        case LogicalKeyboardKey.arrowLeft:
          print("遥控器向左键触发");
          break;
        case LogicalKeyboardKey.arrowRight:
          print("遥控器向右键触发");
          break;
        case LogicalKeyboardKey.select:
          print("遥控器OK键触发");
          // 执行确认逻辑
          break;
        case LogicalKeyboardKey.androidBack:
          print("遥控器返回键触发");
          // 执行返回逻辑
          break;
      }
    }
  }

  @override
  Widget build(BuildContext context) {
    return Focus(
      focusNode: _remoteFocusNode,
      child: Scaffold(
        body: const Center(child: Text("Fire TV遥控器测试页面")),
      ),
    );
  }
}

二、使用第三方TV遥控器插件 #

有几个专门适配TV端的Flutter插件可以简化开发，推荐两个实用选项：

tv_remote #

这个插件封装了TV端通用的遥控器按键事件，支持Fire TV、Android TV等平台，无需手动映射键值。

1. 添加依赖到pubspec.yaml：

dependencies:
  tv_remote: ^0.1.0 # 替换为最新版本

2. 监听按键事件：

import 'package:tv_remote/tv_remote.dart';

@override
void initState() {
  super.initState();
  TvRemote.instance.listen((remoteEvent) {
    switch (remoteEvent) {
      case TvRemoteEvent.up:
        // 向上键逻辑
        break;
      case TvRemoteEvent.down:
        // 向下键逻辑
        break;
      case TvRemoteEvent.left:
        // 向左键逻辑
        break;
      case TvRemoteEvent.right:
        // 向右键逻辑
        break;
      case TvRemoteEvent.select:
        // OK键逻辑
        break;
      case TvRemoteEvent.back:
        // 返回键逻辑
        break;
      case TvRemoteEvent.menu:
        // 菜单键逻辑
        break;
    }
  });
}

flutter_tv_widgets #

除了按键监听，这个插件还提供TV端专用的导航组件（如焦点导航栏），适合快速搭建Fire TV应用界面。

三、处理Fire TV专属按键（如语音键、商店键） #

如果需要监听Fire TV独有的按键（比如语音助手键、亚马逊商店键），Flutter原生API无法捕获，需要通过MethodChannel和Android原生层交互：

Android原生层（MainActivity.kt） #

import android.view.KeyEvent
import io.flutter.embedding.android.FlutterActivity
import io.flutter.embedding.engine.FlutterEngine
import io.flutter.plugin.common.MethodChannel

class MainActivity : FlutterActivity() {
    private val REMOTE_CHANNEL = "your.app.package/remote"

    override fun configureFlutterEngine(flutterEngine: FlutterEngine) {
        super.configureFlutterEngine(flutterEngine)
        MethodChannel(flutterEngine.dartExecutor.binaryMessenger, REMOTE_CHANNEL).setMethodCallHandler { call, result ->
            // 处理Flutter主动调用的方法，比如请求权限
        }
    }

    override fun onKeyDown(keyCode: Int, event: KeyEvent?): Boolean {
        return when (keyCode) {
            KeyEvent.KEYCODE_VOICE_ASSIST -> {
                // 传递语音按键事件给Flutter
                MethodChannel(flutterEngine?.dartExecutor?.binaryMessenger, REMOTE_CHANNEL)
                    .invokeMethod("onVoiceKeyPressed", null)
                true
            }
            KeyEvent.KEYCODE_APP_SWITCH -> {
                // 传递多任务按键事件给Flutter
                MethodChannel(flutterEngine?.dartExecutor?.binaryMessenger, REMOTE_CHANNEL)
                    .invokeMethod("onAppSwitchKeyPressed", null)
                true
            }
            else -> super.onKeyDown(keyCode, event)
        }
    }
}

Flutter层监听 #

import 'package:flutter/services.dart';

class _FireTVRemotePageState extends State<FireTVRemotePage> {
  static const _remoteChannel = MethodChannel('your.app.package/remote');

  @override
  void initState() {
    super.initState();
    _remoteChannel.setMethodCallHandler((call) async {
      switch (call.method) {
        case 'onVoiceKeyPressed':
          print("Fire TV语音按键触发");
          // 执行语音相关逻辑
          break;
        case 'onAppSwitchKeyPressed':
          print("Fire TV多任务按键触发");
          // 执行多任务切换逻辑
          break;
      }
    });
  }
}

关键配置注意事项 #

在AndroidManifest.xml中添加TV应用必备配置，确保Fire TV识别你的应用为合格的TV端应用：

<uses-feature android:name="android.software.leanback" android:required="true" />
<uses-feature android:name="android.hardware.touchscreen" android:required="false" />

内容的提问来源于stack exchange，提问作者Lakshitha Perera