infineon_cs_hmi/uniper_hmi/UniperHMI/OwnControls/Views/UnitDetailsControl.xaml

<UserControl xmlns:HMIToolkit="clr-namespace:HMIToolkit"  x:Class="UniperHMI.UnitDetailsControl"
             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:UniperHMI"
             mc:Ignorable="d"
             d:DataContext="{d:DesignInstance Type=local:UnitDetailsControlVM, IsDesignTimeCreatable=True}"
             HorizontalContentAlignment="Stretch" VerticalContentAlignment="Stretch" Width="Auto" Height="Auto"
             x:Name="root">
    <UserControl.Resources>
        <HMIToolkit:FeedbackToColorConverter x:Key="feedbackConverter" />
    </UserControl.Resources>

    <Grid x:Name="mainGrid">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="Auto"/>
        </Grid.RowDefinitions>

        <!-- Row 0 -->
        <Label Content="{Binding UnitName, ElementName=root}" Grid.Row="0" Grid.ColumnSpan="4" FontSize="24" HorizontalAlignment="Center"/>

        
        <!-- Row 1 -->
        <Line Grid.Row="1" Grid.Column="0" Grid.ColumnSpan="4" X1="0" X2="{Binding ElementName=mainGrid, Path=ActualWidth}" Stroke="White" Margin="0,5,0,10"/>

        
        <!-- Row 2 -->
        <Grid Grid.Row="2">
            <Grid.ColumnDefinitions>
                <ColumnDefinition />
                <ColumnDefinition />
            </Grid.ColumnDefinitions>
            <StackPanel Grid.Column="0" Orientation="Horizontal" Width="Auto" HorizontalAlignment="Left">
                <Label Content="Spannung:" />
                <TextBox Text="{Binding RVoltage, StringFormat=N2}" MaxLines="1" Width="70"  TextAlignment="Right" IsReadOnly="True" />
                <Label Content="V" />
            </StackPanel>
            <StackPanel Grid.Column="1" Orientation="Horizontal">
                <Label Content="Status:" Margin="20,0,0,0"/>
                <Label Grid.ColumnSpan="2" Content="{Binding Status}" HorizontalAlignment="Center"/>
            </StackPanel>
        </Grid>

        <!-- Row 3 -->
        <Line Grid.Row="3" Grid.Column="0" Grid.ColumnSpan="4" X1="0" X2="{Binding ElementName=mainGrid, Path=ActualWidth}" Stroke="White" Margin="0,5,0,10"/>


        <!-- Row 4 -->
        <Grid Grid.Row="4">
            <Grid.ColumnDefinitions>
                <ColumnDefinition />
                <ColumnDefinition Width="Auto"/>
                <ColumnDefinition />
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
                <RowDefinition />
                <RowDefinition />
                <RowDefinition />
            </Grid.RowDefinitions>
            <Label Grid.Row="0" Grid.Column="0" Content="Negolyt:" FontWeight="Bold" HorizontalAlignment="Center"/>
            <Label Grid.Row="0" Grid.Column="2" Content="Posolyt:" FontWeight="Bold" HorizontalAlignment="Center"/>

            <Button Grid.Row="1" Grid.Column="0" Content="Tankventil" Command="{Binding ShowValveNegolytCommand}" HorizontalAlignment="Center" Width="100" />
            <Button Grid.Row="1" Grid.Column="2" Content="Tankventil" Command="{Binding ShowValvePosolytCommand}" HorizontalAlignment="Center" Width="100" />

            <!-- Open Close both valves -->
            <Label Grid.Row="0" Grid.Column="1" Content="Both:" FontWeight="Bold" HorizontalAlignment="Center"/>
            <Grid Grid.Row="1" Grid.Column="1">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition Width="Auto" />
                </Grid.ColumnDefinitions>

                <Button Grid.Column="0" Content="Open" Width="50" Command="{Binding OpenBothValvesCommand}" IsEnabled="{Binding CanOpenBothValves}" Background="{Binding FeedbackOpenValves, Converter={StaticResource feedbackConverter}}"/>
                <Button Grid.Column="1" Content="Close" Width="50" Command="{Binding CloseBothValvesCommand}" IsEnabled="{Binding CanCloseBothValves}" Background="{Binding FeedbackCloseValves, Converter={StaticResource feedbackConverter}}" Margin="5,0,0,0"/>
            </Grid>
            
            <!-- Start stop both pumps -->
            <Grid Grid.Row="2" Grid.Column="1">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition Width="Auto" />
                </Grid.ColumnDefinitions>

                <Button Grid.Column="0" Content="Start" Command="{Binding StartBothPumpsCommand}" IsEnabled="{Binding CanStartBothPumps}" Background="{Binding FeedbackStartPumps, Converter={StaticResource feedbackConverter}}" Width="50" Margin="0,5,0,0"/>
                <Button Grid.Column="1" Content="Stop" Command="{Binding StopBothPumpsCommand}" IsEnabled="{Binding CanStopBothPumps}" Background="{Binding FeedbackStopPumps, Converter={StaticResource feedbackConverter}}" Width="50"  Margin="5,5,0,0"/>
            </Grid>

            <Button Grid.Row="2" Grid.Column="0" Content="Pumpe" Command="{Binding ShowPumpNegolytCommand}" HorizontalAlignment="Center" Width="100" Margin="0,5,0,0"/>
            <Button Grid.Row="2" Grid.Column="2" Content="Pumpe" Command="{Binding ShowPumpPosolytCommand}" HorizontalAlignment="Center" Width="100" Margin="0,5,0,0"/>
        </Grid>
        

        
        <!-- Row 5 -->
        <Line Grid.Row="5" X1="0" X2="{Binding ElementName=mainGrid, Path=ActualWidth}" Stroke="White" Margin="0,5,0,10"/>


        <!-- Row 6 -->
        <Grid Grid.Row="6">
            <Grid.ColumnDefinitions>
                <ColumnDefinition />
                <ColumnDefinition />
                <ColumnDefinition />
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
                <RowDefinition />
                <RowDefinition />
                <RowDefinition />
                <RowDefinition />
                <RowDefinition />
            </Grid.RowDefinitions>

            <Label Grid.Row="0" Grid.Column="1" Content="Negolyt:" FontWeight="Bold" />
            <Label Grid.Row="0" Grid.Column="2" Content="Posolyt:" FontWeight="Bold" />

            <Label Grid.Row="1" Grid.Column="0" Content="Druck Segment Inlet:" />
            <HMIToolkit:AnalogValue Grid.Row="1" Grid.Column="1" DataContext="{Binding PressureNegolytSegmentInVM}" HorizontalAlignment="Left" />
            <HMIToolkit:AnalogValue Grid.Row="1" Grid.Column="2" DataContext="{Binding PressurePosolytSegmentInVM}" HorizontalAlignment="Left" />

            <Label Grid.Row="2" Grid.Column="0" Content="Druck Tank Inlet:" Margin="0,5,0,0"/>
            <HMIToolkit:AnalogValue Grid.Row="2" Grid.Column="1" DataContext="{Binding PressureNegolytTankInVM}" HorizontalAlignment="Left" Margin="0,5,0,0"/>
            <HMIToolkit:AnalogValue Grid.Row="2" Grid.Column="2" DataContext="{Binding PressurePosolytTankInVM}" HorizontalAlignment="Left" Margin="0,5,0,0"/>

            <Label Grid.Row="3" Grid.Column="0" Content="Temperatur Tank Inlet:" Margin="0,5,0,5"/>
            <HMIToolkit:AnalogValue Grid.Row="3" Grid.Column="1" DataContext="{Binding TemperatureNegolytTankInVM}" HorizontalAlignment="Left" Margin="0,5,0,5"/>
            <HMIToolkit:AnalogValue Grid.Row="3" Grid.Column="2" DataContext="{Binding TemperaturePosolytTankInVM}" HorizontalAlignment="Left" Margin="0,5,0,5"/>
        </Grid>

    </Grid>
</UserControl>