画面上の図形を5本の指で操作する基本的なLeap Motionプログラムを作る

2013年10月10日(木)
薬師寺 国安

2013年7月に発売されたLeap Motionは、PCなどの機器に直接に触れることなく、主に手を使ったジェスチャーで操作ができるモーションコントローラーです。マイクロソフト社のKinectと同様、自分でアプリを開発することもできるため、UIの新たな可能性をエンジニアの間でも注目のデバイスです。

今回は、そのLeap Motionのサンプルプログラミングを10回にわたって解説します。長丁場になりますが、読者の皆さんを飽きさせない、面白いサンプルプログラミングの開発方法を解説していきたいと思います。お付き合いのほどよろしくお願いいたします。

この連載は、Leap Motionを実際に持っている方が対象です。しかし、Leap Motionを持っていなくても、この連載で、Leap Motionを使うと、どのようなことができるのかの参考にはなると思います。

「一体Leap Motionってなに?」って思われる方は、Think ITで過去に掲載された、「79ドルで遊べる3Dモーションセンサーがやってきた!Leap Motion Controllerレビュー」をご覧になるとわかると思います。この連載に入る前に、ぜひ一読をおすすめします。

【Leap Motionを購入するには?】

Leap Motionを入手するには、主にLeap Motion社の直販など通販サイトを利用することになります。下記の購入サイトから12,165円で入手できます(2013年10月現在)。
> Buy the Leap Motion Controller

海外サイトからの購入に多少不安を感じる方もいらっしゃるかもしれませんが、価格は日本円で表示されますし、決して高い買い物ではないでしょう。他にも、Amazonなどから購入が可能です。この連載でLeap Motionに興味を持たれた方は、購入を考えてみてはいかがでしょうか。

原稿執筆時点(9月末)では、Leap MotionはWindows 7とWindows 8、Mac OS X10.7以降に対応しています。Windows 8.1には正式に対応していませんが、現時点で筆者が試したところ、Windows 8.1でも問題なく動作していますので、ご安心ください。

はじめに、このサンプルを作成した筆者の環境を紹介します。

筆者の環境

  • Windows 8.1 Enterprize(x64)
  • Visual Studio 2012 Ultimate(x86)
  • LeapDeveloperKit_release_win_1.0.8+7665

※注意:動画はWindows 8の環境で作成し、動かしたものです。Windows 8.1でも動作はしますが、一部動きが動画と異なる動きになりますので、ご了承ください。

Leap Motionを使う前に

実際にサンプルを作って動かす前に、「環境構築」と言うほどでもないですが、「Get started with your Leap Motion Controller.」のページにある、[Windows Download]から、「Leap_Motion_Installer_hotfix_public_win_x86_1.0.8+7999_ah815.exe」ファイルをダウンロードして、Leap Motionの実行環境をインストールしておく必要があります。インストールが完了すると、Leap Motionが接続可能になります。

次に、「Leap Motion Developer SDK」のページから「v.1.0.8.7665 for Windows」(図1参照)を任意のフォルダにダウンロードして、解凍しておいてください。この解説はWindowsをメインとするので、Windows版をダウンロードします。

Leap Motionはしきりにバージョンアップを繰り返していますので、上記のURLに入って時々Leap Motionのバージョンをチェックして、バージョンアップされている場合は、最新のファイルをダウンロードしてください。また、更新の連絡も来るので、最初のインストール以降は連絡が来た時に更新すれば良いでしょう。

この記事が掲載されるころには、また新しいバージョンになっている可能性もあります。その点はご了承ください。

図1:「v.1.0.8.7665 for Windows」ボタンをクリックしてダウンロードする(クリックで拡大)

今回は、5本の指をアップ・ダウンすることで、円のサイズを変化させるサンプルです。早速、開発手順を見ていきましょう。

まずWPFプロジェクトを作成しよう

今回のLeap MotionアプリはWPFで作成します。

WPFとはWindows Presentation Foundation の略で、魅力的な外観のユーザー・エクスペリエンスを持つWindowsクライアント・アプリケーションを作成するための次世代プレゼンテーション・システムです。
WPFを使用することにより、スタンドアロン・アプリケーションやブラウザーによってホストされるアプリケーションを広範囲にわたって作成できます。
詳細については下記ウィキペディアのページを参照してください。
> Windows Presentation Foundation

これには、Visual Studio 2012(以下、VS 2012)のIDEを起動して、メニューバーから[ファイル]−[新規作成]−[プロジェクト]と選択して、それにより表示される[新しいプロジェクト]ダイアログで「Visual Basic」のテンプレートから「WPF アプリケーション」を選択します(Leap Motionは、.NET Framework 3.5と4.0に対応しています。しかし、.NET Framework 4.5でも動作します)。
今回のアプリはすべて.NET Framework 4.5で作成しています。しかし、あくまでも対応しているのは、.NET Framework 3.5と4.0です。心配な方は、.NET Framework 4.0で作成すると安心でしょう)。[名前]欄には、ここでは「FingerRecognizeUpDown」と指定します。

参照の追加

プロジェクトが作成されたら、[ソリューション エクスプローラー]の上部にある[すべてのファイルを表示]アイコンをクリックして、[参照設定]を表示させます。その[参照設定]の右クリック・メニューで[参照の追加]を選択します。
「最近使用したファイル」内に、「LeapCSharp.NET4.0.dll」が見当たらない場合は、[参照]ボタンから、「<解凍したフォルダ>\LeapDeveloperKit\LeapSDK\lib」フォルダ内の「LeapCSharp.NET4.0.dll」ファイルを指定して[OK]ボタンをクリックします(図2)。

図2:[参照]ボタンをクリックして「LeapCSharp.NET4.0.dll」を指定する。筆者の環境では、何度も使用しているため、「最近使用したファイル」に追加されている(クリックで拡大)

プロジェクトのルートに「LeapCSharp.dll」と「Leap.dll」を追加する

[ソリューション エクスプローラー]内のプロジェクト項目の右クリック・メニューから[追加]−[既存の項目]を選択して(図3参照)、「<解凍したフォルダ>\LeapDeveloperKit\LeapSDK\lib\x86」フォルダ内の「LeapCSharp.dll」と「Leap.dll」の2つのファイルを追加します。

VS 2012のメニューバーから[ビルド]-[構成マネージャ]と選択して、[アクティブ ソリューション プラットホーム]が「Any CPU」または「x86」の場合は、x86フォルダ内のDLLファイル、「x64」ならx64フォルダ内のDLLファイルを選択する必要があります。これを間違わないよう注意してください。
筆者の環境では[構成マネージャ]が「Any CPU」になっているので、x86フォルダ内のファイルを指定しています。各自の[構成マネージャ]の値に対応して読み込むフォルダを指定してください。

図3:[ソリューション エクスプローラー]内のプロジェクト項目の右クリック・メニューから[追加]−[既存の項目]を選択(クリックで拡大)

[ソリューション エクスプローラー]内に図4のように「LeapCSharp.dll」と「Leap.dll」が追加されます。

図4:[ソリューション エクスプローラー]内に「LeapCSharp.dll」と「Leap.dll」が追加された(クリックで拡大)

プロパティを設定する

「LeapCSharp.dll」と「Leap.dll」のプロパティから、[出力ディレクトリーにコピー]を「常にコピー」するに変更しておきます。これは、2つのDLLファイル共にしておく必要があります(図5)。

図5:[ソリューション エクスプローラー]内に「LeapCSharp.dll」と「Leap.dll」が追加された(クリックで拡大)

今回のLeap Motionアプリについて

今回のアプリは、5本の指を空中でアップすることで円が拡大、ダウンすることで、円が縮小するアプリです(図6)。

図6:5本の指をアップ・ダウンすることで円が拡大縮小する。円をより大きく拡大するには、ある程度拡大した時点で、Leap Motionから手を離し、再度手をかざしてアップするとより大きく拡大する。縮小する場合も同じだ(クリックで拡大)

実際に動かした画面を動画で紹介します。

コールバック方式の採用

今回のサンプルは、「コールバック方式」を使用しています。ControllerクラスとListenerクラス(Leap名前空間)を利用した方式のことです。

これ以外に、Controllerクラス(Leap名前空間)だけを使用した「ポーリング方式」というのがあります。

詳細についてはBuild Insiderの「C#によるLeap Motion開発の全体像」を参照してください。

Leap Motion Controllerのフレームレートでフレームを取得する方法として、Listenerオブジェクトを使う方法があり、今回はListenerオブジェクトを使用しています。Controllerオブジェクトは、新しいフレームが使用できるときにListenerのonFrameコールバック関数を呼び出し、OnFrameハンドラでは、Frameオブジェクト自体を呼び出すControllerのFrameメソッドを呼び出すことができます。

今回は、以下の2つのコールバックメソッドを使用しています。詳細については、Build Insiderの「C#開発者から見たLeap Motion開発のファースト・インプレッション」を参照してください。

使用するコールバックメソッド

OnConnectは、コントローラーがLeap Motionセンサーと接続されたときに呼び出されます。

onFrameは、フレームのデータが更新されたときに呼び出されます。Leap Motionセンサーのデータはすべてここで処理されます。

  • 5本の指でオブジェクトを拡大・縮小させるプログラム

薬師寺国安事務所

薬師寺国安事務所代表。Visual Basic プログラミングと、マイクロソフト系の技術をテーマとした、書籍や記事の執筆を行う。
1950年生まれ。事務系のサラリーマンだった40歳から趣味でプログラミングを始め、1996年より独学でActiveXに取り組む。1997年に薬師寺聖とコラボレーション・ユニット PROJECT KySS を結成。2003年よりフリーになり、PROJECT KySS の活動に本格的に参加、.NETやRIAに関する書籍や記事を多数執筆する傍ら、受託案件のプログラミングも手掛ける。Windows Phoneアプリ開発を経て、現在はWindows ストア アプリを多数公開中

Microsoft MVP for Development Platforms - Client App Dev (Oct 2003-Sep 2012)。Microsoft MVP for Development Platforms - Windows Phone Development(Oct 2012-Sep 2013)。Microsoft MVP for Development Platforms - Client Development(Oct 2013-Sep 2014)。Microsoft MVP for Development Platforms-Windows Platform Development (Oct 2014-Sep 2015)。

連載バックナンバー

Think ITメルマガ会員登録受付中

Think ITでは、技術情報が詰まったメールマガジン「Think IT Weekly」の配信サービスを提供しています。メルマガ会員登録を済ませれば、メルマガだけでなく、さまざまな限定特典を入手できるようになります。

Think ITメルマガ会員のサービス内容を見る

他にもこの記事が読まれています