2010-01-29

Flexアプリケーションに設定できるキーボードショートカット

1 2

はじめに

Flexで実際の業務アプリケーションやWebサイトを構築する際にキーボード周りの実装でトラブルが発生することがあります。ちょっとした工夫でトラブルを回避し、アプリケーションが使いやすくなるようなTIPSを紹介します。この記事は初級、中級のFlex技術者の向けです。

ユーザーレベル：初級、中級: 製品：Adobe Flex、Adobe AIR、Flex Builder

概要

Flexアプリケーション、特に業務用途では、要件にキーボードショートカットが含まれることが多くなります。一般的なアプリケーションでは、キーボードショートカットは当たり前のように定義されていますし、良く使われる機能に対してキーボードショートカットを定義することは、ユーザビリティの向上や業務効率の改善に繋がるため、求められることの多い機能であるように思います。
(良く耳にするのは、ファンクションキー(F1～F10)に対して、特定の操作を割り当てたいという要求)

ところが、Flexアプリケーションでは、全てのキーボードショートカットを使用できる訳ではありません。
これは、Flexアプリケーションがブラウザ上で動作することによる制約です。
Flexで使用できるキーボードショートカットが一覧になっているものを探したのですが、見当たらなかったため、今回一覧表をブラウザ毎に作成しました。Flexアプリケーションの仕様の検討の際などに役立てて頂ければ幸いです。
また、キーボードショートカットが使えるかどうかの判定に使えるサンプルも併せて作成しました。
Flexでキーボードショートカットを実装する方法は最後に紹介しますので参考にして下さい。

必要なソフトウェア

Flex Builder 3
Flex SDK 3.2 (3.5推奨)

最終完成品

こちらからダウンロードできます。

KeyboardShortcut.zip

それでは、詳細を説明していきます。

Flexアプリにキーボードショートカットを割り当てる際の制約

以下のような制約が存在します。

1、ブラウザによる制約

単体で動作するAIRアプリにはこの制限はありませんが、ブラウザ上で動作するFlexアプリケーションの場合、ブラウザにショートカットキーのイベントがインターセプトされてしまいます。その結果、Flexアプリ側ではそのキーのイベントを検出することができません。
JavaScriptを用いて、ブラウザに一旦受け付けられたキー入力を、独自にFlash側に送るという実装も可能ですが、キーによっては完全に動作しないこともあります。また、実装や仕組みが煩雑になることや保守性の低下などの点からあまりお勧めできません。

2、OSによる制約

OSのショートカットキーは、OSにショートカットキーのイベントがインターセプトされ検出できない、あるいは、検出はできるがOSのデフォルトの挙動が実行され、結果としてFlashからキーフォーカスが外れるため、Flashでの使用は困難です(例: Windowsキー)。
また、Windows環境においては、Alt+Tabなど、Altキーと他の何かのキーの組み合わせは検出できません。これは、Ａｌｔキーがアプリケーションの「アクセラレータキー」として機能するためです(例: メニューを開く)