在 Win2D 中，如何绘制具有笔划粗细的矩形？

Question

我知道，如何使用 CanvasDrawingSession 绘制具有笔触粗细的矩形。但问题是，笔触粗细会在矩形内外增长。我需要笔触粗细必须只在矩形内增长。我不知道如何做到这一点！！ 我试过的是什么？

我的 xaml 代码：

<Canvas x:Name="MyCanvas"> </Canvas>

我的 c# 代码：

     private void Page_Loaded(object sender, RoutedEventArgs e)
    {
        CanvasVirtualControl canvasVirtualControl = new CanvasVirtualControl();
        canvasVirtualControl.Width = 1486;
        canvasVirtualControl.Height = 610;
        MyCanvas.Children.Add(canvasVirtualControl);
        Canvas.SetLeft(canvasVirtualControl, 0);
        Canvas.SetTop(canvasVirtualControl, 100);
        canvasVirtualControl.RegionsInvalidated += CanvasVirtualControl_RegionsInvalidated;
    }

    private void CanvasVirtualControl_RegionsInvalidated(CanvasVirtualControl sender, CanvasRegionsInvalidatedEventArgs args)
    {
        CanvasDrawingSession drawingSession;
        Rect rect = new Rect(args.InvalidatedRegions[0].Left, args.InvalidatedRegions[0].Top, args.InvalidatedRegions[0].Width, args.InvalidatedRegions[0].Height);

        using (drawingSession = sender.CreateDrawingSession(rect))
        {
            drawingSession.DrawRectangle(new Rect(0, 0, 200, 200), Windows.UI.Color.FromArgb(255, 255, 0, 0), 40);
        }
    }

为什么我的矩形画成这样？我认为这是因为矩形内部和外部的笔触厚度增加。如何解决仅在矩形内部增加笔触厚度的绘制矩形？

更新问题：

在使 CanvasVirtualControl 的整个区域无效时，strokethickness 在矩形内外增长。如果我，使 CanvasVirtualControl 的特定矩形区域无效，strokeThickness 仅在内部增长。

我的 Xaml 代码：

<Canvas x:Name="MyCanvas">
    <Button Content="InvalidateWholeRegion" Height="100" Canvas.Left="0" Canvas.Top="0" Click="InvalidateWholeRegion"/>
    <Button Content="InvalidateParticularRegion" Height="100" Canvas.Left="300" Canvas.Top="0" Click="InvalidateParticularRegion"/>
</Canvas>

我的 c# 代码：

    CanvasVirtualControl canvasVirtualControl;
    private void Page_Loaded(object sender, RoutedEventArgs e)
    {
        canvasVirtualControl = new CanvasVirtualControl();
        canvasVirtualControl.Width = 1486;
        canvasVirtualControl.Height = 610;
        MyCanvas.Children.Add(canvasVirtualControl);
        Canvas.SetLeft(canvasVirtualControl, 0);
        Canvas.SetTop(canvasVirtualControl, 100);
        canvasVirtualControl.RegionsInvalidated += CanvasVirtualControl_RegionsInvalidated;
    }

    private void CanvasVirtualControl_RegionsInvalidated(CanvasVirtualControl sender, CanvasRegionsInvalidatedEventArgs args)
    {
        CanvasDrawingSession drawingSession;
        Rect rect = new Rect(args.InvalidatedRegions[0].Left, args.InvalidatedRegions[0].Top, args.InvalidatedRegions[0].Width, args.InvalidatedRegions[0].Height);
        using (drawingSession = sender.CreateDrawingSession(rect))
        {
            drawingSession.DrawRectangle(new Rect(rect.X, rect.Y, 100, 100), Windows.UI.Color.FromArgb(255, 255, 0, 0), 40);
        }
    }

    private void InvalidateParticularRegion(object sender, RoutedEventArgs e)
    {
        canvasVirtualControl.Invalidate(new Rect(200, 200, 100, 100));
    }
    private void InvalidateWholeRegion(object sender, RoutedEventArgs e)
    {
        canvasVirtualControl.Invalidate(new Rect(0, 0, 1486, 610));
    }

如何在无效特定区域时画笔画厚度也在外面增长？

Answer 1

但问题是，笔画粗细在矩形内外增长。我需要笔触粗细必须只在矩形内增长。

DrawRectangle 方法的绘制路径是笔划的中心，这是设计使然。当您将Rect 设置为 0, 0, 200, 200 时，捆绑包将剪裁左上角的一半。所以它会像上面一样画一个矩形。

如果我们要绘制完整的矩形，我们需要确保起点是合理的值。所以我们需要修改Rect为20,20,200,200。

private void CanvasVirtualControl_RegionsInvalidated(CanvasVirtualControl sender, CanvasRegionsInvalidatedEventArgs args)
{
    CanvasDrawingSession drawingSession;
    Rect rect = new Rect(args.InvalidatedRegions[0].Left, args.InvalidatedRegions[0].Top, args.InvalidatedRegions[0].Width, args.InvalidatedRegions[0].Height);

    using (drawingSession = sender.CreateDrawingSession(rect))
    {
        var dashedStroke = new CanvasStrokeStyle()
        {
            LineJoin = CanvasLineJoin.Round
        };
        drawingSession.DrawRectangle(new Rect(20, 20, 200, 200), Windows.UI.Color.FromArgb(255, 255, 0, 0),40,dashedStroke);
    }
}