泥庭

2013年5月26日

マルチタッチで拡大縮小・回転・移動 その3

Filed under: .NET, ストアアプリ, Windows8 — タグ: , , — yone64 @ 8:44 PM

前回前々回の続き。

とりあえず、タッチポイントの中心で拡大縮小・回転できるようにはなったのですが、三角関数とか使いたくないですよね?CompositeTransformが、すべての変形を保持しているので補正が必要になるので、履歴を持つTransformと現在の変形を持つTransformに分ければもう少し話は簡単になります。

XAMLは、下記通り。MatrixTransformとCompositeTransformで変形を表すことで、中心が移動した時の補正を不要にします。

<Ellipse Height="75"  Width="278" Margin="449,306,0,0"  Fill="Red"
         HorizontalAlignment="Left" VerticalAlignment="Top"
         ManipulationMode="All" ManipulationDelta="Ellipse_ManipulationDelta">
    <Ellipse.RenderTransform>
        <TransformGroup>
            <MatrixTransform/>
            <CompositeTransform/>
        </TransformGroup>
    </Ellipse.RenderTransform>
</Ellipse>

コードビハインド側は、TransformGroupの変形をMatrixTransformに移し替えるとともに、CompositeTransformに新たなる変形を設定します。

private void Ellipse_ManipulationDelta(object sender, ManipulationDeltaRoutedEventArgs e)
{
    var group = ((UIElement)sender).RenderTransform as TransformGroup;

    var matrix = group.Children[0] as MatrixTransform;
    var composit = group.Children[1] as CompositeTransform;

    matrix.Matrix = group.Value;

    var center = matrix.TransformPoint(new Point(e.Position.X, e.Position.Y));
    composit.CenterX = center.X;
    composit.CenterY = center.Y;

    composit.ScaleX = e.Delta.Scale;
    composit.ScaleY = e.Delta.Scale;

    composit.Rotation = e.Delta.Rotation;

    composit.TranslateX = e.Delta.Translation.X;
    composit.TranslateY = e.Delta.Translation.Y;

}

これで、RoomMetroで発表した内容は全部です。あれから一か月もたってしまった。

広告

コメントする »

まだコメントはありません。

RSS feed for comments on this post. TrackBack URI

コメントを残す

以下に詳細を記入するか、アイコンをクリックしてログインしてください。

WordPress.com ロゴ

WordPress.com アカウントを使ってコメントしています。 ログアウト / 変更 )

Twitter 画像

Twitter アカウントを使ってコメントしています。 ログアウト / 変更 )

Facebook の写真

Facebook アカウントを使ってコメントしています。 ログアウト / 変更 )

Google+ フォト

Google+ アカウントを使ってコメントしています。 ログアウト / 変更 )

%s と連携中

WordPress.com で無料サイトやブログを作成.

%d人のブロガーが「いいね」をつけました。