読者です 読者をやめる 読者になる 読者になる

割と普通なブログ

Microsoft Azure や ASP.NET、Java EE 系の話題を記載します

MultiTouch Behavior を利用して Silverlight でゼスチャー操作をしてみる

今回は SilverlightWPF に対して ゼスチャー操作を利用可能にする MultiTouch Behavior について紹介する。

MultiTouch Behavior のインストール

MultiTouch Behavior パッケージは NuGet で利用可能であり、パッケージマネージャコンソールで以下のコマンドを入力することで利用可能になる。

PM> Install-Package MultiTouchBehaviors 

といいつつ、まだまだバージョンは 0.6.9 な辺りでどうなんだろうかと思ったり(汗。インストールして確認したところ、どうやら Silverlight 4 向けにビルドされたらしく Silverlight 5 では利用できなかった。。。。
仕方がないので CodePlex - Windows Phone, Silverlight and WPF Multi-Touch Manipulations から最新版のソースコードを取得し、Silverlight 5 向けにビルドしなおすことで MultiTouch Behavior を Silverlight 5 でも利用可能となった。

MultiTouch Behavior を利用したアプリケーソン

特にこだわりがなければ、まずは一旦 Silverlight 4 アプリケーションを新規に作成し、NuGet を利用して MultiTouch Behavior をインストールする。更に、 XAML を以下のように書き換えて Silverlight アプリケーションを起動する。

<UserControl x:Class="SilverlightApplication1.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:behaviors="clr-namespace:MultiTouch.Behaviors.Silverlight4;assembly=MultiTouch.Behaviors.Silverlight4"
    xmlns:interactivity="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity"
    mc:Ignorable="d"
    d:DesignHeight="600" d:DesignWidth="800">

    <Grid x:Name="LayoutRoot" Background="White">
        <Canvas>
            <Image Source="Images/P1000555.JPG" Width="675" Canvas.Left="61" Canvas.Top="43" Height="506">
                <interactivity:Interaction.Behaviors>
                    <behaviors:MultiTouchBehavior IsRotateEnabled="True" IsScaleEnabled="True" 
                                              MinimumScale="100" MaximumScale="500"  />
                </interactivity:Interaction.Behaviors>
            </Image>
        </Canvas>
    </Grid>
</UserControl>

アプリケーション後、回転・拡大・移動のゼスチャ操作を行うことが可能となる。

また、ソースコード内を確認したところ、Touch系のイベントが存在しない PC向け Silverlight は、マウス系のイベントを美味く利用して対応しているようだ。興味のある方はソースコードを参照しても良いだろう。

参考サイト

利用可能な操作等々は以下の動画を参考にして頂ければよいだろう。