WPF中多个ContentPresenter复用同一内容仅最后一个显示的问题

问题场景 #

以下是无法正常运行的极简示例代码：

<StackPanel>
    <StackPanel.Resources>
        <Grid x:Key="MyYellowEllipse">
            <Ellipse Width="50" Height="50" Fill="Yellow" />
        </Grid>
        <Grid x:Key="MyBlueEllipse">
            <Ellipse Width="50" Height="50" Fill="Blue" />
        </Grid>
    </StackPanel.Resources>
    <ContentPresenter Content="{StaticResource MyYellowEllipse}" />
    <ContentPresenter Content="{StaticResource MyBlueEllipse}" />
    <ContentPresenter Content="{StaticResource MyYellowEllipse}" />
    <ContentPresenter Content="{StaticResource MyBlueEllipse}" />
    <ContentPresenter Content="{StaticResource MyYellowEllipse}" />
    <ContentPresenter Content="{StaticResource MyBlueEllipse}" />
</StackPanel>

示例运行后，仅最后两个ContentPresenter显示黄色和蓝色椭圆，其余位置均为空。预期是在多个ContentPresenter中复用同一资源内容，但实际未达成效果。

背景补充：我在资源字典中用Grid包裹Path和Polygon制作了一批自定义图形，希望在应用多处复用，但仅在最后一处显示，原本以为ContentPresenter可以实现该功能。

临时解决方案 #

@emoacht在评论中指出，在Grid资源定义中添加x:Shared="False"可解决问题，目前已采用该方案：

<Grid x:Key="MyYellowEllipse" x:Shared="False">
    <Ellipse Width="50" Height="50" Fill="Yellow" />
</Grid>

核心疑问解答 #

A）为何需要添加x:Shared="False"？ #

WPF资源默认是**共享（x:Shared="True"）**状态，即同一个StaticResource只会创建一个实例。而WPF的UI元素有一个核心规则：一个UI实例只能拥有一个父容器。

当你把同一个Grid实例依次赋值给多个ContentPresenter的Content属性时，每次赋值都会将这个实例从之前的ContentPresenter中移除，最终这个实例只会绑定到最后一个ContentPresenter上，所以前面的ContentPresenter都会因为没有内容而显示为空。

添加x:Shared="False"后，每次引用该资源时都会创建一个全新的Grid（及内部元素）实例，每个ContentPresenter都能拿到独立的UI实例，自然就能正常显示内容了。

B）复用包含多个Polygon的Grid的更优方案是什么？ #

推荐使用以下两种更符合WPF设计思想的方案：

1. 使用DataTemplate

将Grid和内部的图形元素定义在DataTemplate中，ContentPresenter通过ContentTemplate引用模板。每次使用模板时，WPF会自动创建新的UI实例，无需手动控制实例创建：

<StackPanel>
    <StackPanel.Resources>
        <DataTemplate x:Key="YellowEllipseTemplate">
            <Grid>
                <Ellipse Width="50" Height="50" Fill="Yellow" />
            </Grid>
        </DataTemplate>
        <DataTemplate x:Key="BlueEllipseTemplate">
            <Grid>
                <Ellipse Width="50" Height="50" Fill="Blue" />
            </Grid>
        </DataTemplate>
    </StackPanel.Resources>
    <ContentPresenter ContentTemplate="{StaticResource YellowEllipseTemplate}" />
    <ContentPresenter ContentTemplate="{StaticResource BlueEllipseTemplate}" />
    <ContentPresenter ContentTemplate="{StaticResource YellowEllipseTemplate}" />
    <ContentPresenter ContentTemplate="{StaticResource BlueEllipseTemplate}" />
    <ContentPresenter ContentTemplate="{StaticResource YellowEllipseTemplate}" />
    <ContentPresenter ContentTemplate="{StaticResource BlueEllipseTemplate}" />
</StackPanel>

2. 封装为自定义UserControl

如果这些图形需要复用的同时，还需要支持自定义属性（比如动态修改颜色、大小）或事件，建议封装成UserControl。这样不仅能复用UI结构，还能提升组件的可维护性和扩展性：

• 创建一个CustomShapeControl类（继承UserControl），在XAML中定义Grid和内部的Polygon/Path结构；
• 添加依赖属性（如ShapeFill、ShapeSize等）来控制图形的外观；
• 在应用中直接引用该UserControl即可：

<StackPanel>
    <local:CustomShapeControl ShapeFill="Yellow" ShapeSize="50" />
    <local:CustomShapeControl ShapeFill="Blue" ShapeSize="50" />
    <!-- 重复引用 -->
</StackPanel>

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