FillPath 忽略 MAUI 应用程序中看似闭合路径中的贝塞尔曲线

Question

我正在尝试绘制一个条形，其顶部部分围绕一个居中的按钮。我已经成功构建了一个 PathF 对象，它由直线和贝塞尔曲线组成，当我使用 DrawPath 方法时，它确实按照我的意图绘制了条形图。

现在，当我尝试填充它（这是最终目标）时，路径会被忽略，因为它没有关闭。请参阅以下屏幕截图：

绘制路径：

填充路径：

在过去的一个小时里，我试图以不同的方式调整我的代码，但无法让它工作，我肯定是误解了填充/关闭路径的方式？

这是条形图的 IDrawable 对象的 Draw 方法：

        public void Draw(ICanvas canvas, RectF dirtyRect)
        {
            float buttonSize = 80;
            float width = dirtyRect.Width;
            float height = dirtyRect.Height;
            canvas.StrokeColor = Colors.Red;
            canvas.FillColor = Colors.Blue;
            canvas.StrokeSize = 1;

            float y1 = height / 2; // bar top 
            float tX = width / 2; // x translation applied to all bezier curve points
            float tY = height / 2; // y translation applied to all bezier curve points
            float r = buttonSize * 1.5f / 2; // radius
            float c = 0.5522847498307933984022516322796f;

            float segmentWidth = (width - (r * 2)) / 2;

            PathF path = new PathF(0, y1);

            path.LineTo(segmentWidth, y1);            //  _____
            path.MoveTo(width - segmentWidth, y1);    //          x
            path.LineTo(width, y1);                   //           _____
            path.LineTo(width, height);               //               |
            path.LineTo(0, height);                   //  --------------
            path.LineTo(0, y1);                       // |


            path.MoveTo(r + tX, 0 + tY);
            path.CurveTo(r + tX, c * r + tY,
                c * r + tX, r + tY,
                0 + tX, r + tY);

            path.MoveTo(0 + tX, r + tY);
            path.CurveTo(-c * r + tX, r + tY,
                -r + tX, c * r + tY,
                -r + tX, 0 + tY);

            canvas.FillPath(path);
        }

<Grid ColumnDefinitions="*, Auto, *" RowDefinitions="*, 15*, 200">
    <Button Grid.Row="0" Text="Draw" Clicked="Button_Clicked"/>
    <Grid Grid.Row="2" Grid.ColumnSpan="3" Padding="10, 10">
        <GraphicsView x:Name="bottomBar" Grid.ColumnSpan="3"/>
    </Grid>
</Grid>

非常感谢您对此的任何意见

Answer 1

正如 Mike 所评论的，由于中间有 MoveTo 指令，路径并未关闭，以下代码可以解决这个问题：

            float buttonSize = 80;
            float width = dirtyRect.Width;
            float height = dirtyRect.Height;
            canvas.StrokeColor = Colors.Green;
            canvas.FillColor = Colors.Blue;
            canvas.StrokeSize = 1;

            float tX = width / 2; // x translation applied to all bezier curve points
            float r = buttonSize * 1.5f / 2; // radius
            float c = 0.5522847498307933984022516322796f;

            PathF path = new PathF(r + tX, 0);

            path.CurveTo(r + tX, c * r,
                c * r + tX, r,
                0 + tX, r);

            path.CurveTo(-c * r + tX, r,
                -r + tX, c * r,
                -r + tX, 0);

            path.LineTo(0, 0);
            path.LineTo(0, height);
            path.LineTo(width, height);
            path.LineTo(width, 0);
            path.LineTo(width - ((width - (r * 2)) / 2), 0);
            canvas.FillPath(path);