WPF 动态实现换肤功能

于 2022-08-30 20:37:55 发布
阅读量1.2k 收藏 5
点赞数
分类专栏： WPF 文章标签： wpf
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/hdylove/article/details/126611400
版权

在WPF软件产品开发过程中，要求具有换肤功能，那么如何实现呢?

一、设计思路   

需求：点击【换肤】功能按键后，实现程序皮肤切换。

思路： 

    （1） 首先将表单样式，包括用到的控件样式，同一色调的归类为一个样式文件夹或文件。
多个主题肤色，则对应多个样式文件夹及文件。

   （2） 实现换肤功能，用c# 动态加载Xaml样式文件来实现换肤。

二、功能实现

     在项目工程中增加一个文件夹 Skin，里面放入了两个样式文件。

    在本案例中，不同主题各自对应一个独立的样式文件，  样式文件中包括了程序表单中用到的窗体样式、色调、各控件样式。

SkinTheme1.xaml  为 浅色（白）主题文件
SkinTheme2.xaml  为 深色（黑）主题文件

以TabControl控件为例，实现浅色及深色主题文件如下：

  • SkinTheme1.xaml  为 浅色（白）主题文件
  
 
    <SolidColorBrush x:Key="TabItem.Disabled.Background" Color="#F0F0F0"/>
    <SolidColorBrush x:Key="TabItem.Disabled.Border" Color="#D9D9D9"/>
    <SolidColorBrush x:Key="TabItem.Selected.Background" Color="#FFFFFF"/>
    <SolidColorBrush x:Key="TabItem.Selected.Border" Color="#ACACAC"/>
    <Style x:Key="TabControlStyle1" TargetType="{x:Type TabControl}">
        <Setter Property="Padding" Value="2"/>
        <Setter Property="HorizontalContentAlignment" Value="Center"/>
        <Setter Property="VerticalContentAlignment" Value="Center"/>
        <Setter Property="Background" Value="{StaticResource TabItem.Selected.Background}"/>
        <Setter Property="BorderBrush" Value="{StaticResource TabItem.Selected.Border}"/>
        <Setter Property="BorderThickness" Value="1"/>
        <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type TabControl}">
                    <Grid x:Name="templateRoot" ClipToBounds="true" SnapsToDevicePixels="true" KeyboardNavigation.TabNavigation="Local">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition x:Name="ColumnDefinition0"/>
                            <ColumnDefinition x:Name="ColumnDefinition1" Width="0"/>
                        </Grid.ColumnDefinitions>
                        <Grid.RowDefinitions>
                            <RowDefinition x:Name="RowDefinition0" Height="Auto"/>
                            <RowDefinition x:Name="RowDefinition1" Height="*"/>
                        </Grid.RowDefinitions>
                        <TabPanel x:Name="headerPanel" Background="Transparent" Grid.Column="0" IsItemsHost="true" Margin="0,2,0,0" Grid.Row="0" KeyboardNavigation.TabIndex="1" Panel.ZIndex="1"/>
                        <Border x:Name="contentPanel" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Grid.Column="0" KeyboardNavigation.DirectionalNavigation="Contained" Grid.Row="1" KeyboardNavigation.TabIndex="2" KeyboardNavigation.TabNavigation="Local">
                            <ContentPresenter x:Name="PART_SelectedContentHost" ContentSource="SelectedContent" Margin="{TemplateBinding Padding}" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
                        </Border>
                    </Grid>
                    <ControlTemplate.Triggers>
                        <Trigger Property="TabStripPlacement" Value="Bottom">
                            <Setter Property="Grid.Row" TargetName="headerPanel" Value="1"/>
                            <Setter Property="Grid.Row" TargetName="contentPanel" Value="0"/>
                            <Setter Property="Height" TargetName="RowDefinition0" Value="*"/>
                            <Setter Property="Height" TargetName="RowDefinition1" Value="Auto"/>
                            <Setter Property="Margin" TargetName="headerPanel" Value="2,0,2,2"/>
                        </Trigger>
                        <Trigger Property="TabStripPlacement" Value="Left">
                            <Setter Property="Grid.Row" TargetName="headerPanel" Value="0"/>
                            <Setter Property="Grid.Row" TargetName="contentPanel" Value="0"/>
                            <Setter Property="Grid.Column" TargetName="headerPanel" Value="0"/>
                            <Setter Property="Grid.Column" TargetName="contentPanel" Value="1"/>
                            <Setter Property="Width" TargetName="ColumnDefinition0" Value="Auto"/>
                            <Setter Property="Width" TargetName="ColumnDefinition1" Value="*"/>
                            <Setter Property="Height" TargetName="RowDefinition0" Value="*"/>
                            <Setter Property="Height" TargetName="RowDefinition1" Value="0"/>
                            <Setter Property="Margin" TargetName="headerPanel" Value="2,2,0,2"/>
                        </Trigger>
                        <Trigger Property="TabStripPlacement" Value="Right">
                            <Setter Property="Grid.Row" TargetName="headerPanel" Value="0"/>
                            <Setter Property="Grid.Row" TargetName="contentPanel" Value="0"/>
                            <Setter Property="Grid.Column" TargetName="headerPanel" Value="1"/>
                            <Setter Property="Grid.Column" TargetName="contentPanel" Value="0"/>
                            <Setter Property="Width" TargetName="ColumnDefinition0" Value="*"/>
                            <Setter Property="Width" TargetName="ColumnDefinition1" Value="Auto"/>
                            <Setter Property="Height" TargetName="RowDefinition0" Value="*"/>
                            <Setter Property="Height" TargetName="RowDefinition1" Value="0"/>
                            <Setter Property="Margin" TargetName="headerPanel" Value="0,2,2,2"/>
                        </Trigger>
                        <Trigger Property="IsEnabled" Value="false">
                            <Setter Property="TextElement.Foreground" TargetName="templateRoot" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
    <Style x:Key="TabItemStyle1" TargetType="{x:Type TabItem}">
        <Setter Property="FocusVisualStyle" Value="{StaticResource FocusVisual}"/>
        <Setter Property="Width"  Value="88.7"/>
        <Setter Property="Foreground"  Value="#FF566091"/>
        <Setter Property="Background" Value="{StaticResource TabItem.Static.Background}"/>
        <Setter Property="BorderBrush" Value="Transparent"/>
        <Setter Property="BorderThickness" Value="0"/>
        <Setter Property="Margin" Value="0,-2,0,0"/>
        <Setter Property="Padding" Value="6,10,6,10"/>
        <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
        <Setter Property="VerticalContentAlignment" Value="Stretch"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type TabItem}">
                    <Grid x:Name="templateRoot" SnapsToDevicePixels="true"   >
                        <Border x:Name="mainBorder" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="0,0,0,0" Margin="0">
                            <Border x:Name="innerBorder" Background="{StaticResource TabItem.Selected.Background}" BorderBrush="{x:Null}" BorderThickness="0,0,0,0" Margin="-1" Opacity="0"/>
                        </Border>
                        <ContentPresenter x:Name="contentPresenter" ContentSource="Header" Focusable="False" HorizontalAlignment="{Binding HorizontalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{Binding VerticalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}"/>
                    </Grid>
                    <ControlTemplate.Triggers>
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding IsMouseOver, RelativeSource={RelativeSource Self}}" Value="true"/>
                                <Condition Binding="{Binding TabStripPlacement, RelativeSource={RelativeSource AncestorType={x:Type TabControl}}}" Value="Left"/>
                            </MultiDataTrigger.Conditions>
                            <Setter Property="Background" TargetName="mainBorder" Value="{StaticResource TabItem.MouseOver.Background}"/>
                            <Setter Property="BorderBrush" TargetName="mainBorder" Value="{StaticResource TabItem.MouseOver.Border}"/>

                        </MultiDataTrigger>
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding IsMouseOver, RelativeSource={RelativeSource Self}}" Value="true"/>
                                <Condition Binding="{Binding TabStripPlacement, RelativeSource={RelativeSource AncestorType={x:Type TabControl}}}" Value="Bottom"/>
                            </MultiDataTrigger.Conditions>
                            <Setter Property="Background" TargetName="mainBorder" Value="{StaticResource TabItem.MouseOver.Background}"/>
                            <Setter Property="BorderBrush" TargetName="mainBorder" Value="{StaticResource TabItem.MouseOver.Border}"/>

                        </MultiDataTrigger>
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding IsMouseOver, RelativeSource={RelativeSource Self}}" Value="true"/>
                                <Condition Binding="{Binding TabStripPlacement, RelativeSource={RelativeSource AncestorType={x:Type TabControl}}}" Value="Right"/>
                            </MultiDataTrigger.Conditions>
                            <Setter Property="Background" TargetName="mainBorder" Value="{StaticResource TabItem.MouseOver.Background}"/>
                            <Setter Property="BorderBrush" TargetName="mainBorder" Value="{StaticResource TabItem.MouseOver.Border}"/>

                        </MultiDataTrigger>
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding IsMouseOver, RelativeSource={RelativeSource Self}}" Value="true"/>
                                <Condition Binding="{Binding TabStripPlacement, RelativeSource={RelativeSource AncestorType={x:Type TabControl}}}" Value="Top"/>
                            </MultiDataTrigger.Conditions>
                            <Setter Property="Background" TargetName="mainBorder" Value="{StaticResource TabItem.MouseOver.Background}"/>
                            <Setter Property="BorderBrush" TargetName="mainBorder" Value="{StaticResource TabItem.MouseOver.Border}"/>

                        </MultiDataTrigger>
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding IsEnabled, RelativeSource={RelativeSource Self}}" Value="false"/>
                                <Condition Binding="{Binding TabStripPlacement, RelativeSource={RelativeSource AncestorType={x:Type TabControl}}}" Value="Left"/>
                            </MultiDataTrigger.Conditions>
                            <Setter Property="Opacity" TargetName="contentPresenter" Value="0.56"/>
                            <Setter Property="Background" TargetName="mainBorder" Value="{StaticResource TabItem.Disabled.Background}"/>
                            <Setter Property="BorderBrush" TargetName="mainBorder" Value="{StaticResource TabItem.Disabled.Border}"/>

                        </MultiDataTrigger>
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding IsEnabled, RelativeSource={RelativeSource Self}}" Value="false"/>
                                <Condition Binding="{Binding TabStripPlacement, RelativeSource={RelativeSource AncestorType={x:Type TabControl}}}" Value="Bottom"/>
                            </MultiDataTrigger.Conditions>
                            <Setter Property="Opacity" TargetName="contentPresenter" Value="0.56"/>
                            <Setter Property="Background" TargetName="mainBorder" Value="{StaticResource TabItem.Disabled.Background}"/>
                            <Setter Property="BorderBrush" TargetName="mainBorder" Value="{StaticResource TabItem.Disabled.Border}"/>

                        </MultiDataTrigger>
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding IsEnabled, RelativeSource={RelativeSource Self}}" Value="false"/>
                                <Condition Binding="{Binding TabStripPlacement, RelativeSource={RelativeSource AncestorType={x:Type TabControl}}}" Value="Right"/>
                            </MultiDataTrigger.Conditions>
                            <Setter Property="Opacity" TargetName="contentPresenter" Value="0.56"/>
                            <Setter Property="Background" TargetName="mainBorder" Value="{StaticResource TabItem.Disabled.Background}"/>
                            <Setter Property="BorderBrush" TargetName="mainBorder" Value="{StaticResource TabItem.Disabled.Border}"/>

                        </MultiDataTrigger>
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding IsEnabled, RelativeSource={RelativeSource Self}}" Value="false"/>
                                <Condition Binding="{Binding TabStripPlacement, RelativeSource={RelativeSource AncestorType={x:Type TabControl}}}" Value="Top"/>
                            </MultiDataTrigger.Conditions>
                            <Setter Property="Opacity" TargetName="contentPresenter" Value="0.56"/>
                            <Setter Property="Background" TargetName="mainBorder" Value="{StaticResource TabItem.Disabled.Background}"/>
                            <Setter Property="BorderBrush" TargetName="mainBorder" Value="{StaticResource TabItem.Disabled.Border}"/>

                        </MultiDataTrigger>
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding IsSelected, RelativeSource={RelativeSource Self}}" Value="false"/>
                                <Condition Binding="{Binding TabStripPlacement, RelativeSource={RelativeSource AncestorType={x:Type TabControl}}}" Value="Left"/>
                            </MultiDataTrigger.Conditions>

                        </MultiDataTrigger>
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding IsSelected, RelativeSource={RelativeSource Self}}" Value="true"/>
                                <Condition Binding="{Binding TabStripPlacement, RelativeSource={RelativeSource AncestorType={x:Type TabControl}}}" Value="Left"/>
                            </MultiDataTrigger.Conditions>
                            <Setter Property="Panel.ZIndex" Value="1"/>
                            
                            <Setter Property="Opacity" TargetName="innerBorder" Value="1"/>
                            <Setter Property="Foreground" Value="#FF497CFF"/>

                        </MultiDataTrigger>
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding IsSelected, RelativeSource={RelativeSource Self}}" Value="false"/>
                                <Condition Binding="{Binding TabStripPlacement, RelativeSource={RelativeSource AncestorType={x:Type TabControl}}}" Value="Bottom"/>
                            </MultiDataTrigger.Conditions>

                        </MultiDataTrigger>
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding IsSelected, RelativeSource={RelativeSource Self}}" Value="true"/>
                                <Condition Binding="{Binding TabStripPlacement, RelativeSource={RelativeSource AncestorType={x:Type TabControl}}}" Value="Bottom"/>
                            </MultiDataTrigger.Conditions>
                            <Setter Property="Panel.ZIndex" Value="1"/>
                            
                            <Setter Property="Opacity" TargetName="innerBorder" Value="1"/>
                            <Setter Property="Foreground" Value="#FF497CFF"/>
                        </MultiDataTrigger>
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding IsSelected, RelativeSource={RelativeSource Self}}" Value="false"/>
                                <Condition Binding="{Binding TabStripPlacement, RelativeSource={RelativeSource AncestorType={x:Type TabControl}}}" Value="Right"/>
                            </MultiDataTrigger.Conditions>

                        </MultiDataTrigger>
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding IsSelected, RelativeSource={RelativeSource Self}}" Value="true"/>
                                <Condition Binding="{Binding TabStripPlacement, RelativeSource={RelativeSource AncestorType={x:Type TabControl}}}" Value="Right"/>
                            </MultiDataTrigger.Conditions>
                            <Setter Property="Panel.ZIndex" Value="1"/>
                          
                            <Setter Property="Opacity" TargetName="innerBorder" Value="1"/>
                            <Setter Property="Foreground" Value="#FF497CFF"/>

                        </MultiDataTrigger>
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding IsSelected, RelativeSource={RelativeSource Self}}" Value="false"/>
                                <Condition Binding="{Binding TabStripPlacement, RelativeSource={RelativeSource AncestorType={x:Type TabControl}}}" Value="Top"/>
                            </MultiDataTrigger.Conditions>

                        </MultiDataTrigger>
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding IsSelected, RelativeSource={RelativeSource Self}}" Value="true"/>
                                <Condition Binding="{Binding TabStripPlacement, RelativeSource={RelativeSource AncestorType={x:Type TabControl}}}" Value="Top"/>
                            </MultiDataTrigger.Conditions>
                            <Setter Property="Panel.ZIndex" Value="1"/>
                           
                            <Setter Property="Opacity" TargetName="innerBorder" Value="1"/>
                            <Setter Property="Foreground" Value="#FF497CFF"/>
                        </MultiDataTrigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
  • 在 SkinTheme2.xaml 中 以深黑色为主题咋i 
    

    <SolidColorBrush x:Key="TabItem.Selected.Background" Color="#FFFFFF"/>
    <SolidColorBrush x:Key="TabItem.Selected.Border" Color="#ACACAC"/>
    <Style x:Key="TabControlStyle1" TargetType="{x:Type TabControl}">
        <Setter Property="Padding" Value="2"/>
        <Setter Property="HorizontalContentAlignment" Value="Center"/>
        <Setter Property="VerticalContentAlignment" Value="Center"/>
        <Setter Property="Background" Value="#000000"/>
        <Setter Property="BorderBrush" Value="#000000"/>
        <Setter Property="BorderThickness" Value="0"/>
        <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type TabControl}">
                    <Grid x:Name="templateRoot" ClipToBounds="true" SnapsToDevicePixels="true" KeyboardNavigation.TabNavigation="Local">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition x:Name="ColumnDefinition0"/>
                            <ColumnDefinition x:Name="ColumnDefinition1" Width="0"/>
                        </Grid.ColumnDefinitions>
                        <Grid.RowDefinitions>
                            <RowDefinition x:Name="RowDefinition0" Height="Auto"/>
                            <RowDefinition x:Name="RowDefinition1" Height="*"/>
                        </Grid.RowDefinitions>
                        <TabPanel x:Name="headerPanel" Background="Transparent" Grid.Column="0" IsItemsHost="true" Margin="0,2,0,0" Grid.Row="0" KeyboardNavigation.TabIndex="1" Panel.ZIndex="1"/>
                        <Border x:Name="contentPanel" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Grid.Column="0" KeyboardNavigation.DirectionalNavigation="Contained" Grid.Row="1" KeyboardNavigation.TabIndex="2" KeyboardNavigation.TabNavigation="Local">
                            <ContentPresenter x:Name="PART_SelectedContentHost" ContentSource="SelectedContent" Margin="{TemplateBinding Padding}" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
                        </Border>
                    </Grid>
                    <ControlTemplate.Triggers>
                        <Trigger Property="TabStripPlacement" Value="Bottom">
                            <Setter Property="Grid.Row" TargetName="headerPanel" Value="1"/>
                            <Setter Property="Grid.Row" TargetName="contentPanel" Value="0"/>
                            <Setter Property="Height" TargetName="RowDefinition0" Value="*"/>
                            <Setter Property="Height" TargetName="RowDefinition1" Value="Auto"/>
                            <Setter Property="Margin" TargetName="headerPanel" Value="2,0,2,2"/>
                        </Trigger>
                        <Trigger Property="TabStripPlacement" Value="Left">
                            <Setter Property="Grid.Row" TargetName="headerPanel" Value="0"/>
                            <Setter Property="Grid.Row" TargetName="contentPanel" Value="0"/>
                            <Setter Property="Grid.Column" TargetName="headerPanel" Value="0"/>
                            <Setter Property="Grid.Column" TargetName="contentPanel" Value="1"/>
                            <Setter Property="Width" TargetName="ColumnDefinition0" Value="Auto"/>
                            <Setter Property="Width" TargetName="ColumnDefinition1" Value="*"/>
                            <Setter Property="Height" TargetName="RowDefinition0" Value="*"/>
                            <Setter Property="Height" TargetName="RowDefinition1" Value="0"/>
                            <Setter Property="Margin" TargetName="headerPanel" Value="2,2,0,2"/>
                        </Trigger>
                        <Trigger Property="TabStripPlacement" Value="Right">
                            <Setter Property="Grid.Row" TargetName="headerPanel" Value="0"/>
                            <Setter Property="Grid.Row" TargetName="contentPanel" Value="0"/>
                            <Setter Property="Grid.Column" TargetName="headerPanel" Value="1"/>
                            <Setter Property="Grid.Column" TargetName="contentPanel" Value="0"/>
                            <Setter Property="Width" TargetName="ColumnDefinition0" Value="*"/>
                            <Setter Property="Width" TargetName="ColumnDefinition1" Value="Auto"/>
                            <Setter Property="Height" TargetName="RowDefinition0" Value="*"/>
                            <Setter Property="Height" TargetName="RowDefinition1" Value="0"/>
                            <Setter Property="Margin" TargetName="headerPanel" Value="0,2,2,2"/>
                        </Trigger>
                        <Trigger Property="IsEnabled" Value="false">
                            <Setter Property="TextElement.Foreground" TargetName="templateRoot" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    <LinearGradientBrush x:Key="TabItem.Static.Background" EndPoint="0,1" StartPoint="0,0">
        <GradientStop Color="#F0F0F0" Offset="0.0"/>
        <GradientStop Color="#E5E5E5" Offset="1.0"/>
    </LinearGradientBrush>
    <SolidColorBrush x:Key="TabItem.Static.Border" Color="#ACACAC"/>
    <LinearGradientBrush x:Key="TabItem.MouseOver.Background" EndPoint="0,1" StartPoint="0,0">
        <GradientStop Color="#ECF4FC" Offset="0.0"/>
        <GradientStop Color="#DCECFC" Offset="1.0"/>
    </LinearGradientBrush>
    <SolidColorBrush x:Key="TabItem.MouseOver.Border" Color="#7EB4EA"/>


    <SolidColorBrush x:Key="TabItem.Disabled.Background" Color="#F0F0F0"/>
    <SolidColorBrush x:Key="TabItem.Disabled.Border" Color="#D9D9D9"/>
    <Style x:Key="TabItemStyle1" TargetType="{x:Type TabItem}">
        <Setter Property="FocusVisualStyle" Value="{StaticResource FocusVisual}"/>
        <Setter Property="Width"  Value="88.7"/>
        <Setter Property="Foreground"  Value="#FF566091"/>
        <Setter Property="Background" Value="#000000"/>
        <Setter Property="BorderBrush" Value="Transparent"/>
        <Setter Property="BorderThickness" Value="0"/>
        <Setter Property="Margin" Value="0,-2,0,0"/>
        <Setter Property="Padding" Value="6,10,6,10"/>
        <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
        <Setter Property="VerticalContentAlignment" Value="Stretch"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type TabItem}">
                    <Grid x:Name="templateRoot" SnapsToDevicePixels="true"   >
                        <Border x:Name="mainBorder" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="0,0,0,0" Margin="0">
                            <Border x:Name="innerBorder" Background="{StaticResource TabItem.Selected.Background}" BorderBrush="{x:Null}" BorderThickness="0,0,0,0" Margin="-1" Opacity="0"/>
                        </Border>
                        <ContentPresenter x:Name="contentPresenter" ContentSource="Header" Focusable="False" HorizontalAlignment="{Binding HorizontalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{Binding VerticalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}"/>
                    </Grid>
                    <ControlTemplate.Triggers>
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding IsMouseOver, RelativeSource={RelativeSource Self}}" Value="true"/>
                                <Condition Binding="{Binding TabStripPlacement, RelativeSource={RelativeSource AncestorType={x:Type TabControl}}}" Value="Left"/>
                            </MultiDataTrigger.Conditions>
                            <Setter Property="Background" TargetName="mainBorder" Value="#FF313131"/>
                            <Setter Property="BorderBrush" TargetName="mainBorder" Value="#FF313131"/>

                        </MultiDataTrigger>
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding IsMouseOver, RelativeSource={RelativeSource Self}}" Value="true"/>
                                <Condition Binding="{Binding TabStripPlacement, RelativeSource={RelativeSource AncestorType={x:Type TabControl}}}" Value="Bottom"/>
                            </MultiDataTrigger.Conditions>
                            <Setter Property="Background" TargetName="mainBorder" Value="#FF313131"/>
                            <Setter Property="BorderBrush" TargetName="mainBorder"  Value="#FF313131"/>

                        </MultiDataTrigger>
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding IsMouseOver, RelativeSource={RelativeSource Self}}" Value="true"/>
                                <Condition Binding="{Binding TabStripPlacement, RelativeSource={RelativeSource AncestorType={x:Type TabControl}}}" Value="Right"/>
                            </MultiDataTrigger.Conditions>
                            <Setter Property="Background" TargetName="mainBorder"  Value="#FF313131"/>
                            <Setter Property="BorderBrush" TargetName="mainBorder" Value="#FF313131"/>

                        </MultiDataTrigger>
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding IsMouseOver, RelativeSource={RelativeSource Self}}" Value="true"/>
                                <Condition Binding="{Binding TabStripPlacement, RelativeSource={RelativeSource AncestorType={x:Type TabControl}}}" Value="Top"/>
                            </MultiDataTrigger.Conditions>
                            <Setter Property="Background" TargetName="mainBorder" Value="#FF313131"/>
                            <Setter Property="BorderBrush" TargetName="mainBorder" Value="#FF313131"/>

                        </MultiDataTrigger>
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding IsEnabled, RelativeSource={RelativeSource Self}}" Value="false"/>
                                <Condition Binding="{Binding TabStripPlacement, RelativeSource={RelativeSource AncestorType={x:Type TabControl}}}" Value="Left"/>
                            </MultiDataTrigger.Conditions>
                            <Setter Property="Opacity" TargetName="contentPresenter" Value="0.56"/>
                            <Setter Property="Background" TargetName="mainBorder"  Value="#000000"/>
                            <Setter Property="BorderBrush" TargetName="mainBorder"  Value="#000000"/>

                        </MultiDataTrigger>
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding IsEnabled, RelativeSource={RelativeSource Self}}" Value="false"/>
                                <Condition Binding="{Binding TabStripPlacement, RelativeSource={RelativeSource AncestorType={x:Type TabControl}}}" Value="Bottom"/>
                            </MultiDataTrigger.Conditions>
                            <Setter Property="Opacity" TargetName="contentPresenter" Value="0.56"/>
                            <Setter Property="Background" TargetName="mainBorder" Value="{StaticResource TabItem.Disabled.Background}"/>
                            <Setter Property="BorderBrush" TargetName="mainBorder" Value="{StaticResource TabItem.Disabled.Border}"/>

                        </MultiDataTrigger>
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding IsEnabled, RelativeSource={RelativeSource Self}}" Value="false"/>
                                <Condition Binding="{Binding TabStripPlacement, RelativeSource={RelativeSource AncestorType={x:Type TabControl}}}" Value="Right"/>
                            </MultiDataTrigger.Conditions>
                            <Setter Property="Opacity" TargetName="contentPresenter" Value="0.56"/>
                            <Setter Property="Background" TargetName="mainBorder" Value="{StaticResource TabItem.Disabled.Background}"/>
                            <Setter Property="BorderBrush" TargetName="mainBorder" Value="{StaticResource TabItem.Disabled.Border}"/>

                        </MultiDataTrigger>
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding IsEnabled, RelativeSource={RelativeSource Self}}" Value="false"/>
                                <Condition Binding="{Binding TabStripPlacement, RelativeSource={RelativeSource AncestorType={x:Type TabControl}}}" Value="Top"/>
                            </MultiDataTrigger.Conditions>
                            <Setter Property="Opacity" TargetName="contentPresenter" Value="0.56"/>
                            <Setter Property="Background" TargetName="mainBorder" Value="{StaticResource TabItem.Disabled.Background}"/>
                            <Setter Property="BorderBrush" TargetName="mainBorder" Value="{StaticResource TabItem.Disabled.Border}"/>

                        </MultiDataTrigger>
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding IsSelected, RelativeSource={RelativeSource Self}}" Value="false"/>
                                <Condition Binding="{Binding TabStripPlacement, RelativeSource={RelativeSource AncestorType={x:Type TabControl}}}" Value="Left"/>
                            </MultiDataTrigger.Conditions>

                        </MultiDataTrigger>
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding IsSelected, RelativeSource={RelativeSource Self}}" Value="true"/>
                                <Condition Binding="{Binding TabStripPlacement, RelativeSource={RelativeSource AncestorType={x:Type TabControl}}}" Value="Left"/>
                            </MultiDataTrigger.Conditions>
                            <Setter Property="Panel.ZIndex" Value="1"/>
                            <Setter Property="Background" TargetName="innerBorder" Value="#000000"/>
                            <Setter Property="Opacity" TargetName="innerBorder" Value="1"/>
                            <Setter Property="Foreground" Value="#FF497CFF"/>

                        </MultiDataTrigger>
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding IsSelected, RelativeSource={RelativeSource Self}}" Value="false"/>
                                <Condition Binding="{Binding TabStripPlacement, RelativeSource={RelativeSource AncestorType={x:Type TabControl}}}" Value="Bottom"/>
                            </MultiDataTrigger.Conditions>

                        </MultiDataTrigger>
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding IsSelected, RelativeSource={RelativeSource Self}}" Value="true"/>
                                <Condition Binding="{Binding TabStripPlacement, RelativeSource={RelativeSource AncestorType={x:Type TabControl}}}" Value="Bottom"/>
                            </MultiDataTrigger.Conditions>
                            <Setter Property="Panel.ZIndex" Value="1"/>
                            <Setter Property="Background" TargetName="innerBorder" Value="#000000"/>
                            <Setter Property="Opacity" TargetName="innerBorder" Value="1"/>
                            <Setter Property="Foreground" Value="#FF497CFF"/>
                        </MultiDataTrigger>
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding IsSelected, RelativeSource={RelativeSource Self}}" Value="false"/>
                                <Condition Binding="{Binding TabStripPlacement, RelativeSource={RelativeSource AncestorType={x:Type TabControl}}}" Value="Right"/>
                            </MultiDataTrigger.Conditions>

                        </MultiDataTrigger>
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding IsSelected, RelativeSource={RelativeSource Self}}" Value="true"/>
                                <Condition Binding="{Binding TabStripPlacement, RelativeSource={RelativeSource AncestorType={x:Type TabControl}}}" Value="Right"/>
                            </MultiDataTrigger.Conditions>
                            <Setter Property="Panel.ZIndex" Value="1"/>
                            <Setter Property="Background" TargetName="innerBorder" Value="#000000"/>

                            <Setter Property="Opacity" TargetName="innerBorder" Value="1"/>
                            <Setter Property="Foreground" Value="#FF497CFF"/>

                        </MultiDataTrigger>
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding IsSelected, RelativeSource={RelativeSource Self}}" Value="false"/>
                                <Condition Binding="{Binding TabStripPlacement, RelativeSource={RelativeSource AncestorType={x:Type TabControl}}}" Value="Top"/>
                            </MultiDataTrigger.Conditions>

                        </MultiDataTrigger>
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding IsSelected, RelativeSource={RelativeSource Self}}" Value="true"/>
                                <Condition Binding="{Binding TabStripPlacement, RelativeSource={RelativeSource AncestorType={x:Type TabControl}}}" Value="Top"/>
                            </MultiDataTrigger.Conditions>
                            <Setter Property="Panel.ZIndex" Value="1"/>
                            <Setter Property="Background" TargetName="innerBorder" Value="#000000"/>

                            <Setter Property="Opacity" TargetName="innerBorder" Value="1"/>
                            <Setter Property="Foreground" Value="#FF497CFF"/>
                        </MultiDataTrigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
  • 在程序App.xaml文件中默认加载浅色皮肤 

 

  •  在【切换主题】按钮事件中，用c#动态加载样式文件来切换皮肤。

 

   Application.Current.Resources.MergedDictionaries.Clear();
            ResourceDictionary newRD = new ResourceDictionary();

            if (Industry.MainWindow.Config.Skin == "SkinTheme1")
            {

                newRD.Source = new Uri("Skin/SkinTheme1.xaml", UriKind.Relative);
            }
            else
            {

                newRD.Source = new Uri("Skin/SkinTheme2.xaml", UriKind.Relative);
            }

 三、运行效果

 

 

编程何老师
关注
  • 0
    点赞
  • 踩
  • 5
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 1
    评论
专栏目录
WPF动态修改皮肤
LH806732的专栏
02-23 2240
代码下载：http://download.csdn.net/detail/lh806732/8454189 1、效果 2、工程目录     2.1 如工程目录所示，在工程下创建Resources目录，并在Resources创建Themes目录用于存放主题资源。     2.2 在Themes目录下创建Default和Green资源文件，并修改相应的S
WPF动态切换皮肤
beilinu的专栏
03-18 8237
实现方法比较简单，动态的加载资源字典来实现切换皮肤 <Application x:Class="Samples.App" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/20
WPF 动态 3D换肤 效果！！
12-23
WPF 动态 3D换肤 效果！！WPF 动态 3D换肤 效果！！WPF 动态 3D换肤 效果！！
WPF实现换肤（手动）
BitoLink的博客
05-11 444
一、三个基础知识 1、分层式资源 Hierarchical Resource FrameworkElement基类有一个Resources属性，类型是ResourceDictionary。这个字典包含了一组键值对，每个键值对中的key和value都可以使任意的object。 Resource dictionaries 在程序中分层存放。当程序需要定位一个资源（例如Brush， Style，DataTemplate或其他对象）的时候，首先他检查发起资源寻找请求的元素的Resource属性。假如没有找到，它会检
[WPF]颜色主题功能
李正浩的博客
02-06 2097
效果   点击选择皮肤颜色   代码 public enum Themes { Blue, Gray, Orange } /// &lt;summary&gt; /// 主题颜色管理类 /// &lt;/summary&gt; public static class The...
WPF 动态切换黑|白皮肤
dotNET跨平台
08-17 1039
WPF 动态切换黑|白皮肤WPF 使用 WPFDevelopers.Minimal 如何动态切换黑|白皮肤作者：WPFDevelopersOrg原文链接： https://github.com/WPFDevelopersOrg/WPFDevelopers.Minimal框架使用大于等于.NET40；Visual Studio 2022;项目使用 MIT 开源许可协议；Nuget Inst...
在WPF中创建可换肤的用户界面
Python的专栏
03-23 1695
在WPF中创建可换肤的用户界面.                                                                        周银辉 译                                                                        原文参见: http://www.codeproject.co
WPF 实现换肤功能
lyj2018gyq的博客
03-03 2839
将所有控件的基本样式汇集到一个资源字典中，构成界面的基本样式文件，然后进行不同颜色皮肤的定制。 即在新的皮肤资源字典文件中引入基本样式文件，然后使用资源继承，并且只设置控件的颜色属性等，形成一个皮肤文件。 注意：在设置不同皮肤文件时，不同控件的样式名字必须固定，只改变其颜色就能形成新的皮肤，因为在界面xaml中所有控件只引用一个样式名字。 换肤时需要设置本地json文件，对皮肤信息进行记...
WPF揭密之WPF 样式、模版、皮肤、主题
yulongguiziyao的专栏
12-27 2877
样式（Style）：对属性分组，否则这些属性就要单独设置。样式存在的目的是在多个元素中共享该组的值。一个Style可以通过BasedOn属性从另一个属性继承。 触发器： 属性触发器：当依赖属性的值发生改变时调用。 数据触发器：当普通.Net属性值改变时调用。 事件触发器：当路由事件被触发时调用。 FrameworkElement、Style、DataTemplate、ControlTemp...
WPF动态换肤的实现方法
11-26
在Windows Presentation ...通过以上这些技术，开发者可以在WPF应用中实现灵活、高效的动态换肤功能，提升应用的可定制性和用户满意度。在实际项目中，还需要根据具体需求进行调整和优化，确保换肤功能既美观又实用。
WPF自定义控件以及换肤的实现
10-18
WPF自定义控件以及换肤的实现，绑定背景
20多种WPF更换皮肤.zip
11-21
更换皮肤。
wpf 皮肤编程
12-16
wpf 教你如何制作换肤功能
WPF更换皮肤
09-15
WPF客户端更换皮肤的例子，亲测好用，通用性强，，，，
换肤功能——WPF实现的CS结构桌面程序的换肤功能
10-29
换肤功能——WPF实现的CS结构桌面程序的换肤功能，大家都用过Web上的换肤功能，这个例子就是用WPF实现的为桌面程序实现换肤的功能。
WPF 动态换肤示例
03-11
通过这个名为“SkinnableApp”的示例项目，开发者可以学习如何在WPF应用中实现动态换肤，从而提升应用的交互性和用户满意度。通过研究`SkinnableApp.sln`解决方案文件和`themes`目录下的资源文件，可以深入理解这项...
WPF 换肤源码
12-13
开发者或学习者可以下载此资源来参考、学习如何在WPF应用中实现换肤功能，这对于那些希望提升用户体验或个性化应用程序外观的开发者来说是非常有价值的。 标签：“WPF 换肤”进一步明确了这个项目的核心技术点，即...
WPF结合DEV换肤
11-06
在本文中，我们将深入探讨如何在Windows Presentation Foundation (WPF) 应用程序中结合DevExpress (DEV) 控件实现自定义皮肤换肤功能。WPF是.NET Framework的一部分，提供了丰富的用户界面开发工具，而DevExpress则...
收集的WPF的皮肤或框架
小数点儿的博客
03-15 1782
随意收集 1，WPF控件库 MaterialDesignInXamlToolkit (1)（皮肤） https://www.cnblogs.com/OpenLJW/articles/10145748.html 2，框架 MVVM Light 3，AYUI （框架mvc +皮肤） 4，MahApps.Metro（皮肤） 5，Microsoft Prismhttp://compos...
wpf按钮实现翻页功能
最新发布
06-08
要实现WPF按钮的翻页功能，可以尝试以下步骤： 1. 在XAML文件中，添加一个按钮控件，并设置它的Click事件处理程序： ``` <Button Content="翻页" Click="OnNextPageClicked"/> ``` 2. 在代码文件中，实现OnNextPageClicked方法： ``` private void OnNextPageClicked(object sender, RoutedEventArgs e) { // 在这里实现翻页逻辑 } ``` 3. 在OnNextPageClicked方法中，可以使用NavigationService类来进行页面导航，如下所示： ``` private void OnNextPageClicked(object sender, RoutedEventArgs e) { NavigationService.Navigate(new Uri("NextPage.xaml", UriKind.Relative)); } ``` 4. 在App.xaml.cs文件中，启用导航服务： ``` public partial class App : Application { protected override void OnStartup(StartupEventArgs e) { base.OnStartup(e); NavigationWindow navigationWindow = new NavigationWindow(); navigationWindow.Content = new MainPage(); navigationWindow.Show(); } } ``` 这样，当用户单击按钮时，就会导航到NextPage.xaml页面。如果需要实现向前翻页功能，可以使用NavigationService.GoBack方法。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

编程何老师

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值