画面に並んだ写真が指の動きに反応して回転するLeap Motionプログラムを作る

リスト4 MainWindow_Loadedメソッド

  Private Sub MainWindow_Loaded(sender As Object, e As RoutedEventArgs) Handles Me.Loaded
    xmldoc = XElement.Load("forest.xml") ' XMLファイルの読み込み

    For Each result In From c In xmldoc.Descendants("画像名") Select c
' 新しいImageのインスタンスmyImageを作成してSourceプロパティにImageフォルダ
' 内の画像を指定する
      myImage = New Image
      With myImage
        .Width = 320
        .Height = 240
        .Stretch = Stretch.Uniform
        .Source = New BitmapImage(New Uri("Images/" & result.Value, UriKind.Relative))
      End With
' ListBoxに表示された画像の上にマウスカーソルが乗ると、
' 画像がY軸を中心に回転する処理
      AddHandler myImage.MouseEnter, Sub(mySender As Object, myArgs As MouseEventArgs)
        Dim _myImage = DirectCast(mySender, Image)
        Dim myStoryboard As New Storyboard
        Dim myScale As New ScaleTransform(1.0, 1.0)
        _myImage.RenderTransformOrigin = New Point(0.5, 0.5)
        _myImage.RenderTransform = myScale
' 以下アニメーション処理
        Dim myDoubleAnimation As New DoubleAnimation
          myDoubleAnimation.Duration = TimeSpan.FromMilliseconds(300)
          myDoubleAnimation.From = 1
          myDoubleAnimation.To = -1
          myStoryboard.Children.Add(myDoubleAnimation)
          Storyboard.SetTargetProperty(myDoubleAnimation, New PropertyPath("RenderTransform.ScaleX"))
          Storyboard.SetTarget(myDoubleAnimation, _myImage)
          Dim myDoubleAnimation2 As New DoubleAnimation
          myDoubleAnimation2.Duration = TimeSpan.FromMilliseconds(1000)
          myDoubleAnimation2.From = -1
          myDoubleAnimation2.To = 1
          myStoryboard.Children.Add(myDoubleAnimation2)
          Storyboard.SetTargetProperty(myDoubleAnimation2, New PropertyPath("RenderTransform.ScaleX"))
          Storyboard.SetTarget(myDoubleAnimation2, _myImage)
          
          myStoryboard.Begin()
            End Sub
      ListBox1.Items.Add(myImage)
    Next
  ・・・・以下4回目と同じコードのため省略・・・・
End Sub

Updateメソッドの処理

4回と同じにつき割愛します、4回を参照してください。

今回は、常にタッチした処理を維持し、ホバーやタッチの区別は行っていませんが、一応、ホバーとタッチのイメージを載せておきます、次の図3のようなイメージです。

Updateメソッドの処理(タッチ・ポイントが画像の上に乗った時の処理)

手前側が「ホバー状態（hovering）」、奥側が「タッチ状態（touching）」を表します。空間の範囲は前後「1」～「-1」となっています。

図3：Leap Motionのタッチ検出イメージ（Leap Motion SDKのAPIドキュメントから引用）（クリックで拡大）

今回は、常にタッチした処理を維持し、ホバーやタッチの区別は行っていません。タッチ・ポイントが画像の上に入ればY軸を中心に回転させています(リスト5)。

リスト5　（MainWindow.xaml.vb）

For Each Pointable As Pointable In leap.Frame.Pointables
      Dim normalizedPosition As Leap.Vector = interactionBox.NormalizePoint(Pointable.StabilizedTipPosition)
……コード略（4回と同じ）……
      touchIndicator.Color = Colors.Red
 
      x = touchPoint.X
      y = touchPoint.Y
      SetCursorPos(x, y) ' タッチ・ポイントマウスカーソルの位置を合わせる
      apimouse_event(MOUSEEVENTF_MOVE, 0, 0, 0, 0) ' Mouse Moverイベントを発生させる
    Next
  End Sub

※注意
サンプルをダウンロードして動かす場合は、「LeapCSharp.NET4.0.dll」や「LeapCSharp.dll」、「Leap.dll」を読者自身のフォルダ内にあるDLLファイルに指定し直さなければ動かない可能性があるので、動かない場合は再指定してください。