WPF InkCanvas - Some Strokes Not Collected

Question

I have a WPF application in which there is a signature page using an ink canvas control. I have an issue where very randomly, some strokes fail to collect within the stroke collection and disappear. I know that the term "random" in software is taboo - but trust me its random; no multi-threading taking place.

This issue occurs using a mouse and also touch input.

Gif of InkCanvas

I don't know if source code would be helpful at this point, but I will place it below regardless

SignatureForm.cs

    public partial class SignatureForm : UserControl
        {
            public event EventHandler SubmitButtonClick;

            private byte[] _signatureBytes;
            public byte[] SignatureBytes
            {
                get
                {
                     _signatureBytes = SignatureHelper.GetStrokeBytes(SignatureCanvas.Strokes, SignatureCanvas);

                    return _signatureBytes;
                }
                private set => _signatureBytes = value;
            }

            private Bitmap _signatureImage;

            public Bitmap SignatureImage
            {
                get
                {
                    _signatureImage = SignatureHelper.GetSignatureImage(SignatureCanvas);
                    return _signatureImage;
                }
                private set => _signatureImage = value;
            }

            public SignatureForm()
            {
                InitializeComponent();
                ClearButton.Visibility = Visibility.Hidden;
                PlaceholderText.Visibility = Visibility.Visible;
                AcceptButton.Visibility = Visibility.Hidden;
            }

            private void SubmitButton_TouchUp(object sender, TouchEventArgs e)
            {
                if (TouchIndicator.IsTouchEnabled)
                    SubmitButtonClick?.Invoke(sender, e);
            }

            private void SubmitButton_MouseUp(object sender, MouseButtonEventArgs e)
            {
                if (!TouchIndicator.IsTouchEnabled)
                    SubmitButtonClick?.Invoke(sender, e);
            }

            private void ClearButton_OnMouseUp(object sender, MouseButtonEventArgs e)
            {
                Clear();
            }

            private void ClearButton_OnTouchUp(object sender, TouchEventArgs e)
            {
                Clear();
            }

            private void Clear()
            {
                SignatureCanvas.Strokes.Clear();
                SubmitHide();
            }

            private void SignatureCanvas_OnStrokeCollected(object sender, InkCanvasStrokeCollectedEventArgs e)
            {
                SubmitReveal();
            }

            private void SignatureCanvas_OnTouchDown(object sender, TouchEventArgs e)
            {
                SubmitReveal();
            }

            private void SubmitReveal()
            {
                ClearButton.Visibility = Visibility.Visible;
                PlaceholderText.Visibility = Visibility.Hidden;
                AcceptButton.Visibility = Visibility.Visible;
            }

            private void SubmitHide()
            {
                ClearButton.Visibility = Visibility.Hidden;
                PlaceholderText.Visibility = Visibility.Visible;
                AcceptButton.Visibility = Visibility.Hidden;
            }

            private void SignatureCanvas_OnTouchUp(object sender, TouchEventArgs e)
            {
                if (SignatureCanvas.Strokes.Count == 0) SubmitHide();
            }
        }

SignatureForm.cs.xaml

        <Grid x:Name="SignatureGrid">
            <Grid.RowDefinitions>
                <RowDefinition Height=".75*" />
                <RowDefinition Height=".25*" />
            </Grid.RowDefinitions>
            <Border Grid.Row="0" BorderThickness="2" BorderBrush="{DynamicResource DarkBlue}">
                <Grid>
                    <TextBlock x:Name="PlaceholderText" Style="{StaticResource SignHereText}" Text="Sign here with your finger"/>
                    <InkCanvas x:Name="SignatureCanvas" Style="{StaticResource SignatureCanvas}" StrokeCollected="SignatureCanvas_OnStrokeCollected" TouchDown="SignatureCanvas_OnTouchDown" TouchUp="SignatureCanvas_OnTouchUp" />
                </Grid>
            </Border>
            <Border Grid.Row="0" x:Name="ClearButton" Style="{StaticResource ClearSignatureButton}"
                    MouseUp="ClearButton_OnMouseUp" TouchUp="ClearButton_OnTouchUp">
                <TextBlock x:Name="ButtonText" Text="CLEAR" Style="{StaticResource ClearSignatureText}" />
            </Border>
            <Border Grid.Row="1" BorderThickness="0" BorderBrush="{DynamicResource Teal}" Margin="0 0 0 0"
                    MouseUp="SubmitButton_MouseUp" TouchUp="SubmitButton_TouchUp">
                <TextBlock x:Name="AcceptButton" Style="{DynamicResource SubmitText}">Tap here to submit</TextBlock>
            </Border>
        </Grid>

A. Dixon A. Dixon · Accepted Answer · 2018-10-10T16:43:22

So I discovered the issue, there was a property EditingMode that was set to "InkAndGesture", after removing the property, the InkCanvas works smoothly and collects all strokes.

        <Style x:Key="SignatureCanvas" TargetType="InkCanvas">
            <Setter Property="Background" Value="{DynamicResource Transparent}" />
            <!--<Setter Property="EditingMode" Value="InkAndGesture"/>-->
            <Setter Property="DefaultDrawingAttributes">
                <Setter.Value>
                    <DrawingAttributes Width="10" Height="10"/>
                </Setter.Value>
            </Setter>
        </Style>

WPF InkCanvas - Some Strokes Not Collected

1 Answers