C++/WinRT：如何合并GeometryGroup元素实现整体描边？

问题原因 #

GeometryGroup仅负责将多个几何图形叠加显示，不会合并它们的轮廓——描边会单独作用于每个子几何元素的边缘，因此你看到的是椭圆和矩形各自的描边，而非组合后整体形状的外围描边。

解决方案：合并几何图形的轮廓 #

要实现整体描边，需将多个几何图形合并为单一几何对象，可通过Geometry::Combine方法完成，该方法支持指定合并模式（如GeometryCombineMode::Union）生成完整的合并轮廓。

修改后的代码示例 #

Canvas canvas = Canvas();
myBorder.Child(canvas);

winrt::Microsoft::UI::Xaml::Shapes::Path path = winrt::Microsoft::UI::Xaml::Shapes::Path();
path.StrokeThickness(1);
path.Stroke(SolidColorBrush(Colors::Black()));
path.Fill(SolidColorBrush(Colors::Yellow()));
canvas.Children().Append(path);

float shapeHeight = 20.0f;
float shapeWidth = 100.0f;

// 创建第一个椭圆
EllipseGeometry ellipse1 = EllipseGeometry();
ellipse1.Center({ shapeHeight / 2.0f , shapeHeight / 2.0f });
ellipse1.RadiusX(shapeHeight / 2.0f);
ellipse1.RadiusY(shapeHeight / 2.0f);

// 创建第二个椭圆
EllipseGeometry ellipse2 = EllipseGeometry();
ellipse2.Center({ shapeWidth - (shapeHeight / 2.0f), shapeHeight / 2.0f });
ellipse2.RadiusX(shapeHeight / 2.0f);
ellipse2.RadiusY(shapeHeight / 2.0f);

// 创建中间矩形
RectangleGeometry rect = RectangleGeometry();
rect.Rect(Windows::Foundation::Rect(
    shapeHeight / 2.0f,          //X
    0.0f,                       //Y
    shapeWidth - shapeHeight ,   //width
    shapeHeight));               //height

// 分步合并几何图形：先合并矩形与第一个椭圆
Geometry combined1 = Geometry::Combine(rect, ellipse1, GeometryCombineMode::Union, nullptr);
// 再合并结果与第二个椭圆，得到完整的单一几何图形
Geometry finalGeometry = Geometry::Combine(combined1, ellipse2, GeometryCombineMode::Union, nullptr);

// 将合并后的几何图形赋值给Path
path.Data(finalGeometry);

关键说明 #

• GeometryCombineMode::Union：取多个几何图形的区域并集，生成组合后的整体轮廓。
• Geometry::Combine一次只能合并两个几何对象，因此需要分步完成多图形的合并。
• 合并后的单一几何对象会将描边应用到整体外围边缘，而非每个子元素的独立边缘。

内容的提问来源于stack exchange，提问作者Waterman