single.php

C# WinUI3でタッチパッドで拡大・縮小する機能を実装する方法

C# WinUI 3アプリを作っていく途中で、調べたことを忘録的に投稿します。今回はWinUI3プロジェクトでタッチパッドを利用してコンテンツ上でコンテンツの拡大や縮小機能を追加する方法です。

[Manipulation]イベントは発生しない

結論から書くと、公式ドキュメント[タッチ操作開発者向けガイド]に記載があり、タッチパッドではアプリで複数の指による操作や速度データを必要とする操作をサポートする[Manipulation]関連の操作イベントが利用できません。

タッチパッドでは操作イベントは発生しません。 代わりに、タッチパッド入力に対してポインター イベントが発生します。

そのため、タッチパッドで2本の指を広げたり、縮める(Pinch/Zoom)操作で、コンテンツの拡大や縮小をする機能はWinUI3では実装が不可能でした。

2本の指をスライドさせるジェスチャーは他のイベントで処理することができます。詳しい内容は別記事をご覧ください。

[PointerWheelChanged]イベントで代用

タッチパッドでジェスチャー操作は利用できませんが、マウスなどの操作で利用できる[PointerWheelChanged]イベントで[Ctrl + 2本指でのスワイプ]操作を検出して代用ができます。。

例えば、タッチパッドでの操作を受け取るコンテンツに[PointerWheelChanged]イベントを追加します。

<Grid PointerWheelChanged="Grid_PointerWheelChanged">

</Grid>

イベントに次のコードを追加します。

private void Grid_PointerWheelChanged(object sender, PointerRoutedEventArgs e)
{
  CoreVirtualKeyStates ctrlKey = Microsoft.UI.Input.InputKeyboardSource.GetKeyStateForCurrentThread(Windows.System.VirtualKey.Control);

  if (ctrlKey.HasFlag(Windows.UI.Core.CoreVirtualKeyStates.Down) == true)
  {
    Microsoft.UI.Input.PointerPoint ptrPt = e.GetCurrentPoint((UIElement)sender);
    int mousewheelDelta = ptrPt.Properties.MouseWheelDelta;
    if (mousewheelDelta < 0)
    {
      //コンテンツの縮小
    }
    else
    {
      //コンテンツの拡大
    }
  }
}

実行すると、タッチパッド上で[Ctrl]キーを押しながら、2本指でスワイプした場合に拡大(または縮小)が可能になります。

まとめ

WinUI3プロジェクトでタッチパッドを利用してコンテンツ上でコンテンツの拡大や縮小機能を追加する方法について紹介しました。

タッチパッド上で2本指でスワイプした場合、マウスのスクロールイベントが発生します。

[PointerWheelChanged]イベントを利用して、タッチパッドの2本指のスライド(スワイプ)の操作で拡大や縮小の機能が実装できます。

WinUI 3 アプリで、タッチパッドを利用した2本指のスワイプ操作でコンテンツの拡大や縮小機能を追加したい人の参考になれば幸いです。

スポンサーリンク

最後までご覧いただき、ありがとうございます。

コメントを残す

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