3

I'd like to be able to draw shapes onto an InkCanvas. So far I have the following XAML:-

<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
    <Canvas x:Name="selectionCanvas" />
    <InkCanvas x:Name="inker" />
</Grid>

In the page constructor I have the following:-

inker.InkPresenter.UnprocessedInput.PointerPressed += StartLine;
inker.InkPresenter.UnprocessedInput.PointerMoved += ContinueLine;
inker.InkPresenter.UnprocessedInput.PointerReleased += CompleteLine;
inker.InkPresenter.InputProcessingConfiguration.RightDragAction = InkInputRightDragAction.LeaveUnprocessed;

And the three events are as follows:-

private void StartLine(InkUnprocessedInput sender, PointerEventArgs args)
{
    line = new Line();
    line.X1 = args.CurrentPoint.RawPosition.X;
    line.Y1 = args.CurrentPoint.RawPosition.Y;
    line.X2 = args.CurrentPoint.RawPosition.X;
    line.Y2 = args.CurrentPoint.RawPosition.Y;

    line.Stroke = new SolidColorBrush(Colors.Purple);
    line.StrokeThickness = 4;
    selectionCanvas.Children.Add(line);
}

private void ContinueLine(InkUnprocessedInput sender, PointerEventArgs args)
{
    line.X2 = args.CurrentPoint.RawPosition.X;
    line.Y2 = args.CurrentPoint.RawPosition.Y;

}

private void CompleteLine(InkUnprocessedInput sender, PointerEventArgs args)
{

}

Is there anyway I can draw the line currently drawn on the selectionCanvas onto my InkCanvas?

Thanks,

Geoff

warntme
  • 59
  • 6
  • Do you want draw shapes on `Canvas` convert to `InkCanvas` or draw shapes on `InkCanvas` convert to `Canvas`? – Jayden Jun 05 '17 at 02:31
  • Hi Jayden, thanks for looking. Ultimately I want to be able to draw shapes on the InkCanvas in order to save the shapes along with any other ink strokes. – warntme Jun 05 '17 at 12:15
  • If you want to save the ink strokes, it seems you do not need to use `Canvas`? Do you want to copy ink strokes in the `InkCanvas`? If so, please refer the [Scenario2 of SimpleInk](https://github.com/Microsoft/Windows-universal-samples/tree/f4e92d42dd103a7a2175ba750a89084c1c235d9a/Samples/SimpleInk). – Jayden Jun 06 '17 at 09:48
  • No, I want to do something similar to adding a shape in office, but then render that shape to the InkCanvas in order to save. For example the code above draws a straight line on the canvas between the point the stroke starts and where it ends. Is there a way of persisting this line to the InkCanvas? Do I need to look at another method? Or is it just not possible? – warntme Jun 08 '17 at 14:01
  • It seems we can not add the `Line` to the `InkCanvas`. We can add `InkStroke` to the `InkCanvas` by `InkCanvas.InkPresenter.StrokeContainer.AddStroke` method. You can refer the [Complex inking sample](https://github.com/Microsoft/Windows-universal-samples/tree/master/Samples/ComplexInk) that can insert shape. – Jayden Jun 14 '17 at 10:01

1 Answers1

1

Thanks Jayden,

That pointed me in the right direction. For completeness here is the code from my solution:-

private void CompleteLine(InkUnprocessedInput sender, PointerEventArgs args)
{
    List<InkPoint> points = new List<InkPoint>();
        InkStrokeBuilder builder = new InkStrokeBuilder();


        InkPoint pointOne = new InkPoint(new Point(line.X1, line.Y1), 0.5f);
        points.Add(pointOne);
        InkPoint pointTwo = new InkPoint(new Point(line.X2, line.Y2), 0.5f);
        points.Add(pointTwo);

        InkStroke stroke = builder.CreateStrokeFromInkPoints(points, System.Numerics.Matrix3x2.Identity);
        InkDrawingAttributes ida = inker.InkPresenter.CopyDefaultDrawingAttributes();
        stroke.DrawingAttributes = ida;
        inker.InkPresenter.StrokeContainer.AddStroke(stroke);
        selectionCanvas.Children.Remove(line);
}
warntme
  • 59
  • 6