DynAreaBlowing.xaml

<UserControl x:Class="FLY.Thick.Blowing.UI.UiModule.DynAreaBlowing"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             xmlns:local="clr-namespace:FLY.Thick.Blowing.UI.UiModule"
             xmlns:iservice="clr-namespace:FLY.Thick.Blowing.IService;assembly=FLY.Thick.Blowing"
             xmlns:misc="clr-namespace:Misc;assembly=MISC" xmlns:iconPacks="http://metro.mahapps.com/winfx/xaml/iconpacks"
             mc:Ignorable="d" 
             d:DesignWidth="250">
    <UserControl.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary Source="pack://application:,,,/FLY.ControlLibrary;component/Themes/Dictionary_MyStyle.xaml"/>
                <ResourceDictionary Source="pack://application:,,,/FLY.Thick.Base.UI;component/Converter/Dictionary_MyConv.xaml"/>
            </ResourceDictionary.MergedDictionaries>

            <local:DynAreaBlowingVm x:Key="viewModel" IsCW="False"/>
        </ResourceDictionary>
    </UserControl.Resources>

    <Button Click="Border_Blowing_Click" Style="{StaticResource Styles.Button.Empty}" d:DataContext="{StaticResource viewModel}">
        <StackPanel>
            <Border  Style="{StaticResource Styles.Module.Border}" >
                <StackPanel Margin="2">
                    <StackPanel Orientation="Horizontal" Margin="2">
                        <TextBlock Text="线速度" Style="{StaticResource Styles.Module.Text.ItemHeader}" />
                        <StackPanel Orientation="Horizontal" Margin="3,1" >
                            <TextBlock Style="{StaticResource Styles.Module.Text.ItemValue}" 
                                       Text="{Binding FilmVelocity, StringFormat={}{0:F1}}" />
                            <TextBlock Style="{StaticResource Styles.Module.Text.ItemValue.Unit}" Text="m/min" />
                        </StackPanel>
                    </StackPanel>
                </StackPanel>
            </Border>
            <Border Style="{StaticResource Styles.Module.Border}"  >
                <Grid Margin="2">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition/>
                        <ColumnDefinition Width="auto"/>
                        <ColumnDefinition Width="auto"/>
                    </Grid.ColumnDefinitions>
                    <Grid Margin="2">
                        <StackPanel Orientation="Horizontal" VerticalAlignment="Center" HorizontalAlignment="Center">
                            <TextBlock Style="{StaticResource Styles.Module.Text.ItemValue}" FontSize="43"
                                       Text="{Binding Angle, StringFormat={}{0:F0}}" />
                            <TextBlock Style="{StaticResource Styles.Module.Text.ItemValue.Unit}" FontSize="25" VerticalAlignment="Top"
                                       Text="°" />
                        </StackPanel>
                    </Grid>
                    <Grid Margin="-25,2,2,2" Grid.Column="1">
                        <iconPacks:PackIconMaterial 
                            Width="35" Height="42"  HorizontalAlignment="Right" VerticalAlignment="Top" Foreground="{StaticResource Brushes.Activity}" RenderTransformOrigin="0.5,0.583">
                            <iconPacks:PackIconMaterial.RenderTransform>
                                <TransformGroup>
                                    <ScaleTransform/>
                                    <SkewTransform/>
                                    <RotateTransform Angle="{Binding IconAngle}"/>
                                    <TranslateTransform/>
                                </TransformGroup>
                            </iconPacks:PackIconMaterial.RenderTransform>
                            <iconPacks:PackIconMaterial.Style>
                                <Style TargetType="iconPacks:PackIconMaterial">
                                    <Setter Property="Kind" Value="RotateLeft"/>
                                    <Style.Triggers>
                                        <DataTrigger Binding="{Binding IsCW}" Value="True">
                                            <Setter Property="Kind" Value="RotateRight"/>
                                        </DataTrigger>
                                    </Style.Triggers>
                                </Style>
                            </iconPacks:PackIconMaterial.Style>
                        </iconPacks:PackIconMaterial>
                        <TextBlock VerticalAlignment="Bottom" >
                            <TextBlock.Style>
                                <Style TargetType="TextBlock" BasedOn="{StaticResource Styles.Module.Text.ItemHeader}">
                                    <Setter Property="Text" Value="逆时针"/>
                                    <Style.Triggers>
                                        <DataTrigger Binding="{Binding IsCW}" Value="True">
                                            <Setter Property="Text" Value="顺时针"/>
                                        </DataTrigger>
                                    </Style.Triggers>
                                </Style>
                            </TextBlock.Style>
                        </TextBlock>
                    </Grid>
                    <StackPanel Margin="2" Grid.Column="2">
                        <StackPanel Orientation="Horizontal" Margin="3,1" Background="Black">
                            <TextBlock Style="{StaticResource Styles.Module.Text.ItemValue}" Foreground="White"
                                       Text="{Binding RenZiJiaPeriod, Converter={StaticResource timespanconv}}" />
                            <TextBlock Style="{StaticResource Styles.Module.Text.ItemValue.Unit}" Foreground="White"
                                       Text="min/R" />
                        </StackPanel>
                        <StackPanel Orientation="Horizontal" Margin="3,1" Background="#FFE8E8E8">
                            <TextBlock Style="{StaticResource Styles.Module.Text.ItemValue}" Foreground="Black"
                                       Text="{Binding PastTime, Converter={StaticResource timespanconv}}" />
                            <TextBlock Style="{StaticResource Styles.Module.Text.ItemValue.Unit}" Foreground="Black"
                                       Text="min" />
                        </StackPanel>
                    </StackPanel>

                </Grid>
            </Border>
        </StackPanel>
    </Button>
</UserControl>