BPA.SingleDevice/BPA.UIControl/Themes/StepBar.xaml

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                    xmlns:bpa="clr-namespace:BPA.UIControl">

    <ResourceDictionary.MergedDictionaries>
        <ResourceDictionary Source="pack://application:,,,/BPA.UIControl;component/Themes/Resources/Default.xaml" />
    </ResourceDictionary.MergedDictionaries>

    <Style x:Key="HorizontalStepBarItem" TargetType="{x:Type bpa:StepBarItem}">
        <Setter Property="Foreground" Value="{DynamicResource DefaultForeground}" />
        <Setter Property="Focusable" Value="False" />
        <Setter Property="VerticalContentAlignment" Value="{Binding VerticalContentAlignment, RelativeSource={RelativeSource AncestorType=bpa:StepBar}}" />
        <Setter Property="HorizontalContentAlignment" Value="{Binding HorizontalContentAlignment, RelativeSource={RelativeSource AncestorType=bpa:StepBar}}" />
        <Setter Property="CurrentIndex" Value="{Binding CurrentIndex, RelativeSource={RelativeSource AncestorType=bpa:StepBar}}" />
        <Setter Property="IconType" Value="{x:Null}" />
        <Setter Property="Focusable" Value="False" />
        <Setter Property="bpa:ControlHelper.FocusedBrush" Value="{Binding Path=(bpa:ControlHelper.FocusedBrush), RelativeSource={RelativeSource AncestorType=bpa:StepBar}}" />
        <Setter Property="bpa:ControlHelper.FocusedForegroundBrush" Value="{Binding Path=(bpa:ControlHelper.FocusedForegroundBrush), RelativeSource={RelativeSource AncestorType=bpa:StepBar}}" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type bpa:StepBarItem}">
                    <Grid x:Name="root">
                        <Grid.RowDefinitions>
                            <RowDefinition Height="35" />
                            <RowDefinition Height="Auto" />
                            <RowDefinition Height="Auto" />
                        </Grid.RowDefinitions>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="*" />
                            <ColumnDefinition Width="Auto" />
                            <ColumnDefinition Width="*" />
                        </Grid.ColumnDefinitions>

                        <Rectangle x:Name="leftLine"
                                   Height="2"
                                   Margin="-1 0"
                                   Fill="{TemplateBinding Foreground}" />

                        <Viewbox Grid.Column="1" Focusable="False">
                            <Grid>
                                <bpa:Icon x:Name="icon"
                                          Width="35"
                                          Height="35"
                                          Type="{TemplateBinding IconType}" />

                                <TextBlock x:Name="indexText"
                                           HorizontalAlignment="Center"
                                           VerticalAlignment="Center"
                                           FontSize="13"
                                           Foreground="{Binding Path=(bpa:ControlHelper.FocusedForegroundBrush), RelativeSource={RelativeSource Mode=TemplatedParent}}"
                                           Text="{Binding Index, RelativeSource={RelativeSource Mode=TemplatedParent}}" />
                            </Grid>
                        </Viewbox>

                        <Rectangle x:Name="rightLine"
                                   Grid.Column="2"
                                   Height="2"
                                   Margin="-1 0"
                                   Fill="{TemplateBinding Foreground}" />

                        <ContentPresenter x:Name="contentPresenter"
                                          Grid.Row="1"
                                          Grid.ColumnSpan="3"
                                          Margin="0 6 0 0"
                                          HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                          Focusable="False"
                                          RecognizesAccessKey="True"
                                          SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" />

                        <!--  description  -->
                        <TextBlock x:Name="descriptionText"
                                   Grid.Row="2"
                                   Grid.ColumnSpan="3"
                                   Margin="0 6 0 0"
                                   HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                   Focusable="False"
                                   FontSize="12"
                                   FontWeight="Normal"
                                   Text="{TemplateBinding Description}" />

                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="ViewStates">
                                <VisualState x:Name="Waiting" />
                                <VisualState x:Name="Underway" />
                                <VisualState x:Name="Completed" />
                                <VisualState x:Name="Finished" />
                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>
                    </Grid>
                    <ControlTemplate.Triggers>
                        <DataTrigger Binding="{Binding Text, ElementName=descriptionText, Converter={StaticResource IsNullOrEmptyConverter}}" Value="True">
                            <Setter TargetName="descriptionText" Property="Visibility" Value="Collapsed" />
                        </DataTrigger>
                        <Trigger Property="IsFirst" Value="True">
                            <Setter TargetName="leftLine" Property="Visibility" Value="Collapsed" />
                        </Trigger>
                        <Trigger Property="IsFirst" Value="False">
                            <Setter TargetName="leftLine" Property="Visibility" Value="Visible" />
                        </Trigger>
                        <Trigger Property="IsLast" Value="True">
                            <Setter TargetName="rightLine" Property="Visibility" Value="Collapsed" />
                        </Trigger>
                        <Trigger Property="IsLast" Value="False">
                            <Setter TargetName="rightLine" Property="Visibility" Value="Visible" />
                        </Trigger>
                        <Trigger Property="HorizontalContentAlignment" Value="Left">
                            <Setter TargetName="contentPresenter" Property="Grid.Column" Value="1" />
                            <Setter TargetName="contentPresenter" Property="Grid.ColumnSpan" Value="2" />
                            <Setter TargetName="descriptionText" Property="Grid.Column" Value="1" />
                            <Setter TargetName="descriptionText" Property="Grid.ColumnSpan" Value="2" />
                        </Trigger>
                        <Trigger Property="HorizontalContentAlignment" Value="Right">
                            <Setter TargetName="contentPresenter" Property="Grid.Column" Value="0" />
                            <Setter TargetName="contentPresenter" Property="Grid.ColumnSpan" Value="2" />
                            <Setter TargetName="descriptionText" Property="Grid.Column" Value="0" />
                            <Setter TargetName="descriptionText" Property="Grid.ColumnSpan" Value="2" />
                        </Trigger>
                        <Trigger Property="IsWaiting" Value="True">
                            <Setter Property="Foreground" Value="{DynamicResource SeconarydText}" />
                        </Trigger>
                        <Trigger Property="IsUnderway" Value="True">
                            <Setter TargetName="rightLine" Property="Fill" Value="{DynamicResource SeconarydText}" />
                            <Setter TargetName="indexText" Property="Foreground" Value="{Binding Path=(bpa:ControlHelper.FocusedForegroundBrush), RelativeSource={RelativeSource Mode=TemplatedParent}}" />
                        </Trigger>
                        <Trigger Property="IsCompleted" Value="True">
                            <Setter Property="Foreground" Value="{Binding Path=(bpa:ControlHelper.FocusedBrush), RelativeSource={RelativeSource Self}}" />
                            <Setter TargetName="indexText" Property="Foreground" Value="{Binding Path=(bpa:ControlHelper.FocusedForegroundBrush), RelativeSource={RelativeSource Mode=TemplatedParent}}" />
                            <Setter TargetName="rightLine" Property="Fill" Value="{Binding Foreground, RelativeSource={RelativeSource AncestorType=bpa:StepBar}}" />
                        </Trigger>
                        <Trigger Property="IsFinished" Value="True">
                            <Setter TargetName="indexText" Property="Foreground" Value="{Binding Path=(bpa:ControlHelper.FocusedForegroundBrush), RelativeSource={RelativeSource Mode=TemplatedParent}}" />
                            <Setter Property="Foreground" Value="{Binding Path=(bpa:ControlHelper.FocusedBrush), RelativeSource={RelativeSource Self}}" />
                        </Trigger>
                        <DataTrigger Binding="{Binding IconType, RelativeSource={RelativeSource Mode=Self}, Converter={StaticResource NotNullConverter}}" Value="False">
                            <Setter TargetName="icon" Property="Type" Value="CheckboxBlankCircleFill" />
                        </DataTrigger>
                        <DataTrigger Binding="{Binding IconType, RelativeSource={RelativeSource Mode=Self}, Converter={StaticResource NotNullConverter}}" Value="True">
                            <Setter TargetName="indexText" Property="Visibility" Value="Collapsed" />
                        </DataTrigger>
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding IconType, RelativeSource={RelativeSource Mode=Self}, Converter={StaticResource NotNullConverter}}" Value="False" />
                                <Condition Binding="{Binding IsCompleted, RelativeSource={RelativeSource Mode=Self}}" Value="True" />
                            </MultiDataTrigger.Conditions>
                            <Setter TargetName="indexText" Property="Visibility" Value="Collapsed" />
                            <Setter TargetName="icon" Property="Type" Value="CheckboxCircleFill" />
                        </MultiDataTrigger>
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding IconType, RelativeSource={RelativeSource Mode=Self}, Converter={StaticResource NotNullConverter}}" Value="False" />
                                <Condition Binding="{Binding IsFinished, RelativeSource={RelativeSource Mode=Self}}" Value="True" />
                            </MultiDataTrigger.Conditions>
                            <Setter TargetName="indexText" Property="Visibility" Value="Collapsed" />
                            <Setter TargetName="icon" Property="Type" Value="CheckboxCircleFill" />
                        </MultiDataTrigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    <Style x:Key="VerticalStepBarItem"
           BasedOn="{StaticResource HorizontalStepBarItem}"
           TargetType="{x:Type bpa:StepBarItem}">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type bpa:StepBarItem}">
                    <Grid>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="35" />
                            <ColumnDefinition Width="Auto" />
                        </Grid.ColumnDefinitions>
                        <Grid.RowDefinitions>
                            <RowDefinition Height="*" />
                            <RowDefinition Height="Auto" />
                            <RowDefinition Height="*" />
                        </Grid.RowDefinitions>

                        <Rectangle x:Name="topLine"
                                   Width="2"
                                   Margin="0 -1"
                                   Fill="{TemplateBinding Foreground}" />

                        <Viewbox Grid.Row="1" Focusable="False">
                            <Grid>
                                <bpa:Icon x:Name="icon"
                                          Width="35"
                                          Height="35"
                                          Type="{TemplateBinding IconType}" />

                                <TextBlock x:Name="indexText"
                                           HorizontalAlignment="Center"
                                           VerticalAlignment="Center"
                                           FontSize="13"
                                           Foreground="{Binding Path=(bpa:ControlHelper.FocusedForegroundBrush), RelativeSource={RelativeSource Mode=TemplatedParent}}"
                                           Text="{Binding Index, RelativeSource={RelativeSource Mode=TemplatedParent}}" />
                            </Grid>
                        </Viewbox>

                        <Rectangle x:Name="bottomLine"
                                   Grid.Row="2"
                                   Width="2"
                                   Margin="0 -1"
                                   Fill="{TemplateBinding Foreground}" />

                        <StackPanel x:Name="contentPanel"
                                    Grid.Row="1"
                                    Grid.RowSpan="2"
                                    Grid.Column="1"
                                    Margin="6 0 0 0"
                                    VerticalAlignment="Top">
                            <ContentPresenter x:Name="contentPresenter"
                                              Focusable="False"
                                              RecognizesAccessKey="True"
                                              SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" />

                            <!--  description  -->
                            <TextBlock x:Name="descriptionText"
                                       Margin="0 6 0 0"
                                       Focusable="False"
                                       FontSize="12"
                                       FontWeight="Normal"
                                       Text="{TemplateBinding Description}" />
                        </StackPanel>

                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="ViewStates">
                                <VisualState x:Name="Waiting" />
                                <VisualState x:Name="Underway" />
                                <VisualState x:Name="Completed" />
                                <VisualState x:Name="Finished" />
                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>
                    </Grid>
                    <ControlTemplate.Triggers>
                        <DataTrigger Binding="{Binding Text, ElementName=descriptionText, Converter={StaticResource IsNullOrEmptyConverter}}" Value="True">
                            <Setter TargetName="descriptionText" Property="Visibility" Value="Collapsed" />
                        </DataTrigger>
                        <Trigger Property="IsFirst" Value="True">
                            <Setter TargetName="topLine" Property="Visibility" Value="Collapsed" />
                        </Trigger>
                        <Trigger Property="IsFirst" Value="False">
                            <Setter TargetName="topLine" Property="Visibility" Value="Visible" />
                        </Trigger>
                        <Trigger Property="IsLast" Value="True">
                            <Setter TargetName="bottomLine" Property="Visibility" Value="Collapsed" />
                        </Trigger>
                        <Trigger Property="IsLast" Value="False">
                            <Setter TargetName="bottomLine" Property="Visibility" Value="Visible" />
                        </Trigger>
                        <Trigger Property="VerticalContentAlignment" Value="Top">
                            <Setter TargetName="contentPanel" Property="Grid.Row" Value="0" />
                            <Setter TargetName="contentPanel" Property="Grid.RowSpan" Value="3" />
                        </Trigger>
                        <Trigger Property="VerticalContentAlignment" Value="Bottom">
                            <Setter TargetName="contentPanel" Property="Grid.Row" Value="2" />
                            <Setter TargetName="contentPanel" Property="Grid.RowSpan" Value="1" />
                        </Trigger>
                        <Trigger Property="IsWaiting" Value="True">
                            <Setter Property="Foreground" Value="{DynamicResource SeconarydText}" />
                        </Trigger>
                        <Trigger Property="IsUnderway" Value="True">
                            <Setter TargetName="bottomLine" Property="Fill" Value="{DynamicResource SeconarydText}" />
                            <Setter TargetName="indexText" Property="Foreground" Value="{Binding Path=(bpa:ControlHelper.FocusedForegroundBrush), RelativeSource={RelativeSource Mode=TemplatedParent}}" />
                        </Trigger>
                        <Trigger Property="IsCompleted" Value="True">
                            <Setter Property="Foreground" Value="{Binding Path=(bpa:ControlHelper.FocusedBrush), RelativeSource={RelativeSource Self}}" />
                            <Setter TargetName="indexText" Property="Foreground" Value="{Binding Path=(bpa:ControlHelper.FocusedForegroundBrush), RelativeSource={RelativeSource Mode=TemplatedParent}}" />
                            <Setter TargetName="bottomLine" Property="Fill" Value="{Binding Foreground, RelativeSource={RelativeSource AncestorType=bpa:StepBar}}" />
                        </Trigger>
                        <Trigger Property="IsFinished" Value="True">
                            <Setter TargetName="indexText" Property="Foreground" Value="{Binding Path=(bpa:ControlHelper.FocusedForegroundBrush), RelativeSource={RelativeSource Mode=TemplatedParent}}" />
                            <Setter Property="Foreground" Value="{Binding Path=(bpa:ControlHelper.FocusedBrush), RelativeSource={RelativeSource Self}}" />
                        </Trigger>
                        <DataTrigger Binding="{Binding IconType, RelativeSource={RelativeSource Mode=Self}, Converter={StaticResource NotNullConverter}}" Value="False">
                            <Setter TargetName="icon" Property="Type" Value="CheckboxBlankCircleFill" />
                        </DataTrigger>
                        <DataTrigger Binding="{Binding IconType, RelativeSource={RelativeSource Mode=Self}, Converter={StaticResource NotNullConverter}}" Value="True">
                            <Setter TargetName="indexText" Property="Visibility" Value="Collapsed" />
                        </DataTrigger>
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding IconType, RelativeSource={RelativeSource Mode=Self}, Converter={StaticResource NotNullConverter}}" Value="False" />
                                <Condition Binding="{Binding IsCompleted, RelativeSource={RelativeSource Mode=Self}}" Value="True" />
                            </MultiDataTrigger.Conditions>
                            <Setter TargetName="indexText" Property="Visibility" Value="Collapsed" />
                            <Setter TargetName="icon" Property="Type" Value="CheckboxCircleFill" />
                        </MultiDataTrigger>
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding IconType, RelativeSource={RelativeSource Mode=Self}, Converter={StaticResource NotNullConverter}}" Value="False" />
                                <Condition Binding="{Binding IsFinished, RelativeSource={RelativeSource Mode=Self}}" Value="True" />
                            </MultiDataTrigger.Conditions>
                            <Setter TargetName="indexText" Property="Visibility" Value="Collapsed" />
                            <Setter TargetName="icon" Property="Type" Value="CheckboxCircleFill" />
                        </MultiDataTrigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    <Style x:Key="RubyerStepBar" TargetType="{x:Type bpa:StepBar}">
        <Setter Property="Foreground" Value="{DynamicResource DefaultForeground}" />
        <Setter Property="SnapsToDevicePixels" Value="True" />
        <Setter Property="VerticalContentAlignment" Value="Center" />
        <Setter Property="HorizontalContentAlignment" Value="Center" />
        <Setter Property="ItemContainerStyle" Value="{StaticResource HorizontalStepBarItem}" />
        <Setter Property="bpa:ControlHelper.FocusedBrush" Value="{DynamicResource Primary}" />
        <Setter Property="bpa:ControlHelper.FocusedForegroundBrush" Value="{DynamicResource DefaultBackground}" />
        <Setter Property="FontSize" Value="16" />
        <Setter Property="ItemsPanel">
            <Setter.Value>
                <ItemsPanelTemplate>
                    <UniformGrid Rows="1" />
                </ItemsPanelTemplate>
            </Setter.Value>
        </Setter>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type bpa:StepBar}">
                    <Border Background="{TemplateBinding Background}"
                            BorderBrush="{TemplateBinding BorderBrush}"
                            BorderThickness="{TemplateBinding BorderThickness}">
                        <ItemsPresenter SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" />
                    </Border>
                    <ControlTemplate.Triggers>
                        <Trigger Property="Orientation" Value="Vertical">
                            <Setter Property="ItemContainerStyle" Value="{StaticResource VerticalStepBarItem}" />
                            <Setter Property="ItemsPanel">
                                <Setter.Value>
                                    <ItemsPanelTemplate>
                                        <UniformGrid Columns="1" />
                                    </ItemsPanelTemplate>
                                </Setter.Value>
                            </Setter>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</ResourceDictionary>