Shaker/Avalonia/ShakerApp/Views/Oil/OilControlView.axaml

<UserControl
    x:Class="ShakerApp.Views.OilControlView"
    xmlns="https://github.com/avaloniaui"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:local="using:ShakerApp"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:suki="https://github.com/kikipoulet/SukiUI"
    xmlns:view="using:ShakerApp.Views"
    xmlns:vm="using:ShakerApp.ViewModels"
    d:DesignHeight="450"
    d:DesignWidth="800"
    x:DataType="vm:OilSourceStatusViewModel"
    DataContext="{Binding Source={x:Static vm:OilSourceStatusViewModel.Instance}}"
    mc:Ignorable="d">
    <UserControl.IsEnabled>
        <MultiBinding Converter="{StaticResource MutliBoolConverter}">
            <Binding Path="IsConnect" />
            <Binding Path="IsRemote" />
            <Binding Path="IsEnabled" />
        </MultiBinding>
    </UserControl.IsEnabled>
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition />
            <RowDefinition Height="auto" />
        </Grid.RowDefinitions>

        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*" />
                <ColumnDefinition Width="2*" />
            </Grid.ColumnDefinitions>

            <ItemsControl
                VerticalAlignment="Center"
                IsEnabled="False"
                ItemsSource="{Binding OilSourceAnalogs}">
                <ItemsControl.ItemTemplate>
                    <DataTemplate>
                        <view:OilAnalogView IsVisible="{Binding IsVisible}" />
                    </DataTemplate>
                </ItemsControl.ItemTemplate>
            </ItemsControl>
            <StackPanel Grid.Column="1">
                <ItemsControl ItemsSource="{Binding Circuit}">
                    <ItemsControl.ItemTemplate>
                        <DataTemplate>
                            <suki:GroupBox IsVisible="{Binding IsVisible}">
                                <suki:GroupBox.Header>
                                    <StackPanel Orientation="Horizontal">
                                        <TextBlock
                                            VerticalAlignment="Center"
                                            FontSize="{StaticResource TabItemFontSize}"
                                            FontWeight="Bold"
                                            Text="{Binding Index, StringFormat='{}{0}#'}" />
                                        <TextBlock
                                            VerticalAlignment="Center"
                                            FontSize="{StaticResource TabItemFontSize}"
                                            FontWeight="Bold"
                                            Text="{local:ResourceBinding Value.Name}" />
                                    </StackPanel>
                                </suki:GroupBox.Header>
                                <view:PumpControlView DataContext="{Binding Value}" IsVisible="{Binding IsVisible}" />
                            </suki:GroupBox>
                        </DataTemplate>
                    </ItemsControl.ItemTemplate>
                </ItemsControl>

                <suki:GroupBox DataContext="{Binding Assistant}" IsVisible="{Binding IsVisible}">
                    <suki:GroupBox.Header>
                        <TextBlock
                            VerticalAlignment="Center"
                            FontSize="{StaticResource TabItemFontSize}"
                            FontWeight="Bold"
                            Text="{local:ResourceBinding Name}" />
                    </suki:GroupBox.Header>
                    <view:PumpControlView IsVisible="{Binding IsVisible}" />
                </suki:GroupBox>
                <suki:GroupBox DataContext="{Binding Forerunner}" IsVisible="{Binding IsVisible}">
                    <suki:GroupBox.Header>
                        <TextBlock
                            VerticalAlignment="Center"
                            FontSize="{StaticResource TabItemFontSize}"
                            FontWeight="Bold"
                            Text="{local:ResourceBinding Name}" />
                    </suki:GroupBox.Header>
                    <view:PumpControlView IsVisible="{Binding IsVisible}" />
                </suki:GroupBox>

                <suki:GroupBox DataContext="{Binding Circulate}" IsVisible="{Binding IsVisible}">
                    <suki:GroupBox.Header>
                        <TextBlock
                            VerticalAlignment="Center"
                            FontSize="{StaticResource TabItemFontSize}"
                            FontWeight="Bold"
                            Text="{local:ResourceBinding Name}" />
                    </suki:GroupBox.Header>
                    <view:PumpControlView IsVisible="{Binding IsVisible}" />
                </suki:GroupBox>
            </StackPanel>
        </Grid>

        <Grid
            Grid.Row="1"
            Height="86"
            Margin="10"
            ColumnDefinitions="*,2*">
            <Border
                Margin="20,10,20,10"
                Classes.Error="{Binding IsError}"
                CornerRadius="10">
                <Border.Styles>
                    <Style Selector="Border">
                        <Setter Property="Background" Value="Green" />
                    </Style>
                    <Style Selector="Border.Error">
                        <Setter Property="Background" Value="Red" />
                    </Style>
                </Border.Styles>
                <TextBlock
                    HorizontalAlignment="Center"
                    VerticalAlignment="Center"
                    FontSize="36"
                    FontStyle="Normal"
                    FontWeight="Bold"
                    Text="{Binding OilStatus}" />
            </Border>
            <Grid Grid.Column="1" Margin="10">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition />
                    <ColumnDefinition Width="86" />
                    <ColumnDefinition Width="86" />
                </Grid.ColumnDefinitions>
                <Border
                    BorderBrush="Gray"
                    BorderThickness="1"
                    CornerRadius="6"
                    IsVisible="{Binding OilErrors.Count}">
                    <ItemsControl ItemsSource="{Binding OilErrors}">
                        <ItemsControl.ItemTemplate>
                            <DataTemplate>
                                <StackPanel>
                                    <TextBlock
                                        HorizontalAlignment="Center"
                                        VerticalAlignment="Center"
                                        Text="{local:ResourceBinding Name}" />
                                    <local:LEDControl
                                        Width="56"
                                        Height="56"
                                        Classes.Error="{Binding Status}" />
                                </StackPanel>
                            </DataTemplate>
                        </ItemsControl.ItemTemplate>
                    </ItemsControl>
                </Border>
                <StackPanel Grid.Column="1">
                    <TextBlock
                        HorizontalAlignment="Center"
                        VerticalAlignment="Center"
                        Text="{DynamicResource PLCConnectStatus}" />
                    <local:LEDControl
                        Width="56"
                        Height="56"
                        Classes.Error="{Binding !IsConnect}" />
                </StackPanel>
                <StackPanel Grid.Column="2">
                    <TextBlock
                        HorizontalAlignment="Center"
                        VerticalAlignment="Center"
                        Classes.Warn="{Binding IsRemote}">
                        <TextBlock.Styles>
                            <Style Selector="TextBlock">
                                <Setter Property="Text" Value="{DynamicResource OilLocalControl}" />
                            </Style>
                            <Style Selector="TextBlock.Warn">
                                <Setter Property="Text" Value="{DynamicResource OilRemoteControl}" />
                            </Style>
                        </TextBlock.Styles>
                    </TextBlock>
                    <local:LEDControl
                        Width="56"
                        Height="56"
                        Classes.Warn="{Binding !IsRemote}" />
                </StackPanel>
            </Grid>
        </Grid>
    </Grid>
</UserControl>