LGES-OC5-PtoP-Welder/AuroraDevices/AuroraMotor/Views/UserControls/Motion/JogButtonPanel.xaml

<UserControl x:Class="AuroraMotor.Views.JogButtonPanel"
             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:AuroraMotor.Views"
             mc:Ignorable="d"
             x:Name="uc"
             d:DesignHeight="160" d:DesignWidth="260">
    <UserControl.Resources>
        <Style x:Key="styleTbJogDirection" TargetType="TextBlock">
            <Setter Property="TextAlignment" Value="Center"/>
            <Setter Property="Foreground" Value="White"/>
            <Setter Property="FontWeight" Value="Medium"/>
            <Setter Property="FontSize" Value="13"/>
            <Setter Property="Margin" Value="1"/>
        </Style>
        <Style x:Key="styleTbJogAxis" TargetType="TextBlock">
            <Setter Property="TextAlignment" Value="Right"/>
            <Setter Property="VerticalAlignment" Value="Center"/>
            <Setter Property="Foreground" Value="White"/>
            <Setter Property="FontWeight" Value="Medium"/>
            <Setter Property="FontSize" Value="15"/>
            <Setter Property="Margin" Value="0,0,5,0"/>
        </Style>
        <Style x:Key="styleImgJogDirection" TargetType="Image">
            <Setter Property="Width"  Value="38"/>
            <Setter Property="Height" Value="38"/>
        </Style>
        <Style x:Key="styleBtnJogDirection" TargetType="Button">
            <Setter Property="Width" Value="40"/>
            <Setter Property="Height" Value="40"/>
            <Setter Property="Background" Value="WhiteSmoke"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Button">
                        <Border x:Name="jogBtnBorder" CornerRadius="100" Background="{TemplateBinding Background}">
                            <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>
                        </Border>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsMouseOver" Value="True">
                                <Setter Property="Opacity" Value="0.8" />
                            </Trigger>
                            <Trigger Property="IsPressed" Value="True">
                                <Setter Property="Background" TargetName="jogBtnBorder" Value="Lime"/>
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
        <Style x:Key="styleBtnJogSpecificPosition" TargetType="Button">
            <Setter Property="Width" Value="12"/>
            <Setter Property="Height" Value="26"/>
            <Setter Property="BorderThickness" Value="0"/>
            <Setter Property="Background" Value="LightGray"/>
            <Setter Property="Margin" Value="7,0,7,0"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Button">
                        <Border CornerRadius="2" Background="{TemplateBinding Background}">
                            <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>
                        </Border>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsMouseOver" Value="True">
                                <Setter Property="Opacity" Value="0.8" />
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </UserControl.Resources>
    <GroupBox HorizontalAlignment="Center" Width="250">
        <GroupBox.Header>
            <Grid Width="240" Margin="-10 0">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*"/>
                    <ColumnDefinition Width="auto"/>
                </Grid.ColumnDefinitions>
                <Viewbox Height="18">
                    <TextBlock Grid.Column="0" Text="{Binding Title, ElementName=uc}" Style="{StaticResource styleTbJogAxis}" DockPanel.Dock="Left"/>
                </Viewbox>
                <CheckBox Grid.Column="2" Content="Use step" IsChecked="{Binding UseStep, ElementName=uc}" Margin="4 0" DockPanel.Dock="Right" VerticalContentAlignment="Center"/>
            </Grid>
        </GroupBox.Header>
        <Border>
            <Grid>
                <Grid.RowDefinitions>
                    <!--Direction desc-->
                    <RowDefinition Height="*"/>
                    <!--Buttons-->
                    <RowDefinition Height="2*"/>
                    <!--Home desc-->
                    <RowDefinition Height="auto"/>
                </Grid.RowDefinitions>

                <Grid.ColumnDefinitions>
                    <ColumnDefinition/>
                    <ColumnDefinition/>
                    <ColumnDefinition/>
                    <ColumnDefinition/>
                    <ColumnDefinition/>
                </Grid.ColumnDefinitions>

                <!--Direction desc-->
                <Grid Grid.Column="1" Grid.Row="0" Margin="3"
                      HorizontalAlignment="Center" VerticalAlignment="Center">
                    <TextBlock Text="{Binding DirectionMinus, ElementName=uc}" Style="{StaticResource styleTbJogDirection}"/>
                </Grid>
                <Grid Grid.Column="3" Grid.Row="0" Margin="3"
                      HorizontalAlignment="Center" VerticalAlignment="Center">
                    <TextBlock Text="{Binding DirectionPlus, ElementName=uc}" Style="{StaticResource styleTbJogDirection}"/>
                </Grid>

                <!--Buttons-->
                <Grid Grid.Column="0" Grid.Row="1">
                    <Button Style="{StaticResource styleBtnJogSpecificPosition}"/>
                </Grid>
                <Grid Grid.Column="1" Grid.Row="1">
                    <Button x:Name="btnMinus"
                            Style="{StaticResource styleBtnJogDirection}"
                            Click="DirectionMinusButton_Click"
                            PreviewMouseDown="DirectionMinusButton_Down"
                            PreviewMouseUp="Button_MouseUp">
                        <Image x:Name="imgLeft" Style="{StaticResource styleImgJogDirection}" />
                    </Button>
                </Grid>
                <Grid Grid.Column="2" Grid.Row="1">
                    <Button Style="{StaticResource styleBtnJogSpecificPosition}"/>
                </Grid>
                <Grid Grid.Column="3" Grid.Row="1">
                    <Button x:Name="btnPlus"
                            Style="{StaticResource styleBtnJogDirection}"
                            Click="DirectionPlusButton_Click"
                            PreviewMouseDown="DirectionPlusButton_Down"
                            PreviewMouseUp="Button_MouseUp">
                        <Image x:Name="imgRight" Style="{StaticResource styleImgJogDirection}"/>
                    </Button>
                </Grid>
                <Grid Grid.Column="4" Grid.Row="1">
                    <Button Style="{StaticResource styleBtnJogSpecificPosition}"/>
                </Grid>

                <Grid Grid.Column="2" Grid.Row="2" Margin="5">
                    <TextBlock Text="H" Style="{StaticResource styleTbJogDirection}"/>
                </Grid>
            </Grid>
        </Border>
    </GroupBox>
</UserControl>