GestureManager と ActionManager (または ActionList) を使ってコードを書かずに簡単なタッチ/ジェスチャアプリケーションを作成する

By: Chikako Yonezawa

Abstract: この記事では、コードを書くことなく簡単にタッチ/ジェスチャアプリケーションを作成する手順を記します。

RAD Studio 2010 より、Windows 7 でサポートされたマルチタッチ/ジェスチャアプリケーションを作成することができます。

この記事では、コードを書くことなく簡単にタッチ/ジェスチャアプリケーションを作成する手順を記します。

    ジェスチャとは?

スマートフォンに代表されるタッチパネル動作を思い浮かべてください。タッチデバイスを使って行われる動作で、イベントやアクションをトリガするものです。

タッチハードウエアで提供される代替入力手段で使用されるタッチデバイスは指とペン。マウスもサポートされています。

    GestureManagerとは?

アプリケーションにおける、すべてのジェスチャを管理するコンポーネントです。予め標準ジェスチャが登録されています。( 標準ジェスチャについてはこちらをご覧下さい )

ジェスチャ機能を使用するコンポーネントは、TGestureManagerと関連付ける必要があります。その際、TButton等の小規模なコンポーネントではなく、TForm や TPanel などの規模の大きなコンポーネントを選択するようにするといいでしょう。

    ActionManager(ActionList)とは?

アプリケーションで処理されるすべてのアクションの管理。(ActionList は ユーザーの動作に応答してアプリケーションがとるアクションのリストを管理する働きをします)

共通のコードを共有してアクションを実行でき(ツールバーボタンとメニュー項目が同じ動作を行う場合など),さらに,アプリケーションの状態に応じてアクションを使用可/使用不可にする操作を一元化できます。

    簡単なタッチ/ジェスチャアプリケーションの作成

今回は Delphi を使用してアプリケーションを作成します。なお C++Builder でも同様にコードを書かずに作成できます。

  1. IDE のメニューより [ファイル|新規作成|VCL フォームアプリケーション - Delphi] を選択します。

Hide image
Click to see full-sized image

  1. フォーム上に TClientDataSet, TDataSource, TActionManager, TGestureManager をツールパレットからドラッグ&ドロップします

Hide image
RADXE_Touch02

  1. フォーム上の ClientDataSet1 をマウスで選択し、マウスの右ボタンを押し、表示されたポップアップメニューから [MyBase テーブルから読み込み]を選択します。

Hide image
RADXE_Touch03

  1. ファイルの選択画面が表示されるので共有フォルダ(デフォルト C:\Program Files\Common Files\CodeGear Shared\Data)にある biolife.xml を指定します。

Hide image
RADXE_Touch04

  1. オブジェクトインスペクタ上で DataSource1.DataSet プロパティに上記の ClientDataSet1 をセットします。

Hide image
RADXE_Touch05

  1. フォーム上の TClientDataSetをマウスでダブルクリックします。
  2. 項目エディタが表示されますので、マウスの右ボタンを押し、表示されたポップメニューから「すべての項目の追加」を選択します。

Hide image
RADXE_Touch06

  1. 項目エディタ上に追加された Common_Name をマウスでドラックし、フォーム上にドロップします。

Hide image
RADXE_Touch07

  1. 同様に Graphic をマウスでドラッグし、フォーム上にドロップします。

Hide image
RADXE_Touch08

  1. 項目エディタを閉じ、画面の体裁を整えます。

Hide image
RADXE_Touch09

  1. フォーム上の TActionManagerをマウスでダブルクリックします。
  2. アクションのカスタマイズ画面の「アクション」タブを選択し、右上のドロップダウンメニューから「標準アクションの新規追加」を選択します

Hide image
Click to see full-sized image

  1. 標準アクションクラスの一覧が表示されますので、データセット項目内の TDataSetFirst, TDataSetPrior, TDataSetNext, TDataSetLast の4つを Shiftキーを押しながらマウスで選択し、[OK]ボタンを押します。この4つのアクションは、データセットのレコードに対して動作を与えるものです。

Hide image
RADXE_Touch11

  1. [閉じる]をクリックして、画面を閉じます

Hide image
RADXE_Touch12

  1. オブジェクトインスペクタ上で Form1.Touch.GestureManager プロパティに フォーム上の GestureManager1 コンポーネントをセットします。

Hide image
RADXE_Touch13

  1. Form1.Touch.GestureManager プロパティに GestureManager1 コンポーネントをセットすると、すぐ下にある Gesturesプロパティにツリー構造である +が表示されます。この +をマウスでクリックして展開します

Hide image
RADXE_Touch14

  1. \Gestures\Standard下に標準アクションが展開されますので、Left, Right, Up, Downにそれぞれチェックをつけ、アクション項目として追加した DataSetFirst, DataSetLast, DataSetNext, DataSetPrior をそれぞれ設定します。今回は以下のように関連付けました。

Left

DataSetPrior1

タッチデバイスを←のように動かすと前のレコード

Right

DataSetNext1

タッチデバイスを→のように動かすと次のレコード

Up

DataSetFirst1

タッチデバイスを↑のように動かすと最初のレコード

Down

DataSetLast1

タッチデバイスを↓のように動かすと最後のレコード

Hide image
RADXE_Touch15

  1. アプリケーションが完成しました。メニューの [実行|実行]でアプリケーションを実行してみましょう。

Hide image
RADXE_Touch16

実行されたフォーム上でタッチデバイスを動かすと関連付けられたアクションが実行し、レコードが移動するアプリケーションが作成できました!

(マウスの場合は、フォーム上で基点となる地点でマウスの左ボタンを押した状態で上下左右に動かし、終点とするところでボタンを離します。)

Hide image
Click to see full-sized image

Server Response from: ETNASC03