Software/Visual_Studio/MachineStudio/Modules/Tango.MachineStudio.MachineDesigner/Views/HardwareConfigurationView.xaml

<UserControl x:Class="Tango.MachineStudio.MachineDesigner.Views.HardwareConfigurationView"
             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:materialDesign="http://materialdesigninxaml.net/winfx/xaml/themes"
             xmlns:mahapps="http://metro.mahapps.com/winfx/xaml/controls"
             xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity"
             xmlns:sys="clr-namespace:System;assembly=mscorlib"
             xmlns:converters="clr-namespace:Tango.SharedUI.Converters;assembly=Tango.SharedUI"
             xmlns:local="clr-namespace:Tango.MachineStudio.MachineDesigner.Views"
              xmlns:vm="clr-namespace:Tango.MachineStudio.MachineDesigner.ViewModels"
             mc:Ignorable="d" 
             d:DesignHeight="450" d:DesignWidth="800" DataContext="{Binding HardwareConfigurationViewVM}" Foreground="{StaticResource GrayBrush280}">
    <UserControl.Resources>
        <converters:BooleanToVisibilityInverseConverter x:Key="BooleanToVisibilityInverseConverter" />
        <converters:BooleanToVisibilityConverter x:Key="BooleanToVisibilityConverter" />
        <converters:IsNullToVisibilityConverter x:Key="IsNullToVisibilityConverter" />
        <converters:BooleanToYesNoConverter x:Key="BooleanToYesNoConverter" />
        <converters:DoubleToIntConverter x:Key="DoubleToIntConverter" />

    </UserControl.Resources>
    <Grid Margin="0 40 0 0" TextElement.Foreground="{StaticResource GrayBrush280}">
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="400"></ColumnDefinition>
                <ColumnDefinition Width="Auto"></ColumnDefinition>
                <ColumnDefinition Width="300"></ColumnDefinition>
            </Grid.ColumnDefinitions>
            <StackPanel Orientation="Vertical" HorizontalAlignment="Right" Margin="0 30 0 0" MouseUp="Main_container_MouseUp">

                <TextBlock FontSize="10">Find component</TextBlock>
                <Border Margin="0 2 0 0" Background="{ StaticResource TransparentBackgroundBrush450}" BorderThickness="1" BorderBrush="{StaticResource borderBrush}" CornerRadius="3" Padding="5">
                    <StackPanel Orientation="Horizontal" VerticalAlignment="Center">
                        <materialDesign:PackIcon VerticalAlignment="Center" Width="24" Height="24" Kind="Magnify" />
                        <TextBox Style="{x:Null}" Background="Transparent" BorderThickness="0" Text="{Binding ComponentFilter,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged,Delay=1000}" materialDesign:HintAssist.Hint="Search" Width="350" FontSize="16" />
                    </StackPanel>
                </Border>

                <TextBlock Margin="0 10 0 0" FontSize="10">Find parameter</TextBlock>
                <Border Margin="0 2 0 0" Background="{ StaticResource TransparentBackgroundBrush450}" BorderThickness="1" BorderBrush="{StaticResource borderBrush}" CornerRadius="3" Padding="5">
                    <StackPanel Orientation="Horizontal" VerticalAlignment="Center">
                        <materialDesign:PackIcon VerticalAlignment="Center" Width="24" Height="24" Kind="Magnify" />
                        <TextBox Style="{x:Null}" Background="Transparent" BorderThickness="0" Text="{Binding PropertyFilter,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged,Delay=1000}" materialDesign:HintAssist.Hint="Search" Width="350" FontSize="16" />
                    </StackPanel>
                </Border>
                <StackPanel Orientation="Horizontal" VerticalAlignment="Center" Margin="0 30 0 0" HorizontalAlignment="Left">
                    <CheckBox Name="cbShowOnlyDifference" IsChecked="{Binding IsShowDifference}" VerticalAlignment="Center"></CheckBox>
                    <TextBlock Margin="10 0 0 0" VerticalAlignment="Center" Text="Display only overridden parameters" FontSize="16" FontWeight="Normal"></TextBlock>
                </StackPanel>
            </StackPanel>
            <ScrollViewer Focusable="False" Padding="0 0 10 0" VerticalScrollBarVisibility="Auto" Margin="0 0 0 0" HorizontalAlignment="Center" Grid.Column="1">
                <Grid x:Name="main_container" MouseUp="Main_container_MouseUp">
                    <ItemsControl Focusable="False"   Margin="0, 0, 0, 0" Name="lvDataBinding" ItemsSource="{Binding Collections}"  HorizontalContentAlignment="Center"
                          VerticalContentAlignment="Top" >
                        <ItemsControl.ItemTemplate>
                            <DataTemplate>
                                <DockPanel>
                                    <TextBlock Margin="0 40 20 0" DockPanel.Dock="Left" Text="{Binding CollectionName}" FontSize="22" FontWeight="SemiBold" HorizontalAlignment="Right" TextAlignment="Right" VerticalAlignment="Top" Width="200" />
                                    <Grid>
                                        <Border Name="LeftB" Grid.Column="0" VerticalAlignment="Stretch" HorizontalAlignment="Center" MinWidth="800" >
                                            <Grid>
                                                <StackPanel Orientation="Vertical">
                                                    <ItemsControl Focusable="False"  Margin="10,0,0,0" Name="ComponentListLeft" ItemsSource="{Binding Components}"  HorizontalContentAlignment="Stretch" Foreground="{StaticResource GrayBrush280}">
                                                        <ItemsControl.ItemTemplate>
                                                            <DataTemplate>
                                                                <StackPanel Orientation="Vertical" Margin="0 10" >
                                                                    <TextBlock Margin="0 5"  Text="{Binding Description}" FontWeight="SemiBold" FontSize="18"/>
                                                                    <Border BorderThickness="1" BorderBrush="{StaticResource borderBrush}" CornerRadius="3" Background="{StaticResource TransparentBackgroundBrush600}">
                                                                        <ItemsControl Focusable="False" Grid.Row="1" Margin="10"  Name="PropertyListL" ItemsSource="{Binding Properties}" HorizontalContentAlignment="Stretch">
                                                                            <ItemsControl.ItemTemplate>
                                                                                <DataTemplate>
                                                                                    <Grid VerticalAlignment="Center" Height="25" Background="Transparent" >
                                                                                        <StackPanel Orientation="Horizontal" >
                                                                                            <ToggleButton FocusVisualStyle="{x:Null}" x:Name="editPropertyButton" IsChecked="{Binding IsSelected,Mode=TwoWay}"  BorderThickness="0"  VerticalAlignment="Center" Cursor="Hand"  Margin="10 0 0 0"  Background="Transparent" VerticalContentAlignment="Top" Checked="EditPropertyButton_Checked" Foreground="{StaticResource GrayBrush280}">
                                                                                                <ToggleButton.Content>
                                                                                                    <StackPanel Orientation="Horizontal">
                                                                                                        <TextBlock VerticalAlignment="Center" FontWeight="Normal" >
                                                                                                            <Run Text="{Binding PropertyName}"></Run>
                                                                                                            <Run>:</Run>
                                                                                                        </TextBlock>
                                                                                                        <TextBlock VerticalAlignment="Center"  Text="{Binding DefaultValue}" Margin="10 0 10 0"/>
                                                                                                        <materialDesign:PackIcon Visibility="{Binding HasDifferences,Converter={StaticResource BooleanToVisibilityConverter}}" Margin="10 0" VerticalAlignment="Center" Kind="ChevronRight" />

                                                                                                        <TextBlock x:Name="actualValueTextBox" Text="{Binding ActualValue}" Margin="20 0 0 0" FontWeight="Bold"  HorizontalAlignment="Left" Visibility="{Binding Path=IsChecked, ElementName=editPropertyButton, Converter={StaticResource BooleanToVisibilityInverseConverter}}" VerticalAlignment="Center" >
                                                                                                            <TextBlock.Style>
                                                                                                                <Style TargetType="TextBlock">
                                                                                                                    <Setter Property="Visibility" Value="Collapsed" />
                                                                                                                    <Style.Triggers>
                                                                                                                        <MultiDataTrigger>
                                                                                                                            <MultiDataTrigger.Conditions>
                                                                                                                                <Condition Binding="{ Binding Path=IsChecked, ElementName=editPropertyButton}" Value="False" />
                                                                                                                                <Condition Binding="{ Binding Path=ActualValue ,Converter={StaticResource IsNullToVisibilityConverter}}"  Value="Visible" />
                                                                                                                            </MultiDataTrigger.Conditions>
                                                                                                                            <Setter Property="Visibility" Value="Visible" />
                                                                                                                        </MultiDataTrigger>
                                                                                                                    </Style.Triggers>
                                                                                                                </Style>
                                                                                                            </TextBlock.Style>
                                                                                                        </TextBlock>
                                                                                                        <ContentControl Visibility="{Binding ElementName=editPropertyButton,Path=IsChecked,Converter={StaticResource BooleanToVisibilityConverter}}" Margin="5 0 0 0" Content="{Binding}" Foreground="{StaticResource GrayBrush280}">
                                                                                                            <ContentControl.Resources>
                                                                                                                <DataTemplate x:Key="int" DataType="{x:Type sys:Int32}">
                                                                                                                    <mahapps:NumericUpDown KeyDown="NumericUpDown_KeyDown" MinHeight="20" MaxWidth="400" VerticalContentAlignment="Center" ScrollViewer.HorizontalScrollBarVisibility="Disabled" HorizontalAlignment="Center" Value="{Binding EditableValue,Converter={StaticResource DoubleToIntConverter}, UpdateSourceTrigger=PropertyChanged}" Background="Transparent" HideUpDownButtons="True"  InterceptArrowKeys="True" BorderThickness="0 0 0 1" BorderBrush="{StaticResource GrayBrush280}" InterceptMouseWheel="True" HasDecimals="False" HorizontalContentAlignment="Center" Foreground="{StaticResource GrayBrush280}"/>
                                                                                                                </DataTemplate>
                                                                                                                <DataTemplate x:Key="double" DataType="{x:Type sys:Double}">
                                                                                                                    <mahapps:NumericUpDown KeyDown="NumericUpDown_KeyDown" MinHeight="20"  MaxWidth="400" VerticalContentAlignment="Center" ScrollViewer.HorizontalScrollBarVisibility="Disabled" HorizontalAlignment="Center" Value="{Binding EditableValue, UpdateSourceTrigger=PropertyChanged}" Background="Transparent" HideUpDownButtons="True"  InterceptArrowKeys="True" BorderThickness="0 0 0 1" BorderBrush="{StaticResource GrayBrush280}" InterceptMouseWheel="True" HasDecimals="True" HorizontalContentAlignment="Center" Foreground="{StaticResource GrayBrush280}"/>
                                                                                                                </DataTemplate>
                                                                                                                <DataTemplate x:Key="bool" DataType="{x:Type sys:Boolean}">
                                                                                                                    <ToggleButton Margin="10 2 0 0" IsChecked="{Binding EditableValue,UpdateSourceTrigger=PropertyChanged}" VerticalAlignment="Center" VerticalContentAlignment="Center" HorizontalAlignment="Right"></ToggleButton>
                                                                                                                </DataTemplate>
                                                                                                            </ContentControl.Resources>
                                                                                                            <ContentControl.Style>
                                                                                                                <Style TargetType="ContentControl">
                                                                                                                    <Setter Property="ContentTemplate" Value="{x:Null}">
                                                                                                                    </Setter>
                                                                                                                    <Style.Triggers>
                                                                                                                        <DataTrigger Binding="{Binding Type.Name}" Value="Int32">
                                                                                                                            <Setter Property="ContentTemplate" Value="{StaticResource int}" />
                                                                                                                        </DataTrigger>
                                                                                                                        <DataTrigger Binding="{Binding Type.Name}" Value="Double">
                                                                                                                            <Setter Property="ContentTemplate" Value="{StaticResource double}" />
                                                                                                                        </DataTrigger>
                                                                                                                        <DataTrigger Binding="{Binding Type.Name}" Value="Boolean">
                                                                                                                            <Setter Property="ContentTemplate" Value="{StaticResource bool}" />
                                                                                                                        </DataTrigger>
                                                                                                                    </Style.Triggers>
                                                                                                                </Style>
                                                                                                            </ContentControl.Style>
                                                                                                        </ContentControl>

                                                                                                    </StackPanel>
                                                                                                </ToggleButton.Content>
                                                                                                <ToggleButton.Style>
                                                                                                    <Style TargetType="{x:Type ToggleButton}">
                                                                                                        <Setter Property="Template">
                                                                                                            <Setter.Value>
                                                                                                                <ControlTemplate TargetType="ToggleButton">
                                                                                                                    <Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="1" Background="{TemplateBinding Background}" Margin="0" Padding="3,0,4,2">
                                                                                                                        <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>
                                                                                                                    </Border>
                                                                                                                </ControlTemplate>
                                                                                                            </Setter.Value>
                                                                                                        </Setter>
                                                                                                        <Setter Property="BorderBrush" Value="Transparent"/>
                                                                                                        <Style.Triggers>
                                                                                                            <Trigger Property="IsMouseOver" Value="True">
                                                                                                                <Setter Property="Background" Value="Transparent"></Setter>
                                                                                                                <Setter Property="BorderBrush" Value="Gray" />
                                                                                                            </Trigger>
                                                                                                            <Trigger Property="IsPressed" Value="True">
                                                                                                                <Setter Property="Background" Value="Transparent"></Setter>
                                                                                                                <Setter Property="BorderBrush" Value="{StaticResource AccentColorBrush}" />
                                                                                                            </Trigger>
                                                                                                            <Trigger Property="IsChecked" Value="True">
                                                                                                                <Setter Property="Background" Value="Transparent"></Setter>
                                                                                                                <Setter Property="BorderBrush" Value="{StaticResource RedBrush300}" />
                                                                                                            </Trigger>
                                                                                                        </Style.Triggers>
                                                                                                    </Style>
                                                                                                </ToggleButton.Style>
                                                                                            </ToggleButton>
                                                                                            <materialDesign:PackIcon x:Name="pencilicon" Foreground="{StaticResource RedBrush300}"  Kind="Pencil"  VerticalAlignment="Center" Visibility="{Binding IsSelected,Converter={StaticResource BooleanToVisibilityConverter}}"/>

                                                                                            <StackPanel Margin="10 0 0 0" Orientation="Horizontal">
                                                                                                <materialDesign:PackIcon VerticalAlignment="Center" Visibility="{Binding IsValuesMatched,Converter={StaticResource BooleanToVisibilityConverter}}" Width="18" Height="18" Kind="Alert" ToolTip="Parameter is overridden but equal" Foreground="{StaticResource OrangeBrush300}">
                                                                                                    <materialDesign:PackIcon.Style>
                                                                                                        <Style TargetType="FrameworkElement">
                                                                                                            <Style.Triggers>
                                                                                                                <EventTrigger RoutedEvent="Loaded">
                                                                                                                    <EventTrigger.Actions>
                                                                                                                        <BeginStoryboard x:Name="alertStory">
                                                                                                                            <Storyboard>
                                                                                                                                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="Opacity" Duration="00:00:01" RepeatBehavior="Forever">
                                                                                                                                    <DiscreteDoubleKeyFrame KeyTime="00:00:00" Value="1" />
                                                                                                                                    <DiscreteDoubleKeyFrame KeyTime="00:00:0.5" Value="0" />
                                                                                                                                </DoubleAnimationUsingKeyFrames>
                                                                                                                            </Storyboard>
                                                                                                                        </BeginStoryboard>
                                                                                                                    </EventTrigger.Actions>
                                                                                                                </EventTrigger>
                                                                                                                <EventTrigger RoutedEvent="Unloaded">
                                                                                                                    <EventTrigger.Actions>
                                                                                                                        <RemoveStoryboard BeginStoryboardName="alertStory" />
                                                                                                                    </EventTrigger.Actions>
                                                                                                                </EventTrigger>
                                                                                                            </Style.Triggers>
                                                                                                        </Style>
                                                                                                    </materialDesign:PackIcon.Style>
                                                                                                </materialDesign:PackIcon>
                                                                                                <Button Margin="5 0 0 0" Command="{Binding DeleteCommand}" VerticalAlignment="Center" Width="24" Height="24" Padding="0" Style="{StaticResource MaterialDesignFlatButton}"  Visibility="{Binding HasDifferences,Converter={StaticResource BooleanToVisibilityConverter}}">
                                                                                                    <materialDesign:PackIcon Width="16" Height="16" Kind="Close" ToolTip="Clear" Foreground="{StaticResource RedBrush300}" />
                                                                                                </Button>
                                                                                            </StackPanel>
                                                                                        </StackPanel>
                                                                                    </Grid>
                                                                                    <DataTemplate.Triggers>
                                                                                        <MultiDataTrigger>
                                                                                            <MultiDataTrigger.Conditions>
                                                                                                <Condition Binding="{Binding ElementName=cbShowOnlyDifference, Path=IsChecked}" Value="True" />
                                                                                                <Condition Binding="{Binding HasDifferences}" Value="False" />
                                                                                            </MultiDataTrigger.Conditions>
                                                                                            <MultiDataTrigger.Setters>
                                                                                                <Setter Property="Visibility" Value="Collapsed" />
                                                                                            </MultiDataTrigger.Setters>
                                                                                        </MultiDataTrigger>
                                                                                    </DataTemplate.Triggers>
                                                                                </DataTemplate>
                                                                            </ItemsControl.ItemTemplate>
                                                                        </ItemsControl>
                                                                    </Border>
                                                                </StackPanel>
                                                                <DataTemplate.Triggers>
                                                                    <MultiDataTrigger>
                                                                        <MultiDataTrigger.Conditions>
                                                                            <Condition Binding="{Binding ElementName=cbShowOnlyDifference, Path=IsChecked}" Value="True" />
                                                                            <Condition Binding="{Binding HasDifferences}" Value="False" />
                                                                        </MultiDataTrigger.Conditions>
                                                                        <MultiDataTrigger.Setters>
                                                                            <Setter Property="Visibility" Value="Collapsed" />
                                                                        </MultiDataTrigger.Setters>
                                                                    </MultiDataTrigger>
                                                                </DataTemplate.Triggers>
                                                            </DataTemplate>
                                                        </ItemsControl.ItemTemplate>
                                                    </ItemsControl>
                                                </StackPanel>
                                            </Grid>
                                        </Border>
                                    </Grid>
                                </DockPanel>
                            </DataTemplate>
                        </ItemsControl.ItemTemplate>
                    </ItemsControl>
                </Grid>
            </ScrollViewer>
        </Grid>
    </Grid>
</UserControl>