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

がりらぼ

WindowsRuntimeの応援ブログ

スタイラスペンからの入力を検知するには

WindowsRuntime

スタイラスペン

スタイラスペンに対応しているデバイスでは、スタイラスペンからの入力を検知するアプリを作る必要があります。

スタイラスペンには、バレットボタンと消しゴムボタンがあり、

バレットボタンは多くのアプリが要素を選択するときに用います。

また、消しゴムボタンは後ろについているボタンで要素を消すために使われます。

消しゴムボタンが横についているペンもあります。

 

 

BsU3-tICMAAVsfG

PointerPoint

スタイラスからの入力は、UIイベントによって処理します。

まずはペンからの入力を受け取るコントロールを作ります。

今回はCanvasコントロールで受け取ります。

<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
    <Canvas x:Name="canvas" Margin="288,188,288,194" Background="#FFB67575">
        
    </Canvas>
</Grid>

このとき、ペンからの入力を受け取るコントロールは、必ずBackgroundプロパティを指定してください。もし指定しなければ、入力イベントは発生しません。

 

そしてコンストラクタでイベント登録を行います。

今回はPointerPressedイベント、PointerReleasedイベント、PointerMovedイベントの3つを受け取ります。

this.canvas.PointerPressed+=Canvas_PointerPressed;
this.canvas.PointerReleased+=Canvas_PointerReleased;
this.canvas.PointerMoved+=Canvas_PointerMoved;

 

PointerPressedイベントでは

PointerRoutedEventArgsのGetCurrentPointメソッドをつかって、Canvasからの相対的な座標を取得します。

 

また、PointerPointのPointerDeviceプロパティ、PointerDeviceTypeを調べることで、ペンからの入力か、タッチからの入力か、マウスからの入力かを分けることができます。

 

さらに、PointerPointのProperties.IsBarrelButtonPressedプロパティを調べるとバレルボタンを押しているかどうかを判定することができます。

PointerPointのPoroperties.IsEraserプロパティを調べると消しゴムボタンを押しているかどうかを判定することができます。

private void Canvas_PointerPressed(object sender, PointerRoutedEventArgs e)
{
    PointerPoint point=e.GetCurrentPoint(canvas);

    switch (point.PointerDevice.PointerDeviceType)
    {
        case PointerDeviceType.Pen:
            if (point.Properties.IsBarrelButtonPressed)
            {
                Debug.WriteLine("スポイト");
            }else if (point.Properties.IsEraser)
            {
                Debug.WriteLine("消しゴム");
            }
            else
            {
                Debug.WriteLine("ノーマル");
            }
            break;
        case PointerDeviceType.Mouse:
            break;
        case PointerDeviceType.Touch:
            break;
    }
    
}

 

PointerMovedイベントでも同様に、入力の動きをDeviceTypeで分けることができます。

private void Canvas_PointerMoved(object sender, PointerRoutedEventArgs e)
{
    PointerPoint point = e.GetCurrentPoint(canvas);

    switch (point.PointerDevice.PointerDeviceType)
    {
        case PointerDeviceType.Pen:
           
            break;
        case PointerDeviceType.Mouse:
            break;
        case PointerDeviceType.Touch:
            break;
    }
}

 

PointerReleasedも同様にDeviceTypeで分けることができます。

PointerPoint point = e.GetCurrentPoint(canvas);

switch (point.PointerDevice.PointerDeviceType)
{
    case PointerDeviceType.Pen:

        break;
    case PointerDeviceType.Mouse:
        break;
    case PointerDeviceType.Touch:
        break;
}

 

スタイラスペンからの入力を検知するには | garicchi.com