LINEで送る

今回から、Windowsフォームのインク機能を紹介します。
Windowsフォームでは、InkPictureとInkEditという2つのコントロールを利用します。

InkEdit : 手書きの文字を認識してテキストボックスに表示するコントロール
InkPicture : 手書きのインクを表示するコントロール

こちらも、以前のWPFと同様に環境の構築から行う必要があります。

1. 「Windows SDK for Vista」のインストール
前回のBlog エントリで紹介した「Windows SDK for Vista」を使用します。
「Windows SDK for Vista」がインストールされていない場合は、以下のサイトからダウンロードし、インストールします。
「Windows SDK for Vista」に付属する「Microsoft.Ink.dll」を利用してインクの機能を実装していきます。

http://www.microsoft.com/ja-jp/download/details.aspx?id=30950

※ Windows SDK for Windows 7 でもMicrosoft.Ink.dll はインストールされますが、GAC に登録される点をご注意下さい。

2. プロジェクトの作成
Visual Studioを起動し、プロジェクトを作成します。
今回はWindowsフォームのC#で進めていきます。

winform_01_01

3. ツールボックスへのコントロール追加
デフォルトの状態では、ツールボックスにはInkEditとInkPictureは表示されていませんので、ツールボックスのアイテムの選択からコントロールを追加します。
「.NET Framework コンポーネント」タブの参照から直接、Microsoft.Ink.dllというDLLを参照してコントロールを追加します。

私の環境では、以下のパスにありました。
C:\Program Files\Reference Assemblies\Microsoft\Tablet PC\v1.7

winform_01_02

参照すると、InkEditとInkPictureが選択された状態で一覧に追加されます。
ダイアログの「OK」を選択し、ツールボックスへのアイテム追加を完了すると、ツールボックス上にInkEditとInkPictureが表示されます。

4. InkEditとInkPictureの配置
ウインドウ上にInkEditとInkPictureを設置します。
InkPictureは、背景がウインドウの背景と同じ色でわかりにくいので、ボーダーと背景色を設定しています。

winform_01_03

以上で、InkEditとInkPictureの設置が終わりました。
実際にアプリケーションを実行してみましょう。

InkEditはコントロール上に文字を書くと、テキストボックス上に文字が表示されます。

winform_01_04

winform_01_05

InkPictureは、自由に線を書くことができます。

winform_01_06

2つのコントロールは、筆圧に対応しています。
筆圧に対応したワコムのペンタブレットを使用すれば、筆圧によって線の太さが変わります。

5. モード切り替えのボタン追加
次に、InkPictureのモードを紹介します。
InkPictureはモードを切り替えることで、線を削除や選択を行うことができます。

Ink 初期はこのモードに設定されています。
線の描画を行います。
Delete ペンが選択した線を削除します。
Select ペンが選択した線を拡大縮小・移動することができます。

ウインドウ上に以下のようにボタンを配置し、クリックイベントを追加します。
クリックイベント内では、InkPictureのEditingModeを設定します。

winform_01_07

// Inkボタンのクリック
private void inkButton_Click(object sender, EventArgs e)
{
    inkPicture1.EditingMode = Microsoft.Ink.InkOverlayEditingMode.Ink;
}

// Deleteボタンのクリック
private void deleteButton_Click(object sender, EventArgs e)
{
    inkPicture1.EditingMode = Microsoft.Ink.InkOverlayEditingMode.Delete;
}

// Selectボタンのクリック
private void selectButton_Click(object sender, EventArgs e)
{
    inkPicture1.EditingMode = Microsoft.Ink.InkOverlayEditingMode.Select;
}

実際にアプリケーションを実行してみると、Deleteでは線の削除ができ、Selectでは選択した線の拡縮や移動ができるようになっているかと思います。
サンプルソースはこちらにアップしてありますので、興味のある方は実際に試して頂ければと思います。

次回は、InkEditとInkPictureのデータ保存について紹介します。

Top