PsUi

1.1.1

resources/xaml/styles/CommonStyles.xaml

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                    xmlns:sys="clr-namespace:System;assembly=mscorlib">
 
    <!-- Fallback value for DisabledOpacity (themes override this dynamically) -->
    <sys:Double x:Key="DisabledOpacity">0.4</sys:Double>
 
    <Style x:Key="ModernLabelStyle" TargetType="Label">
        <Setter Property="Foreground" Value="{DynamicResource ControlForegroundBrush}"/>
        <Setter Property="FontFamily" Value="Segoe UI"/>
        <Setter Property="FontSize" Value="12"/>
        <Setter Property="Padding" Value="0,4,0,4"/>
    </Style>
 
    <Style x:Key="SecondaryLabelStyle" TargetType="Label" BasedOn="{StaticResource ModernLabelStyle}">
        <Setter Property="Foreground" Value="{DynamicResource SecondaryTextBrush}"/>
        <Setter Property="FontSize" Value="11"/>
    </Style>
 
    <Style x:Key="HeaderLabelStyle" TargetType="Label" BasedOn="{StaticResource ModernLabelStyle}">
        <Setter Property="FontSize" Value="14"/>
        <Setter Property="FontWeight" Value="SemiBold"/>
        <Setter Property="Padding" Value="0,8,0,8"/>
    </Style>
 
    <Style x:Key="ModernCheckBoxStyle" TargetType="CheckBox">
        <Setter Property="Foreground" Value="{DynamicResource ControlForegroundBrush}"/>
        <Setter Property="FontFamily" Value="Segoe UI"/>
        <Setter Property="FontSize" Value="12"/>
        <Setter Property="Padding" Value="6,0,0,0"/>
    </Style>
 
    <Style x:Key="ModernRadioButtonStyle" TargetType="RadioButton">
        <Setter Property="Foreground" Value="{DynamicResource ControlForegroundBrush}"/>
        <Setter Property="FontFamily" Value="Segoe UI"/>
        <Setter Property="FontSize" Value="12"/>
        <Setter Property="Padding" Value="6,0,0,0"/>
    </Style>
 
    <Style x:Key="ModernComboBoxStyle" TargetType="ComboBox">
        <Setter Property="Background" Value="{DynamicResource ControlBackgroundBrush}"/>
        <Setter Property="Foreground" Value="{DynamicResource ControlForegroundBrush}"/>
        <Setter Property="BorderBrush" Value="{DynamicResource BorderBrush}"/>
        <Setter Property="BorderThickness" Value="1"/>
        <Setter Property="Padding" Value="8,6,8,6"/>
        <Setter Property="FontFamily" Value="Segoe UI"/>
        <Setter Property="FontSize" Value="12"/>
    </Style>
 
    <Style x:Key="ModernSeparatorStyle" TargetType="Separator">
        <Setter Property="Background" Value="{DynamicResource BorderBrush}"/>
        <Setter Property="Height" Value="1"/>
        <Setter Property="Margin" Value="0,8,0,8"/>
    </Style>
 
    <Style x:Key="ModernProgressBarStyle" TargetType="ProgressBar">
        <Setter Property="Background" Value="{DynamicResource ControlBackgroundBrush}"/>
        <Setter Property="Foreground" Value="{DynamicResource AccentBrush}"/>
        <Setter Property="BorderBrush" Value="{DynamicResource BorderBrush}"/>
        <Setter Property="BorderThickness" Value="1"/>
        <Setter Property="Height" Value="6"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="ProgressBar">
                    <Border Background="{TemplateBinding Background}"
                            BorderBrush="{TemplateBinding BorderBrush}"
                            BorderThickness="{TemplateBinding BorderThickness}"
                            CornerRadius="3"
                            ClipToBounds="True">
                        <Grid>
                            <Border x:Name="PART_Track"/>
                            <!-- Determinate indicator -->
                            <Border x:Name="PART_Indicator"
                                    Background="{TemplateBinding Foreground}"
                                    HorizontalAlignment="Left"
                                    CornerRadius="3"/>
                            <!-- Indeterminate animated bar -->
                            <Border x:Name="IndeterminateIndicator"
                                    Background="{TemplateBinding Foreground}"
                                    Width="80"
                                    CornerRadius="3"
                                    Visibility="Collapsed"
                                    HorizontalAlignment="Left">
                                <Border.RenderTransform>
                                    <TranslateTransform x:Name="IndeterminateTransform"/>
                                </Border.RenderTransform>
                            </Border>
                        </Grid>
                    </Border>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsIndeterminate" Value="True">
                            <Setter TargetName="PART_Indicator" Property="Visibility" Value="Collapsed"/>
                            <Setter TargetName="IndeterminateIndicator" Property="Visibility" Value="Visible"/>
                            <Trigger.EnterActions>
                                <BeginStoryboard x:Name="IndeterminateStoryboard">
                                    <Storyboard RepeatBehavior="Forever">
                                        <DoubleAnimation
                                            Storyboard.TargetName="IndeterminateTransform"
                                            Storyboard.TargetProperty="X"
                                            From="-80" To="400"
                                            Duration="0:0:1.5"/>
                                    </Storyboard>
                                </BeginStoryboard>
                            </Trigger.EnterActions>
                            <Trigger.ExitActions>
                                <StopStoryboard BeginStoryboardName="IndeterminateStoryboard"/>
                            </Trigger.ExitActions>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
 
    <!-- Implicit style for ListBoxItem (no x:Key) - applies to all ListBoxItem controls automatically -->
    <Style TargetType="ListBoxItem">
        <Setter Property="SnapsToDevicePixels" Value="True"/>
        <Setter Property="Padding" Value="8,6"/>
        <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
        <Setter Property="VerticalContentAlignment" Value="Center"/>
        <Setter Property="Background" Value="Transparent"/>
        <Setter Property="BorderBrush" Value="Transparent"/>
        <Setter Property="BorderThickness" Value="0"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="ListBoxItem">
                    <Border x:Name="Bd"
                            Background="{TemplateBinding Background}"
                            BorderBrush="{TemplateBinding BorderBrush}"
                            BorderThickness="{TemplateBinding BorderThickness}"
                            Padding="{TemplateBinding Padding}"
                            SnapsToDevicePixels="true"
                            CornerRadius="2">
                        <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                          VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                                          SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
                    </Border>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsMouseOver" Value="True">
                            <Setter TargetName="Bd" Property="Background" Value="{DynamicResource ItemHoverBrush}"/>
                            <!-- Hover uses control foreground since ItemHover is a subtle background -->
                        </Trigger>
                        <Trigger Property="IsSelected" Value="True">
                            <Setter TargetName="Bd" Property="Background" Value="{DynamicResource SelectionBackgroundBrush}"/>
                            <Setter Property="Foreground" Value="{DynamicResource SelectionForegroundBrush}"/>
                        </Trigger>
                        <Trigger Property="IsEnabled" Value="False">
                            <Setter Property="Foreground" Value="{DynamicResource DisabledForegroundBrush}"/>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
 
    <Style x:Key="ModernListBoxStyle" TargetType="ListBox">
        <Setter Property="Background" Value="{DynamicResource ControlBackgroundBrush}"/>
        <Setter Property="Foreground" Value="{DynamicResource ControlForegroundBrush}"/>
        <Setter Property="BorderBrush" Value="{DynamicResource BorderBrush}"/>
        <Setter Property="BorderThickness" Value="1"/>
        <Setter Property="FontFamily" Value="Segoe UI"/>
        <Setter Property="FontSize" Value="12"/>
        <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto"/>
        <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto"/>
        <Setter Property="ScrollViewer.CanContentScroll" Value="True"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="ListBox">
                    <Border x:Name="Bd"
                            Background="{TemplateBinding Background}"
                            BorderBrush="{TemplateBinding BorderBrush}"
                            BorderThickness="{TemplateBinding BorderThickness}"
                            SnapsToDevicePixels="True">
                        <ScrollViewer Focusable="False" Padding="{TemplateBinding Padding}">
                            <ItemsPresenter SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
                        </ScrollViewer>
                    </Border>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsEnabled" Value="False">
                            <Setter TargetName="Bd" Property="Background" Value="{DynamicResource ControlBackgroundBrush}"/>
                            <Setter TargetName="Bd" Property="BorderBrush" Value="{DynamicResource DisabledForegroundBrush}"/>
                            <Setter Property="Foreground" Value="{DynamicResource DisabledForegroundBrush}"/>
                            <Setter Property="Opacity" Value="{DynamicResource DisabledOpacity}"/>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
 
    <!-- Expander toggle button for TreeViewItem - must be defined before TreeViewItem style -->
    <Style x:Key="TreeViewExpanderStyle" TargetType="ToggleButton">
        <Setter Property="Focusable" Value="False"/>
        <Setter Property="Width" Value="16"/>
        <Setter Property="Height" Value="16"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="ToggleButton">
                    <Border Background="Transparent" Width="16" Height="16">
                        <Path x:Name="ExpandPath"
                              HorizontalAlignment="Center"
                              VerticalAlignment="Center"
                              Fill="{DynamicResource ControlForegroundBrush}"
                              Data="M 0 2 L 4 6 L 8 2 Z"
                              RenderTransformOrigin="0.5,0.5">
                            <Path.RenderTransform>
                                <RotateTransform Angle="-90"/>
                            </Path.RenderTransform>
                        </Path>
                    </Border>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsChecked" Value="True">
                            <Setter TargetName="ExpandPath" Property="RenderTransform">
                                <Setter.Value>
                                    <RotateTransform Angle="0"/>
                                </Setter.Value>
                            </Setter>
                        </Trigger>
                        <Trigger Property="IsMouseOver" Value="True">
                            <Setter TargetName="ExpandPath" Property="Fill" Value="{DynamicResource AccentBrush}"/>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
 
    <!-- Implicit style for TreeViewItem - applies to all TreeViewItem controls automatically -->
    <Style TargetType="TreeViewItem">
        <Setter Property="Background" Value="Transparent"/>
        <Setter Property="Foreground" Value="{DynamicResource ControlForegroundBrush}"/>
        <Setter Property="FontWeight" Value="Normal"/>
        <Setter Property="HorizontalContentAlignment" Value="Left"/>
        <Setter Property="VerticalContentAlignment" Value="Center"/>
        <Setter Property="Padding" Value="4,2"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="TreeViewItem">
                    <Grid>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition MinWidth="16" Width="Auto"/>
                            <ColumnDefinition Width="*"/>
                        </Grid.ColumnDefinitions>
                        <Grid.RowDefinitions>
                            <RowDefinition Height="Auto"/>
                            <RowDefinition/>
                        </Grid.RowDefinitions>
                        <!-- Expand/collapse toggle button -->
                        <ToggleButton x:Name="Expander"
                                      ClickMode="Press"
                                      IsChecked="{Binding IsExpanded, RelativeSource={RelativeSource TemplatedParent}}"
                                      Style="{StaticResource TreeViewExpanderStyle}"/>
                        <!-- Header content with selection background -->
                        <Border x:Name="Bd"
                                Grid.Column="1"
                                Background="{TemplateBinding Background}"
                                BorderBrush="{TemplateBinding BorderBrush}"
                                BorderThickness="{TemplateBinding BorderThickness}"
                                Padding="{TemplateBinding Padding}"
                                CornerRadius="2"
                                SnapsToDevicePixels="True">
                            <ContentPresenter x:Name="PART_Header"
                                              ContentSource="Header"
                                              HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"/>
                        </Border>
                        <!-- Child items panel -->
                        <ItemsPresenter x:Name="ItemsHost"
                                        Grid.Row="1"
                                        Grid.Column="1"/>
                    </Grid>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsExpanded" Value="False">
                            <Setter TargetName="ItemsHost" Property="Visibility" Value="Collapsed"/>
                        </Trigger>
                        <Trigger Property="HasItems" Value="False">
                            <Setter TargetName="Expander" Property="Visibility" Value="Hidden"/>
                        </Trigger>
                        <Trigger Property="IsMouseOver" Value="True" SourceName="Bd">
                            <Setter TargetName="Bd" Property="Background" Value="{DynamicResource ItemHoverBrush}"/>
                        </Trigger>
                        <Trigger Property="IsSelected" Value="True">
                            <Setter TargetName="Bd" Property="Background" Value="{DynamicResource SelectionBackgroundBrush}"/>
                            <Setter Property="Foreground" Value="{DynamicResource SelectionForegroundBrush}"/>
                        </Trigger>
                        <MultiTrigger>
                            <MultiTrigger.Conditions>
                                <Condition Property="IsSelected" Value="True"/>
                                <Condition Property="IsSelectionActive" Value="False"/>
                            </MultiTrigger.Conditions>
                            <Setter TargetName="Bd" Property="Background" Value="{DynamicResource ItemHoverBrush}"/>
                            <Setter Property="Foreground" Value="{DynamicResource ControlForegroundBrush}"/>
                        </MultiTrigger>
                        <Trigger Property="IsEnabled" Value="False">
                            <Setter Property="Foreground" Value="{DynamicResource DisabledForegroundBrush}"/>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
 
    <!-- Modern TreeView style -->
    <!-- Prebuilt TreeViewItems virtualize ok. A TreeView leaves IsVirtualizing off unless the style asks, and CanContentScroll was set False below. Either one alone realised all 2500 nodes, against 49 with both on.
         Standard mode, not Recycling, since every container is a permanent per node object. Pixel scroll unit keeps the kinda feel. -->
    <Style x:Key="ModernTreeViewStyle" TargetType="TreeView">
        <Setter Property="Background" Value="{DynamicResource ControlBackgroundBrush}"/>
        <Setter Property="Foreground" Value="{DynamicResource ControlForegroundBrush}"/>
        <Setter Property="BorderBrush" Value="{DynamicResource BorderBrush}"/>
        <Setter Property="BorderThickness" Value="1"/>
        <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto"/>
        <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto"/>
        <Setter Property="VirtualizingStackPanel.IsVirtualizing" Value="True"/>
        <Setter Property="VirtualizingStackPanel.VirtualizationMode" Value="Standard"/>
        <Setter Property="VirtualizingStackPanel.ScrollUnit" Value="Pixel"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="TreeView">
                    <Border x:Name="Bd"
                            Background="{TemplateBinding Background}"
                            BorderBrush="{TemplateBinding BorderBrush}"
                            BorderThickness="{TemplateBinding BorderThickness}"
                            SnapsToDevicePixels="True">
                        <ScrollViewer x:Name="TV_ScrollViewer_"
                                      Focusable="False"
                                      CanContentScroll="True"
                                      Padding="{TemplateBinding Padding}">
                            <ItemsPresenter/>
                        </ScrollViewer>
                    </Border>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsEnabled" Value="False">
                            <Setter TargetName="Bd" Property="Background" Value="{DynamicResource ControlBackgroundBrush}"/>
                            <Setter Property="Foreground" Value="{DynamicResource DisabledForegroundBrush}"/>
                            <Setter Property="Opacity" Value="{DynamicResource DisabledOpacity}"/>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
 
</ResourceDictionary>