【Windowsストアアプリ】ピンチ操作による拡大・縮小

Windows8.1のストアアプリでセマンティックズームではなく、Webブラウザのようにピンチ操作で拡大・縮小したいという要望があり、やっつけ気味ですが実装してみました。

 ピンチ操作に同期してScrollViewer内のGridのサイズを変更する事で内部のViewBoxを拡大・縮小表示します。

 ・・・なんですが、普通にやるとピンチもスワイプも効かない?

GridのサイズをScrollViewerより1ピクセルだけ大きくしてデフォルトでスクロールバーありの状態にする事でとりあえず回避しています。

WPFのScrollViewerとは少し勝手が違うんでよくわかりません。

本当はもっと良い方法があるんだろうな・・・。

 《XAML

<ScrollViewer VerticalScrollBarVisibility="Visible" HorizontalScrollBarVisibility="Visible" Width="1200" Height="600" ManipulationDelta="ManipulationDelta" ManipulationMode="All" MinZoomFactor="0.5" MaxZoomFactor="5">
<!-- なにやら動作しないのでScrollViewerよりちょっと大きく。。 -->
  <Grid Name="grd" Width="1201" Height="601">
    <Viewbox>
      <StackPanel>
        <TextBlock Text="あいうえお" VerticalAlignment="Center" Margin="5"/>
        <TextBlock Text="かきくけこ" VerticalAlignment="Center" Margin="5"/>
        <TextBlock Text="さしすせそ" VerticalAlignment="Center" Margin="5"/>
        <TextBlock Text="たちつてと" VerticalAlignment="Center" Margin="5"/>
        <TextBlock Text="なにぬねの" VerticalAlignment="Center" Margin="5"/>
      </StackPanel>
    </Viewbox>
  </Grid>
</ScrollViewer>

 《コードビハインド》

private void ManipulationDelta(object sender, ManipulationDeltaRoutedEventArgs e)
{
  // ピンチ操作時のスケールを元にサイズを再設定
  grd.Width *= e.Delta.Scale;
  grd.Height *= e.Delta.Scale;
}