【ストアアプリ】画像の光学式ズーム

公開日: : 最終更新日:2015/10/20 Blog, Microsoft , ,

こんにちは。
スマートデバイスといえばタッチ操作、ということで
今日はWindowsストアアプリでのピンチイン・ピンチアウトによる
画像の拡大・縮小方法を実装してみます。

プロジェクトに画像を追加します。

mani1

mani2

ManipulationDeltaイベントを使います。
※このイベントはPresentationFramework.dllにも存在し、WPF上でも同様に実現が可能だと思います。

<Page
    x:Class="ManipulationSample.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:ManipulationSample"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">

    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
        <Image x:Name="hoge" Width="500" Height="500" Source="ms-appx:///Assets/nezumi.png"
               RenderTransformOrigin="0.5,0.5"
               ManipulationMode="Scale"
               ManipulationDelta="Image_ManipulationDelta"/>
    </Grid>
</Page>
private void Image_ManipulationDelta(object sender, ManipulationDeltaRoutedEventArgs e)
{
    hoge.Width *= e.Delta.Scale;
    hoge.Height *= e.Delta.Scale;
}

mani3 mani4
シミュレータ上では縮小/拡大モードを選択し、任意の位置をクリック&マウスホイールでピンチイン・ピンチアウト操作が行えます。

【参考】
https://msdn.microsoft.com/ja-jp/library/windows/apps/windows.ui.xaml.input.manipulationmodes.aspx

関連記事

【iPhoneアプリ】開発者登録手順(iOS Developer Program) その1

iPhoneアプリの作成からリリースまでの一通りの流れを体験したかったため、 簡単なiPhon

記事を読む

Visual Studio Team Services で 新規プロジェクトを作成するときの自分用初期設定メモ

新規プロジェクト作成 Version control -> Git Work item proc

記事を読む

no image

【WPF/XAML】Buttonのテキスト(Content)を自動改行/折り返しさせる

今更WPFを触りはじめました。 それまではほぼ.NETは2.0止まりというオワコン開発者です。

記事を読む

SIPSorceryにて、「型 ‘log4net.ILog’ が参照されていないアセンブリで定義されています。」

ある時、SIPクライアントの開発を行っていた。 SIPクライアントライブラリの選定にあたって S

記事を読む

Visual Studio Team Services ダッシュボードを自動更新する

Visual Studio Team Services のダッシュボードでプロジェクトや運用状況のサ

記事を読む

no image

【C#,WinForms】XMLデータをListViewに表示し、チェック項目のみXML保存させる

MSDNフォーラムの以下についてサンプルを組んだので掲載。 ListViewでチェックされた値

記事を読む

no image

UWPでOSバージョン番号の取得

Windows.System.Profile.AnalyticsInfo.VersionInfo.D

記事を読む

【WPF/XAML】セパレータを縦にする

<Window x:Class="VerticalSeparator&q

記事を読む

【iPhoneアプリ】リリース手順〜審査完了後〜

前回からの続き。 中身が無いアプリだったのでリジェクトされると思いきや 審査に通ってしま

記事を読む

no image

【VB.NET】DataGridViewで行の最大高を設定

DataGridViewにおける行の最大高さを設定するメモ 最大高さに満たない場合は内容を全て表示

記事を読む

Message

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

PAGE TOP ↑