WPF 自定义标题栏

原文: WPF 自定义标题栏

在做客户端应用程序时,往往觉得Windows自带的标题栏没有样式,不太好看,下面分享自自定义的一个Windows工具

 效果图:

<Style x:Key="Buttonclock" TargetType="{x:Type Button}">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type Button}">
                        <Grid Width="11">
                            <Border BorderThickness="1"/>
                            <ContentPresenter x:Name="contentPresenter" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" Opacity="0.7"/>
                        </Grid>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsFocused" Value="True"/>
                            <Trigger Property="IsDefaulted" Value="True"/>
                            <Trigger Property="IsMouseOver" Value="True">
                                <Setter Property="Opacity" TargetName="contentPresenter" Value="1"/>
                            </Trigger>
                            <Trigger Property="IsMouseOver" Value="False">
                                <Setter Property="Opacity" TargetName="contentPresenter" Value="0.7"/>
                            </Trigger>
                            <Trigger Property="IsPressed" Value="True">
                                <Setter Property="Opacity" TargetName="contentPresenter" Value="1"/>
                            </Trigger>
                            <Trigger Property="IsEnabled" Value="False"/>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
View Code
<Style x:Key="Buttonmini_minwindow" TargetType="{x:Type Button}">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type Button}">
                        <ControlTemplate.Resources>
                            <Storyboard x:Key="Sbmini1">
                                <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="rectangle">
                                    <DiscreteObjectKeyFrame KeyTime="0" Value="{x:Static Visibility.Visible}"/>
                                </ObjectAnimationUsingKeyFrames>
                                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="rectangle">
                                    <EasingDoubleKeyFrame KeyTime="0" Value="0"/>
                                    <EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="1"/>
                                </DoubleAnimationUsingKeyFrames>
                                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="contentPresenter">
                                    <EasingDoubleKeyFrame KeyTime="0" Value="0.6"/>
                                    <EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="1"/>
                                </DoubleAnimationUsingKeyFrames>
                            </Storyboard>
                            <Storyboard x:Key="Sbmini2">
                                <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="rectangle">
                                    <DiscreteObjectKeyFrame KeyTime="0:0:0.2" Value="{x:Static Visibility.Visible}"/>
                                </ObjectAnimationUsingKeyFrames>
                                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="rectangle">
                                    <SplineDoubleKeyFrame KeyTime="0" Value="1"/>
                                    <SplineDoubleKeyFrame KeyTime="0:0:0.2" Value="0"/>
                                </DoubleAnimationUsingKeyFrames>
                                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="contentPresenter">
                                    <SplineDoubleKeyFrame KeyTime="0" Value="1"/>
                                    <SplineDoubleKeyFrame KeyTime="0:0:0.2" Value="0.6"/>
                                </DoubleAnimationUsingKeyFrames>
                            </Storyboard>
                        </ControlTemplate.Resources>
                        <Grid>
                            <Rectangle x:Name="rectangle" RadiusX="0" Stroke="{x:Null}" Height="19" Width="26" Visibility="Hidden">
                                <Rectangle.Fill>
                                    <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                        <GradientStop Color="#003099E2" Offset="1"/>
                                        <GradientStop Color="#67FDFDFD" Offset="0.072"/>
                                    </LinearGradientBrush>
                                </Rectangle.Fill>
                            </Rectangle>
                            <ContentPresenter x:Name="contentPresenter" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" Opacity="0.6"/>
                            <Border BorderBrush="Black" BorderThickness="1" Opacity="0">
                                <Border.Background>
                                    <RadialGradientBrush>
                                        <GradientStop Color="#00000000" Offset="0"/>
                                        <GradientStop Color="White" Offset="1"/>
                                    </RadialGradientBrush>
                                </Border.Background>
                            </Border>
                        </Grid>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsDefaulted" Value="True"/>
                            <Trigger Property="IsMouseOver" Value="True">
                                <Trigger.ExitActions>
                                    <BeginStoryboard x:Name="Sbmini2_BeginStoryboard" Storyboard="{StaticResource Sbmini2}"/>
                                </Trigger.ExitActions>
                                <Trigger.EnterActions>
                                    <BeginStoryboard Storyboard="{StaticResource Sbmini1}"/>
                                </Trigger.EnterActions>
                            </Trigger>
                            <Trigger Property="IsMouseOver" Value="False"/>
                            <Trigger Property="IsPressed" Value="True">
                                <Setter Property="Margin" TargetName="contentPresenter" Value="0"/>
                                <Setter Property="Visibility" TargetName="rectangle" Value="Visible"/>
                                <Setter Property="Fill" TargetName="rectangle">
                                    <Setter.Value>
                                        <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                            <GradientStop Color="#003099E2" Offset="1"/>
                                            <GradientStop Color="#671F1F1F" Offset="0.072"/>
                                        </LinearGradientBrush>
                                    </Setter.Value>
                                </Setter>
                            </Trigger>
                            <Trigger Property="IsEnabled" Value="False"/>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
View Code
<Style x:Key="Buttonclose_mainwidow" TargetType="{x:Type Button}">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type Button}">
                        <ControlTemplate.Resources>
                            <Storyboard x:Key="sbstory1">
                                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="rectangle">
                                    <EasingDoubleKeyFrame KeyTime="0" Value="0"/>
                                    <EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="1"/>
                                </DoubleAnimationUsingKeyFrames>
                                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="image">
                                    <EasingDoubleKeyFrame KeyTime="0" Value="0.6"/>
                                    <EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="1"/>
                                </DoubleAnimationUsingKeyFrames>
                            </Storyboard>
                            <Storyboard x:Key="sbstory2">
                                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="image">
                                    <EasingDoubleKeyFrame KeyTime="0" Value="1"/>
                                    <EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="0.6"/>
                                </DoubleAnimationUsingKeyFrames>
                                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="rectangle">
                                    <EasingDoubleKeyFrame KeyTime="0" Value="1"/>
                                    <EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="0"/>
                                </DoubleAnimationUsingKeyFrames>
                            </Storyboard>
                        </ControlTemplate.Resources>
                        <Grid>
                            <Rectangle x:Name="rectangle" Margin="-12.167,0,0,-9.167" RadiusY="5.5" RadiusX="5" Stroke="#FF379FE6" StrokeThickness="0" Width="Auto" Clip="M12.167,0 L54.167,0 L54.167,20 L12.167,20 z" Opacity="0">
                                <Rectangle.Fill>
                                    <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                        <GradientStop Color="#99D91A1D" Offset="0.396"/>
                                        <GradientStop Color="#00D91A1D" Offset="0.726"/>
                                        <GradientStop Color="#7FFE5B5E"/>
                                        <GradientStop Color="#BFD6070B" Offset="0.104"/>
                                    </LinearGradientBrush>
                                </Rectangle.Fill>
                            </Rectangle>
                            <Image Source="/PermissionsDemo;component/image/csmmainwidow_Images/icons92.png" Stretch="None" Height="10" Width="12" Margin="0,0,0,-3" Opacity="1" Visibility="Hidden"/>
                            <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"  Content="" />
                            <Image x:Name="image" Margin="0,0,0,-3" Source="/PermissionsDemo;component/image/csmmainwidow_Images/icons85.png" Stretch="None" Width="12" Height="10" Visibility="Visible" Opacity="0.6"/>
                        </Grid>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsFocused" Value="True"/>
                            <Trigger Property="IsDefaulted" Value="True"/>
                            <Trigger Property="IsMouseOver" Value="True">
                                <Trigger.ExitActions>
                                    <BeginStoryboard x:Name="sbstory2_BeginStoryboard" Storyboard="{StaticResource sbstory2}"/>
                                </Trigger.ExitActions>
                                <Trigger.EnterActions>
                                    <BeginStoryboard Storyboard="{StaticResource sbstory1}"/>
                                </Trigger.EnterActions>
                            </Trigger>
                            <Trigger Property="IsMouseOver" Value="False"/>
                            <Trigger Property="IsPressed" Value="True">
                                <Setter Property="Opacity" TargetName="rectangle" Value="0.8"/>
                                <Setter Property="Margin" TargetName="image" Value="1,0,0,-4"/>
                            </Trigger>
                            <Trigger Property="IsEnabled" Value="False"/>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
View Code
<Grid x:Name="LayoutRoot" Width="180" Height="22">
        <DockPanel LastChildFill="False" HorizontalAlignment="Right" Height="22">
            <Button Style="{StaticResource Buttonclock}">
                <Image Source="/PermissionsDemo;component/image/csmmainwidow_Images/icons96.png" Stretch="Fill" Width="11" Height="13" RenderOptions.BitmapScalingMode="NearestNeighbor"  />
            </Button>
            <Button Style="{StaticResource Buttonclock}" Margin="12,0,0,0">
                <Image Source="/PermissionsDemo;component/image/csmmainwidow_Images/icons95.png" Stretch="Fill" Width="11" Height="13" RenderOptions.BitmapScalingMode="NearestNeighbor"  />
            </Button>
            <Button Style="{StaticResource Buttonclock}" Margin="12,0">
                <Image Height="13" Source="/PermissionsDemo;component/image/csmmainwidow_Images/question.png" Stretch="Fill" Width="11" RenderOptions.BitmapScalingMode="NearestNeighbor" />
            </Button>
            <Border BorderBrush="#66FFFFFF" BorderThickness="1,0" Width="3">
                <Border.OpacityMask>
                    <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                        <GradientStop Color="#99000000" Offset="0.323"/>
                        <GradientStop Offset="1"/>
                    </LinearGradientBrush>
                </Border.OpacityMask>
                <Border.Background>
                    <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                        <GradientStop Color="#FF25679B" Offset="0"/>
                        <GradientStop Color="#002B72A9" Offset="1"/>
                        <GradientStop Color="#FF2975AF" Offset="0.6"/>
                    </LinearGradientBrush>
                </Border.Background>
            </Border>
            <Button  Margin="0" Style="{StaticResource Buttonmini_minwindow}" Width="26" VerticalAlignment="Center">
                <Rectangle Fill="#FFF4F4F5" Height="3" VerticalAlignment="Bottom" Stroke="#C021698F" Width="11" Margin="0,10,0,0"/>
            </Button>
            <Border BorderBrush="#66FFFFFF" BorderThickness="1,0" Width="3">
                <Border.OpacityMask>
                    <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                        <GradientStop Color="#99000000" Offset="0.323"/>
                        <GradientStop Offset="1"/>
                    </LinearGradientBrush>
                </Border.OpacityMask>
                <Border.Background>
                    <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                        <GradientStop Color="#FF25679B" Offset="0"/>
                        <GradientStop Color="#002B72A9" Offset="1"/>
                        <GradientStop Color="#FF2975AF" Offset="0.6"/>
                    </LinearGradientBrush>
                </Border.Background>
            </Border>
            <Button  Margin="0" Style="{StaticResource Buttonmini_minwindow}" Width="26" VerticalAlignment="Center">
                <Path Data="M2.5,2.5 L2.5,6.5 7.5,6.5 7.5,2.5 z M0.5,0.5 L9.5,0.5 9.5,8.5 0.5,8.5 z" HorizontalAlignment="Center" Height="9" Stretch="Fill" VerticalAlignment="Center" Width="10" Stroke="#C021698F" Margin="0,4,0,0">
                    <Path.Fill>
                        <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                            <GradientStop Color="#FFE7E7E7" Offset="1"/>
                            <GradientStop Color="WhiteSmoke"/>
                        </LinearGradientBrush>
                    </Path.Fill>
                </Path>
            </Button>
            <Border BorderBrush="#66FFFFFF" BorderThickness="1,0" Width="3">
                <Border.OpacityMask>
                    <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                        <GradientStop Color="#99000000" Offset="0.323"/>
                        <GradientStop Offset="1"/>
                    </LinearGradientBrush>
                </Border.OpacityMask>
                <Border.Background>
                    <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                        <GradientStop Color="#FF25679B" Offset="0"/>
                        <GradientStop Color="#002B72A9" Offset="1"/>
                        <GradientStop Color="#FF2975AF" Offset="0.6"/>
                    </LinearGradientBrush>
                </Border.Background>
            </Border>
            <Button RenderOptions.BitmapScalingMode="NearestNeighbor" Content="Button" HorizontalAlignment="Center" Margin="0,-1,0,0" Style="{StaticResource Buttonclose_mainwidow}" Width="42"/>
        </DockPanel>
    </Grid>
View Code

由于自己初学WPF,代码中可能有点冗余。

下面是工具栏中图片资源: mainwidow_Images.7z

页面资源文件源码:Titel.7z

posted on 2019-04-25 08:27 NET未来之路 阅读( ...) 评论( ...) 编辑 收藏

转载于:https://www.cnblogs.com/lonelyxmas/p/10766213.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
WPF窗体标题栏美化可以通过自定义样式和模板来实现。下面是一个简单的步骤指导: 1. 首先,打开Visual Studio,创建一个新的WPF应用程序项目。 2. 在项目中的MainWindow.xaml文件中,找到标题栏的样式代码。可以通过Expression Blend的导航窗口找到这段代码。 3. 复制原始样式并将其粘贴到资源区域中。代码的位置应在<Window.Resources>标记之间。 4. 这时,可以对标题栏样式进行编辑和修改,以满足美化的要求。可以修改背景色、字体、按钮等属性。 5. 添加一个新的命名空间 xmlns:local="clr-namespace:System.Windows.Shell;assembly=PresentationFramework",以便使用WindowChrome类和WindowChrome属性。 6. 在MainWindow.xaml中找到窗体布局代码,并添加WindowChrome属性。 <WindowChrome.WindowChrome> <local:WindowChrome CaptionHeight="30" ResizeBorderThickness="5" GlassFrameThickness="0"/> </WindowChrome.WindowChrome> 这个代码片段中的CaptionHeight属性定义了标题栏的高度,ResizeBorderThickness属性定义了窗体边框的宽度,GlassFrameThickness属性定义了窗体的边框。 7. 可以调整这些属性的值来适应窗体的美化需求。 8. 在代码区域中的Window_Loaded事件处理器中添加以下代码,以便实现窗体移动功能。 private void Window_Loaded(object sender, RoutedEventArgs e) { WindowChrome.SetWindowChrome(this, new WindowChrome() { CaptionHeight = 30 }); } 9. 保存并运行项目,即可看到自定义WPF窗体标题栏。 注意:在进行WPF窗体标题栏美化时,建议使用Expression Blend等可视化工具,以便更好地调整视觉效果。此外,可以参考其他开源项目或第三方库来获取更多的样式和模板,以实现更高级的美化效果。

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值