DynAreaIO.xaml

<UserControl x:Class="FLY.Thick.Base.UI.UiModule.DynAreaIO"
             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.Base.UI.UiModule"
                          d:DesignWidth="250"
             mc:Ignorable="d" >
    <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>

            <Style TargetType="Rectangle" x:Key="IOStyle">
                <Setter Property="Width"  Value="9" />
                <Setter Property="Height"  Value="20" />
                <Setter Property="Margin"  Value="1" />
            </Style>
            <Style x:Key="IOTextStyle" TargetType="TextBlock">
                <Setter Property="Foreground"  Value="{StaticResource Color_theme_background}" />
                <Setter Property="HorizontalAlignment"  Value="Center" />
                <Setter Property="VerticalAlignment"  Value="Center" />
                <Setter Property="FontSize"  Value="9"/>
            </Style>
            <Style TargetType="TextBlock" x:Key="TextBlockStyle_ItemHeader">
                <Setter Property="FontWeight" Value="Bold"/>
                <Setter Property="FontFamily" Value="YouYuan"/>
                <Setter Property="FontSize" Value="12"/>
                <Setter Property="HorizontalAlignment" Value="Left"/>
                <Setter Property="Foreground" Value="#FF3B3B3B"/>
                <Setter Property="Margin" Value="5,0"/>
            </Style>
            <local:DynAreaIOViewModel_UnitTest x:Key="viewModel" IsError="False" ErrMsg="枫莱尔控制器连接断开" />
        </ResourceDictionary>
    </UserControl.Resources>
    <Button Click="Border_IO_Click" Style="{StaticResource ButtonStyle_empty}" d:DataContext="{StaticResource viewModel}">
        <Grid>
            <Border Style="{StaticResource BorderStyle_module}" >
                <StackPanel Margin="2">
                    <StackPanel Orientation="Horizontal" Margin="2">
                        <TextBlock Text="入" Style="{StaticResource TextBlockStyle_ItemHeader}" />
                        <StackPanel Orientation="Horizontal" Margin="4,0">
                            <Rectangle Fill="{Binding IStatus,Converter={StaticResource io2bitcolorconv},ConverterParameter=15}" Style="{StaticResource IOStyle}"/>
                            <Rectangle Fill="{Binding IStatus,Converter={StaticResource io2bitcolorconv},ConverterParameter=14}" Style="{StaticResource IOStyle}"/>
                            <Rectangle Fill="{Binding IStatus,Converter={StaticResource io2bitcolorconv},ConverterParameter=13}" Style="{StaticResource IOStyle}"/>
                            <Rectangle Fill="{Binding IStatus,Converter={StaticResource io2bitcolorconv},ConverterParameter=12}" Style="{StaticResource IOStyle}"/>
                        </StackPanel>
                        <StackPanel Orientation="Horizontal" Margin="4,0">
                            <Rectangle Fill="{Binding IStatus,Converter={StaticResource io2bitcolorconv},ConverterParameter=11}" Style="{StaticResource IOStyle}"/>
                            <Rectangle Fill="{Binding IStatus,Converter={StaticResource io2bitcolorconv},ConverterParameter=10}" Style="{StaticResource IOStyle}"/>
                            <Rectangle Fill="{Binding IStatus,Converter={StaticResource io2bitcolorconv},ConverterParameter=9}" Style="{StaticResource IOStyle}"/>
                            <Rectangle Fill="{Binding IStatus,Converter={StaticResource io2bitcolorconv},ConverterParameter=8}" Style="{StaticResource IOStyle}"/>
                                
                        </StackPanel>
                        <StackPanel Orientation="Horizontal" Margin="4,0">
                            <Rectangle Fill="{Binding IStatus,Converter={StaticResource io2bitcolorconv},ConverterParameter=7}" Style="{StaticResource IOStyle}"/>
                            <Rectangle Fill="{Binding IStatus,Converter={StaticResource io2bitcolorconv},ConverterParameter=6}" Style="{StaticResource IOStyle}"/>
                            <Rectangle Fill="{Binding IStatus,Converter={StaticResource io2bitcolorconv},ConverterParameter=5}" Style="{StaticResource IOStyle}"/>
                            <Rectangle Fill="{Binding IStatus,Converter={StaticResource io2bitcolorconv},ConverterParameter=4}" Style="{StaticResource IOStyle}"/>
                        </StackPanel>
                        <StackPanel Orientation="Horizontal" Margin="4,0">
                            <Rectangle Fill="{Binding IStatus,Converter={StaticResource io2bitcolorconv},ConverterParameter=3}" Style="{StaticResource IOStyle}"/>
                            <Rectangle Fill="{Binding IStatus,Converter={StaticResource io2bitcolorconv},ConverterParameter=2}" Style="{StaticResource IOStyle}"/>
                            <Rectangle Fill="{Binding IStatus,Converter={StaticResource io2bitcolorconv},ConverterParameter=1}" Style="{StaticResource IOStyle}"/>
                            <Grid>
                                <Rectangle Fill="{Binding IStatus,Converter={StaticResource io2bitcolorconv},ConverterParameter=0}" Style="{StaticResource IOStyle}"/>
                                <TextBlock Text="1" Style="{StaticResource IOTextStyle}"/>
                            </Grid>
                        </StackPanel>
                    </StackPanel>
                    <Grid Margin="2">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition/>
                            <ColumnDefinition Width="auto"/>
                        </Grid.ColumnDefinitions>
                        <StackPanel Orientation="Horizontal" VerticalAlignment="Top">
                            <TextBlock Text="出" Style="{StaticResource TextBlockStyle_ItemHeader}"  />
                            <StackPanel Orientation="Horizontal" Margin="4,0">
                                <Rectangle Fill="{Binding OStatus,Converter={StaticResource io2bitcolorconv},ConverterParameter=7}" Style="{StaticResource IOStyle}"/>
                                <Rectangle Fill="{Binding OStatus,Converter={StaticResource io2bitcolorconv},ConverterParameter=6}" Style="{StaticResource IOStyle}"/>
                                <Rectangle Fill="{Binding OStatus,Converter={StaticResource io2bitcolorconv},ConverterParameter=5}" Style="{StaticResource IOStyle}"/>
                                <Rectangle Fill="{Binding OStatus,Converter={StaticResource io2bitcolorconv},ConverterParameter=4}" Style="{StaticResource IOStyle}"/>
                            </StackPanel>
                            <StackPanel Orientation="Horizontal" Margin="4,0">
                                <Rectangle Fill="{Binding OStatus,Converter={StaticResource io2bitcolorconv},ConverterParameter=3}" Style="{StaticResource IOStyle}"/>
                                <Rectangle Fill="{Binding OStatus,Converter={StaticResource io2bitcolorconv},ConverterParameter=2}" Style="{StaticResource IOStyle}"/>
                                <Rectangle Fill="{Binding OStatus,Converter={StaticResource io2bitcolorconv},ConverterParameter=1}" Style="{StaticResource IOStyle}"/>
                                <Grid>
                                    <Rectangle Fill="{Binding OStatus,Converter={StaticResource io2bitcolorconv},ConverterParameter=0}" Style="{StaticResource IOStyle}"/>
                                    <TextBlock Text="1" Style="{StaticResource IOTextStyle}"/>
                                </Grid>
                            </StackPanel>
                        </StackPanel>
                        <StackPanel Orientation="Vertical" Grid.Column="1" Visibility="{Binding IsForever,Converter={StaticResource visbilityconv},ConverterParameter=HiddenWhenTrue}">
                            <TextBlock Text="剩余时间" Style="{StaticResource TextBlockStyle_ItemHeader}" Margin="0"/>
                            <StackPanel Orientation="Horizontal" Background="Black" >
                                <!--<TextBlock Text="20000" FontSize="24" FontFamily="Microsoft Sans Serif" TextAlignment="Center" HorizontalAlignment="Center" Foreground="White" />-->
                                <TextBlock Text="{Binding Hrs}" FontSize="24" FontFamily="Microsoft Sans Serif" TextAlignment="Center" HorizontalAlignment="Center" Foreground="White" Padding="2,0"/>
                                <TextBlock Style="{StaticResource ResourceKey=TextBlockStyle_FieldContent_mm}" Text="小时" FontSize="12" Foreground="White"/>
                            </StackPanel>
                        </StackPanel>
                    </Grid>
                </StackPanel>
            </Border>
            <Border Style="{StaticResource BorderStyle_module}" Background="Red" 
                    Visibility="{Binding IsError,Converter={StaticResource visbilityconv}}">
                <Grid >
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="auto"/>
                        <ColumnDefinition/>
                    </Grid.ColumnDefinitions>
                    <Path Margin="5" Fill="White" Stretch="Uniform" Width="60" Height="60" SnapsToDevicePixels="True" Data="{StaticResource Geometry_alert-circle-outline}"  >
                        <Path.Style>
                            <Style TargetType="Path">
                                <Style.Triggers>
                                    <DataTrigger Binding="{Binding IsError}" Value="True">
                                        <DataTrigger.EnterActions>
                                            <BeginStoryboard>
                                                <Storyboard RepeatBehavior="Forever" >
                                                    <DoubleAnimation BeginTime="0:0:0" Storyboard.TargetProperty="Opacity" From="1" To="0" Duration="00:00:01" />
                                                    <DoubleAnimation BeginTime="0:0:1" Storyboard.TargetProperty="Opacity" From="0" To="1" Duration="00:00:01" />
                                                </Storyboard>
                                            </BeginStoryboard>
                                        </DataTrigger.EnterActions>
                                    </DataTrigger>
                                </Style.Triggers>
                            </Style>
                        </Path.Style>
                    </Path>
                    <Viewbox Grid.Column="1" Margin="5" MaxWidth="190" MaxHeight="80">
                        <TextBlock VerticalAlignment="Center" MaxWidth="190" TextWrapping="Wrap" FontSize="30" Foreground="White" Text="{Binding ErrMsg}"/>
                    </Viewbox>
                    
                </Grid>

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