Question

我有一个Viewbox：

<Viewbox x:Key="SampleViewbox" >
  <Grid>
    <Ellipse Stroke="#e2e2e0" StrokeThickness="6" Fill="#d5273e" Width="128" Height="128"/>
  </Grid>
</Viewbox>

然后我将其包含在样式中：

<Style x:Key="SampleStyle" TargetType="{x:Type Button}">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type Button}">
                <Border Background="Transparent" >
                    <ContentPresenter Content="{StaticResource SampleViewbox}"/>
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

现在我使用 SampleStyle

创建了许多按钮

<Grid>   
    <StackPanel>
       <Button Style="{StaticResource SampleStyle}" Height="50" Width="50"></Button>
       <Button Style="{StaticResource SampleStyle}" Height="80" Width="80"></Button>
       <Button Style="{StaticResource SampleStyle}" Height="20" Width="20"></Button>  
    </StackPanel>
</Grid>

然而，只有一个按钮具有Ellipse（视图框）

如何让所有按钮都显示/显示椭圆？

Answer 1

Viewbox是FrameworkElement，不能属于多个父级。按钮每次请求资源{StaticResource SampleViewbox}时都会获得相同的实例。

更改该行为添加x:Shared="False"属性

<Viewbox x:Key="SampleViewbox" x:Shared="False">

Answer 2

我认为一个好的方法是使用DataTemplate。所以你会有

<DataTemplate x:Key="SampleViewbox">
    <Viewbox>
        <Grid>
            <Ellipse
                    Width="128"
                    Height="128"
                    Fill="#d5273e"
                    Stroke="#e2e2e0"
                    StrokeThickness="6" />
        </Grid>
    </Viewbox>
</DataTemplate>

对于风格

<Style x:Key="SampleStyle" TargetType="{x:Type Button}">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type Button}">
                <Border Background="Transparent">
                    <ContentPresenter ContentTemplate="{StaticResource SampleViewbox}" />
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

Answer 3

按照@ASh的建议将ViewBox的{{3}}属性设置为false确实有效，但为什么不在ViewBox中添加ControlTemplate <Style x:Key="SampleStyle" TargetType="{x:Type Button}"> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="{x:Type Button}"> <Border Background="Transparent" > <Viewbox> <Grid> <Ellipse Stroke="#e2e2e0" StrokeThickness="6" Fill="#d5273e" Width="128" Height="128"/> </Grid> </Viewbox> </Border> </ControlTemplate> </Setter.Value> </Setter> </Style>喜欢这样吗？

AutoForm.getValidationContext('form-id').resetValidation();

模板是模板，控件实例是实例。

按钮样式的内容仅出现在一个Button实例中

3 个答案: