WPF 实现带框标签 实现里程计表效果

效果如下：

 

 

 稍微组合一下：

 

 

 

 

 

 

关键资源样式如下：

 

    <Window.Resources>
        <Style x:Key="LabelStyle1" TargetType="{x:Type Label}">
            <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
            <Setter Property="Background" Value="Transparent"/>
            <Setter Property="Padding" Value="0,3"/>
            <Setter Property="HorizontalContentAlignment" Value="Center"/>
            <Setter Property="VerticalContentAlignment" Value="Center"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type Label}">
                        <Grid ClipToBounds="True">
                            <Border BorderBrush="Gray" BorderThickness="1.8" Background="White" Padding="0" SnapsToDevicePixels="true">
                                <Border.Effect>
                                    <BlurEffect Radius="4"/>
                                </Border.Effect>
                            </Border>
                            <Border BorderBrush="White" BorderThickness="1" Padding="{TemplateBinding Padding}" SnapsToDevicePixels="true">
                                <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                            </Border>
                        </Grid>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsEnabled" Value="false">
                                <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </Window.Resources>