この Tips は「ジェスチャを認識する」を踏まえた上でご覧ください。
InkCanvasでジェスチャを認識すると、Gesture イベントの e 引数の Stroke プロパティを使用して、ストロークが動いた最大幅、高さ、位置といった情報を取得することができます。
そこで、四角形を認識した場合は、「どのような高さや幅の四角形がどの位置に描かれたのか」といった情報を取得して Rectangle クラスを使用すれば、ユーザーが描いた四角形に近い、きれいな四角形を描画することができます。
同様にして、Ellipse クラスを利用することで、ユーザーが描いた円(楕円)に近い、きれいな円(楕円)を描画することが可能です。
下記は、ジェスチャで認識した情報をもとに図形を描画する例です。
XAMLの例
<InkCanvas Name="InkCanvas1" EditingMode="InkAndGesture" />
VBの例
'下記をインポート Imports System.Windows.Ink Imports System.Collections.ObjectModel Private Sub Window_Loaded(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs) Handles MyBase.Loaded 'InkAndGestureモードに設定する InkCanvas1.EditingMode = InkCanvasEditingMode.InkAndGesture End Sub ' ジェスチャを認識 Private Sub InkCanvas1_Gesture(ByVal sender As System.Object, ByVal e As System.Windows.Controls.InkCanvasGestureEventArgs) Handles InkCanvas1.Gesture Dim gestureResults As ReadOnlyCollection(Of GestureRecognitionResult) gestureResults = e.GetGestureRecognitionResults() ' ジェスチャを認識したか? If gestureResults(0).RecognitionConfidence = _ RecognitionConfidence.Strong Then '認識時の領域(外枠)サイズを取得 Dim strokeRect As Rect = e.Strokes.GetBounds Select Case gestureResults(0).ApplicationGesture Case ApplicationGesture.Circle '楕円(円)認識時 '認識した外枠サイズに合わせて円を作成する Dim ellipse As New Ellipse() ellipse.Width = strokeRect.Width ellipse.Height = strokeRect.Height ellipse.SetValue(Controls.InkCanvas.LeftProperty, strokeRect.X) ellipse.SetValue(Controls.InkCanvas.TopProperty, strokeRect.Y) ellipse.Stroke = Brushes.Black '作成した円をキャンバスに追加 InkCanvas1.Children.Add(ellipse) Case ApplicationGesture.Square '四角形認識時 '認識した外枠サイズに合わせて四角形を作成する Dim square As New Rectangle square.Width = strokeRect.Width square.Height = strokeRect.Height square.SetValue(Controls.InkCanvas.LeftProperty, strokeRect.X) square.SetValue(Controls.InkCanvas.TopProperty, strokeRect.Y) square.Stroke = Brushes.Black '作成した四角形をキャンバスに追加 InkCanvas1.Children.Add(square) End Select End If End Sub
C#の例
// 下記を追加 using System.Windows.Ink; using System.Collections.ObjectModel; private void Window_Loaded(object sender, RoutedEventArgs e) { // InkAndGestureモードに設定する inkCanvas1.EditingMode = InkCanvasEditingMode.InkAndGesture; } // ジェスチャを認識 private void inkCanvas1_Gesture(object sender, InkCanvasGestureEventArgs e) { ReadOnlyCollection<gesturerecognitionresult> gestureResults; gestureResults = e.GetGestureRecognitionResults(); if (gestureResults[0].RecognitionConfidence == RecognitionConfidence.Strong) { // 認識時の領域(外枠)サイズを取得 Rect strokeRect = e.Strokes.GetBounds(); switch (gestureResults[0].ApplicationGesture) { case ApplicationGesture.Circle: // 楕円(円)認識時 // 認識した外枠サイズに合わせて円を作成する Ellipse ellipse = new Ellipse(); ellipse.Width = strokeRect.Width; ellipse.Height = strokeRect.Height; ellipse.SetValue(System.Windows.Controls.InkCanvas.LeftProperty, strokeRect.X); ellipse.SetValue(System.Windows.Controls.InkCanvas.TopProperty, strokeRect.Y); ellipse.Stroke = Brushes.Black; // 作成した円をキャンバスに追加 inkCanvas1.Children.Add(ellipse); break; case ApplicationGesture.Square: // 四角形認識時 // 認識した外枠サイズに合わせて四角形を作成する Rectangle rectangle = new Rectangle(); rectangle.Width = strokeRect.Width; rectangle.Height = strokeRect.Height; rectangle.SetValue(System.Windows.Controls.InkCanvas.LeftProperty, strokeRect.X); rectangle.SetValue(System.Windows.Controls.InkCanvas.TopProperty, strokeRect.Y); rectangle.Stroke = Brushes.Black; // 作成した四角形をキャンバスに追加 inkCanvas1.Children.Add(rectangle); break; } } }