パッケージ、リポジトリ、アプリカテゴリを検索

GitHub リポジトリpmutisya/keymap

キーマップ

オーバーレイ表示付きのFlutterキーマップウィジェット

キーマップ のプロジェクト画像
スター
14
フォーク
8
最終プッシュ(UTC)
2026/06/17
プロジェクト状態
公開中

元の README

以下は英語原文のスナップショットです。最新版は GitHub をご覧ください。

Keymap

A keymap widget letting a developer easily allow end users to use keyboard shortcuts and an associated help screen overlay to any app.

This is pre-alpha and the API will probably change in the future.

Getting started

pub package

dependencies:
  keymap: <latest-version>

Features

  • Easily add keyboard shortcuts to any widget tree
  • Clear, readable help screen
  • Allows rich text introductions with images using the Markdown format
  • Handles focus, passing up unhandled key events
  • Respects application theme colors and fonts

Usage

Add a KeyMap widget to your tree in the build method

@override
Widget build(BuildContext context) {
  return KeyboardWidget(
    bindings: [
      KeyAction.fromString('A','increment the counter', () {
        setState(() {
          count++;
        });}, isControlPressed: true),
      KeyAction(LogicalKeyboardKey.keyD, 'decrement the counter', () {
        setState(() {
          count--;
        });
      }, isAltPressed: true, isControlPressed: true),
    ],
    child: Column(
      children: [
        const Text('Up arrow for adding, down arrow to subtract'),
        Text('count: $count'),
      ],
    ),
  );
}

You can optionally set the number of columns for the text shown in the help screen

  @override
  Widget build(BuildContext context) {
    return KeyboardWidget(
      columnCount: 2,
      child: Scaffold(

This creates keyboard shortcuts that call the referenced methods and a help screen that can be called up by pressing F1 (or any key you choose):

It will shift colors to match your app's theme (here in dark mode)

You can add rich text (using Markdown format) above the keyboard map. A code sample showing how to do this can be found in the examples directory

Paul Mutisya GitHub avatar
GitHub 作者

Paul Mutisya ↗

言語DartHTMLSwiftKotlinObjective-C

このリポジトリが公開するパッケージ

使用している依存関係

依存関係一覧 4 件

プロジェクトに合うリポジトリを選ぶには?

用途で絞り込み、開発状況を比較し、採用前に元のリポジトリで要件を確認しましょう。

  1. 名前・作者・説明で検索し、技術トピックで絞り込みます。
  2. スター、フォーク、最近のプッシュを比較します。スターは関心の目安であり、品質の保証ではありません。
  3. 利用前に GitHub で README、ライセンス、Issues を確認します。

情報源と管理

“A repository is the most basic element of GitHub.”

GitHub Docs — About repositories ↗