PsUi

1.0.0

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 -->
    <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="VirtualizingPanel.IsVirtualizing" Value="True"/>
        <Setter Property="VirtualizingPanel.VirtualizationMode" Value="Recycling"/>
        <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="False"
                                      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>