Flutter自定义键盘布局插件super_keyboard_layout的使用

特性

• 支持macOS、Windows和Linux平台。
• 允许根据当前键盘布局在物理键、逻辑键和平台特定键代码之间进行映射。
• 提供键盘布局更改的通知。

开始使用

super_keyboard_layout 插件内部使用了Rust来实现低级别的平台特定功能。如果你没有安装Rust，插件会自动下载预编译的二进制文件。如果你想从源代码编译Rust代码，可以通过rustup安装Rust。

安装Rust

对于macOS或Linux，执行以下命令：

curl --proto '=https' --tlsv1.2 -sSf https://sh.rustup.rs | sh

对于Windows，可以使用Rust Installer。

如果你已经安装了Rust，请确保更新到最新版本：

rustup update

第一次构建可能需要一些时间，因为需要安装所需的Rust目标和其他依赖项。

使用方法

import 'package:super_keyboard_layout/super_keyboard_layout.dart';

void main() async {
    final manager = await KeyboardLayoutManager.instance();
    if (manager.supported) {
        // 运行在支持的平台上
        manager.onLayoutChanged.addListener(() {
            // 键盘布局已更改
            print('Keyboard layout changed');
        });
    }

    final layout = manager.currentLayout;

    // 获取当前布局下带有shift键的物理键1对应的逻辑键
    final logicalKey = layout.getLogicalKeyForPhysicalKey(PhysicalKeyboardKey.digit1, shift: true);

    // 获取逻辑键对应的物理键
    final physicalKey = layout.getPhysicalKeyForLogicalKey(LogicalKeyboardKey.keyA);

    // 获取逻辑键或物理键的平台特定键代码
    final platformCode = layout.getPlatformKeyCode(PhysicalKeyboardKey.digit1);
}

运行示例

示例项目位于 super_keyboard_layout/example。你可以通过以下步骤运行示例：

flutter pub global activate melos # 如果你还没有安装melos
git clone https://github.com/superlistapp/super_native_extensions.git
cd super_native_extensions
melos bootstrap

之后，可以在VSCode中打开该文件夹并运行 super_keyboard_layout 启动配置。

示例代码

下面是一个完整的示例应用，展示如何使用 super_keyboard_layout 插件：

import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:super_keyboard_layout/super_keyboard_layout.dart';

late KeyboardLayoutManager _keyboardLayoutManager;

void main() async {
  _keyboardLayoutManager = await KeyboardLayoutManager.instance();
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Super Keyboard Layout Example',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: const MyHomePage(title: 'Super Keyboard Layout Example'),
    );
  }
}

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

  @override
  State<LayoutDemoWidget> createState() => _LayoutDemoWidgetState();
}

class _LayoutDemoWidgetState extends State<LayoutDemoWidget> {
  late FocusNode _focusNode;
  PhysicalKeyboardKey? _lastKey;

  @override
  void initState() {
    super.initState();
    _focusNode = FocusNode(debugLabel: 'Example focus node');
    _focusNode.onKeyEvent = _onKeyEvent;
    _focusNode.requestFocus();
    _keyboardLayoutManager.onLayoutChanged.addListener(_layoutChanged);
  }

  KeyEventResult _onKeyEvent(FocusNode node, KeyEvent event) {
    if (event is KeyDownEvent) {
      setState(() {
        _lastKey = event.physicalKey;
      });
    }
    return KeyEventResult.handled;
  }

  @override
  void dispose() {
    _focusNode.dispose();
    _keyboardLayoutManager.onLayoutChanged.removeListener(_layoutChanged);
    super.dispose();
  }

  void _layoutChanged() {
    setState(() {});
    ScaffoldMessenger.of(context).showSnackBar(
      const SnackBar(
        content: Text("Keyboard layout has changed."),
        duration: Duration(milliseconds: 1500),
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      padding: const EdgeInsets.all(10),
      decoration: BoxDecoration(
        border: Border.all(
            color: _focusNode.hasFocus ? Colors.red : Colors.grey, width: 2),
      ),
      child: FocusableActionDetector(
        onFocusChange: (_) {
          setState(() {});
        },
        focusNode: _focusNode,
        child: GestureDetector(
          behavior: HitTestBehavior.opaque,
          onTapDown: (details) {
            _focusNode.requestFocus();
          },
          child: _lastKey == null
              ? const Text('Press any key')
              : Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    const Text("Pressed physical key:",
                        style: TextStyle(fontWeight: FontWeight.bold)),
                    Text(_lastKey!.toString()),
                    const SizedBox(
                      height: 10,
                    ),
                    const Text('Logical key for current keyboard layout:',
                        style: TextStyle(fontWeight: FontWeight.bold)),
                    Text(_keyboardLayoutManager.currentLayout
                            .getLogicalKeyForPhysicalKey(_lastKey!)
                            ?.toString() ??
                        'null'),
                    const Text(
                        'Logical key for current keyboard layout (with shift):',
                        style: TextStyle(fontWeight: FontWeight.bold)),
                    Text(_keyboardLayoutManager.currentLayout
                            .getLogicalKeyForPhysicalKey(_lastKey!, shift: true)
                            ?.toString() ??
                        'null'),
                    const Text(
                        'Logical key for current keyboard layout (with alt):',
                        style: TextStyle(fontWeight: FontWeight.bold)),
                    Text(_keyboardLayoutManager.currentLayout
                            .getLogicalKeyForPhysicalKey(_lastKey!, alt: true)
                            ?.toString() ??
                        'null'),
                    const SizedBox(
                      height: 20,
                    ),
                    const Text(
                      'Because this functionality is intended for '
                      'keyboard shortcuts, only ASCII capable keyboard '
                      'layouts are supported.\nOn Linux switching between '
                      'keyboards is only recognized after pressing a key from'
                      ' new layout.',
                      style: TextStyle(fontSize: 11.5),
                    ),
                  ],
                ),
        ),
      ),
    );
  }
}

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

  final String title;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(title),
      ),
      body: Padding(
        padding: const EdgeInsets.all(20.0),
        child: Center(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              if (!_keyboardLayoutManager.supported)
                const Text(
                  'KeyboardLayoutManager is not supported on this platform.',
                ),
              if (_keyboardLayoutManager.supported) const LayoutDemoWidget(),
            ],
          ),
        ),
      ),
    );
  }
}

额外信息

此插件仍处于开发的早期阶段且具有实验性质。欢迎提交PRs和bug reports！