WPF自定义漂亮顶部工具栏 WPF自定义精致最大化关闭工具栏 wpf导航栏自定义 WPF快速开发工具栏

news2024/10/5 12:47:12

在WPF应用程序开发中,自定义一个漂亮的顶部工具栏具有多重关键作用,它不仅增强了用户体验,还提升了整体应用的专业性和易用性。以下是对这一功能的详细介绍:

首先,自定义顶部工具栏是用户界面设计的重要组成部分,它集成了应用程序的核心操作入口,如关闭、最大化和最小化窗口按钮,这些直观而易于识别的控件赋予了用户对窗口状态的完全控制权,使他们能够轻松调整窗口大小或退出程序。

其次,工具栏的灵活性体现在其强大的内容承载能力上,开发者可以自由地将Menu菜单项、图片、图标甚至是复杂的数据可视化组件嵌入其中,从而实现快捷访问常用功能、展示重要信息或提供动态数据概览等目的。这种高度定制化的布局有助于根据特定应用场景和用户需求量身打造高效的交互方式。

再者,通过运用WPF强大的样式和模板机制,开发者能够创建出拥有独特视觉效果的工具栏,例如背景色渐变、动态动画等高级UI效果。这样的个性化设计不仅能凸显应用的品牌特色,还能营造舒适的操作环境,提高用户的使用愉悦感和软件的吸引力。

最后,优雅且功能齐全的顶部工具栏对于提升首屏界面的重要性不言而喻。它作为用户与应用程序互动的第一道门面,精心设计的工具栏有助于引导用户快速定位功能模块,简化操作流程,降低认知负荷,并彰显应用的精致品质和人性化考量。

WPF中自定义的漂亮顶部工具栏不仅是技术实力的展现,更是提升用户体验、塑造品牌形象和优化交互逻辑的关键设计元素之一,它的存在极大地影响着用户对整个应用程序的第一印象及长期使用的满意度。

下载源代码

<Window x:Class="headBeautiful.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:hc="https://handyorg.github.io/handycontrol"
        xmlns:local="clr-namespace:headBeautiful"
        mc:Ignorable="d"
        WindowStyle="None"
        WindowStartupLocation="CenterScreen"
        WindowState="Maximized"
        Loaded="Window_Loaded"
        MouseLeftButtonDown="Window_MouseLeftButtonDown"
        Title="MainWindow" Height="850" Width="1200">
    <WindowChrome.WindowChrome>
        <WindowChrome CaptionHeight="0" ResizeBorderThickness="5"/>
    </WindowChrome.WindowChrome>
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="40" />
            <RowDefinition Height="300" />
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>
        <Grid Grid.Row="0">
            <Grid.Background>
                <LinearGradientBrush StartPoint="0,1" EndPoint="1,1">
                    <GradientStop Offset="0" Color="#CCD5F0"/>
                    <GradientStop Offset="1" Color="#C4E2EC"/>
                </LinearGradientBrush>
            </Grid.Background>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="100"/>
                <ColumnDefinition Width="*"/>
                <ColumnDefinition Width="200"/>
            </Grid.ColumnDefinitions>
            <StackPanel Grid.Column="0" Orientation="Horizontal" VerticalAlignment="Center">
                <TextBlock Text="导航页" Foreground="#5a5e66" FontSize="16" FontWeight="Bold" Margin="15 0 0 0"/>
            </StackPanel>
            <StackPanel Grid.Column="1" Orientation="Horizontal" HorizontalAlignment="Left" VerticalAlignment="Center">
                <Border BorderBrush="#5a5e66" BorderThickness="1" CornerRadius="5" Background="#FFFFFF" >
                    <Menu Background="Transparent" FontSize="14" VerticalAlignment="Center" BorderThickness="0" BorderBrush="Transparent">
                        <MenuItem Header="微软" Foreground="#5a5e66" />
                        <MenuItem Header="Google" Foreground="#5a5e66" />
                        <MenuItem Header="苹果" Foreground="#5a5e66" />
                        <MenuItem Header="小米" Foreground="#5a5e66" />
                        <MenuItem Header="联系" Foreground="#5a5e66" />
                        <MenuItem Header="退出" Foreground="#5a5e66" />
                    </Menu>
                </Border>
            </StackPanel>
            <StackPanel Orientation="Horizontal" Grid.Column="2" HorizontalAlignment="Right">
                <Button Style="{StaticResource ButtonIcon}" Foreground="#5a5e66"  x:Name="MinWin" Click="MinWin_Click"
                            hc:IconElement.Geometry="{StaticResource WindowMinGeometry}" Visibility="Visible"/>
                <Button Style="{StaticResource ButtonIcon}" Foreground="#5a5e66"  x:Name="MaxWin" Click="MaxWin_Click"
                            hc:IconElement.Geometry="{StaticResource WindowRestoreGeometry}" Margin="0 0 10 0"/>
                <Button Style="{StaticResource ButtonIcon}" Foreground="#5a5e66"  x:Name="MaxWin2" Click="MaxWin2_Click"
                            hc:IconElement.Geometry="{StaticResource WindowMaxGeometry}" Margin="0 0 10 0"/>
                <Button Style="{StaticResource ButtonIcon}" Foreground="#5a5e66" x:Name="Close" Click="Close_Click"
                        hc:IconElement.Geometry="{StaticResource CloseGeometry}" Margin="0 0 10 0"/>
            </StackPanel>
        </Grid>
        <Grid Grid.Row="1">
            <Grid.RowDefinitions>
                <RowDefinition Height="1*" />
                <RowDefinition Height="1*" />
            </Grid.RowDefinitions>
            <!--这两个broder是背景-->
            <Border Background="#409eff" Grid.Row="0"/>
            <Border Background="#F9F9FC" Grid.Row="1"/>

            <UniformGrid Grid.Row="0" Grid.RowSpan="2" Columns="3" Margin="0 40 0 40">

                <Border Margin="15" CornerRadius="5">
                    <Border.Background>
                        <LinearGradientBrush StartPoint="0,1" EndPoint="1,1">
                            <GradientStop Offset="0" Color="#FF8C69"/>
                            <GradientStop Offset="1" Color="#FF7000"/>
                        </LinearGradientBrush>
                    </Border.Background>

                    <Grid>
                        <Grid.RowDefinitions>
                            <RowDefinition Height="1*"/>
                            <RowDefinition/>
                            <RowDefinition/>
                            <RowDefinition Height="2*"/>
                        </Grid.RowDefinitions>

                        <TextBlock Text="Stock Total" Grid.Row="1" VerticalAlignment="Center" FontSize="16" Margin="10 0 0 0" Foreground="White"/>
                        <TextBlock Text="$150000" FontWeight="Bold" VerticalAlignment="Center" Grid.Row="2" FontSize="22" Margin="10 0 0 0" Foreground="White"/>
                        <TextBlock Text="Incrased by 60%" Grid.Row="3" FontSize="20" Foreground="White" Margin="10 0 0 0" VerticalAlignment="Center"/>

                        <Canvas ClipToBounds="True" Grid.RowSpan="4">
                            <Border Canvas.Right="-40" Canvas.Top="10" Grid.RowSpan="4" Width="110" Height="110"  CornerRadius="100" Background="#ffffff" Opacity="0.2" VerticalAlignment="Top"  HorizontalAlignment="Right"/>
                            <Border Canvas.Right="-10" Canvas.Top="100" Grid.RowSpan="4" Width="110" Height="110" CornerRadius="100" Background="#ffffff" Opacity="0.2" VerticalAlignment="Bottom"  HorizontalAlignment="Right"/>
                        </Canvas>

                    </Grid>

                </Border>

                <Border Margin="15" CornerRadius="5">
                    <Border.Background>
                        <LinearGradientBrush StartPoint="0,1" EndPoint="1,1">
                            <GradientStop Offset="0" Color="#FFD700"/>
                            <GradientStop Offset="1" Color="#FFC100"/>
                        </LinearGradientBrush>
                    </Border.Background>
                    <Grid>
                        <Grid.RowDefinitions>
                            <RowDefinition Height="1*"/>
                            <RowDefinition/>
                            <RowDefinition/>
                            <RowDefinition Height="2*"/>
                        </Grid.RowDefinitions>

                        <TextBlock Text="Total Proflt" Grid.Row="1" VerticalAlignment="Center" FontSize="16" Margin="10 0 0 0" Foreground="White"/>
                        <TextBlock Text="$250000" FontWeight="Bold" VerticalAlignment="Center" Grid.Row="2" FontSize="22" Margin="10 0 0 0" Foreground="White"/>
                        <TextBlock Text="Incrased by 30%" Grid.Row="3" FontSize="20" Foreground="White" Margin="10 0 0 0" VerticalAlignment="Center"/>


                        <Canvas ClipToBounds="True" Grid.RowSpan="4">
                            <Border Canvas.Right="-40" Canvas.Top="10" Grid.RowSpan="4" Width="110" Height="110"  CornerRadius="100" Background="#ffffff" Opacity="0.2" VerticalAlignment="Top"  HorizontalAlignment="Right"/>
                            <Border Canvas.Right="-10" Canvas.Top="100" Grid.RowSpan="4" Width="110" Height="110" CornerRadius="100" Background="#ffffff" Opacity="0.2" VerticalAlignment="Bottom"  HorizontalAlignment="Right"/>
                        </Canvas>

                    </Grid>
                </Border>

                <Border Margin="15" CornerRadius="5">
                    <Border.Background>
                        <LinearGradientBrush StartPoint="0,1" EndPoint="1,1">
                            <GradientStop Offset="0" Color="#00CED1"/>
                            <GradientStop Offset="1" Color="#59E6B5"/>
                        </LinearGradientBrush>
                    </Border.Background>
                    <Grid>
                        <Grid.RowDefinitions>
                            <RowDefinition Height="1*"/>
                            <RowDefinition/>
                            <RowDefinition/>
                            <RowDefinition Height="2*"/>
                        </Grid.RowDefinitions>

                        <TextBlock Text="Unique Visitors" Grid.Row="1" VerticalAlignment="Center" FontSize="16" Margin="10 0 0 0" Foreground="White"/>
                        <TextBlock Text="$250000" FontWeight="Bold" VerticalAlignment="Center" Grid.Row="2" FontSize="22" Margin="10 0 0 0" Foreground="White"/>
                        <TextBlock Text="Incrased by 80%" Grid.Row="3" FontSize="20" Foreground="White" Margin="10 0 0 0" VerticalAlignment="Center"/>

                        <Canvas ClipToBounds="True" Grid.RowSpan="4">
                            <Border Canvas.Right="-40" Canvas.Top="10" Grid.RowSpan="4" Width="110" Height="110"  CornerRadius="100" Background="#ffffff" Opacity="0.2" VerticalAlignment="Top"  HorizontalAlignment="Right"/>
                            <Border Canvas.Right="-10" Canvas.Top="100" Grid.RowSpan="4" Width="110" Height="110" CornerRadius="100" Background="#ffffff" Opacity="0.2" VerticalAlignment="Bottom"  HorizontalAlignment="Right"/>
                        </Canvas>
                    </Grid>
                </Border>


            </UniformGrid>

        </Grid>

    </Grid>
</Window>

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1366920.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

508基于51单片机的火灾检测与报警系统设计

基于51单片机的火灾检测与报警系统设计[proteus仿真] 火灾检测与报警系统这个题目算是课程设计和毕业设计中常见的题目了&#xff0c;本期是一个基于51单片机的火灾检测与报警系统设计 需要的源文件和程序的小伙伴可以关注公众号【阿目分享嵌入式】&#xff0c;赞赏任意文章 …

BigDecimal的性能问题

BigDecimal 是 Java 中用于精确计算的数字类&#xff0c;它可以处理任意精度的小数运算。由于其精确性和灵活性&#xff0c;BigDecimal 在某些场景下可能会带来性能问题。 BigDecimal的性能问题 BigDecimal的性能问题主要源于以下几点&#xff1a; 内存占用&#xff1a;BigDec…

华为OD机试 - 反射计数(Java JS Python C)

题目描述 给定一个包含 0 和 1 的二维矩阵。 给定一个初始位置和速度,一个物体从给定的初始位置出发,在给定的速度下进行移动,遇到矩阵的边缘则发生镜面发射。 无论物体经过 0 还是 1,都不影响其速度。 请计算并给出经过 t 时间单位后,物体经过 1 点的次数。 矩阵以左…

国产编程语言炫彩,界面库ui dll,有人了解吗

中文编程: 中英文双语编程, 中英一键切换, 中英对照, 中文为主, UNICODE/ANSI编码都支持; 完全免费: 炫语言免费, 调试器免费, IDE绿色版无需安装; 纯文本: 纯文本格式代码, 随意复制粘贴, GIT代码托管, 多人合作开发; PY风格: PY风格代码, 通过代码缩进确定作用域 非 大花括…

B+树索引及其原理

MySQL索引的底层结构是B树&#xff0c;为什么它会选择这个结构&#xff1f;联合索引是怎么实现的&#xff1f;最左侧匹配原则的原理是什么&#xff1f;本文将一一解答这些疑惑。 1 前置知识 在学习B树之前&#xff0c;我们先了解下其他的树形结构&#xff1a;二叉树、平衡二叉…

C++中的返回值优化(RVO)

一、命名返回值优化&#xff08;NRVO&#xff09; 是Visual C2005及之后版本支持的优化。 具体来说&#xff0c;就是一个函数的返回值如果是一个对象。那么&#xff0c;正常的返回语句的执行过程是&#xff0c;把这个对象从当前函数的局部作用域&#xff0c;或者叫当前函数的…

vue+element弹窗内---下拉框定位问题解决(方法之一)

问题: 加了 :popper-append-to-body"false" 这个属性也不好用时 可以试试这个 解决: 第一步: 找到el-select标签添加(popper-class"popperClass")属性-----如下图 第二步:在css中添加如下代码即可 ::v-deep .popperClass{ top:auto !important; }

Java学习苦旅(二十二)——MapSet

本篇博客将详细讲解Map和Set。 文章目录 搜索概念模型 MapMap.Entry<K, V>Map的常用方法说明TreeMap和HashMap的区别 Set常用方法说明TreeSet和HashSet的区别 结尾 搜索 概念 Map和set是一种专门用来进行搜索的容器或者数据结构&#xff0c;其搜索的效率与其具体的实例…

【win11 绕过TPM CPU硬件限制安装】

Qt编程指南 VX&#xff1a;hao541022348 ■ 下载iso文件■ 右键文件点击装载出现如下问题■ 绕过TPM CPU硬件限制安装方法■ 虚拟机安装win11 ■ 下载iso文件 选择Windows11 &#xff08;multi-edition ISO&#xff09;在选择中文 ■ 右键文件点击装载出现如下问题 ■ 绕过T…

Socks5代理ip和Https代理ip的区别,该如何选择?

Socks5代理和HTTPS代理都是计算机网络中的代理服务器&#xff0c;它们可以用于在客户端和其他服务器之间建立连接并充当中间人。 两种代理类型都有其优缺点和适用场景。 一、什么是Socks5代理 Socks5代理Socks5代理是一个网络协议&#xff0c;通过该协议可以建立TCP和UDP连接…

RDD算子——转换操作(Transformations )【map、flatMap、reduceByKey】

一、map map 算子 # spark-shell sc.parallelize(Seq(1, 2, 3)).map( num > num * 10).collect()# IDEA Test def mapTest(): Unit {// 1. 创建RDDval rdd1 sc.parallelize(Seq(1, 2, 3))// 2. 执行 map 操作val rdd2 rdd1.map(item > item * 10)// 3. 得到结果val re…

在Kubernetes中优雅地导出和清理Ingress资源

引言 Kubernetes的Ingress资源是定义外部访问集群服务的规则。随着微服务架构和容器化技术的普及&#xff0c;Ingress作为路由流量的关键组件变得愈发重要。当我们需要在环境之间迁移Ingress资源或者备份当前的配置时&#xff0c;就会用到导出功能。然而&#xff0c;直接使用k…

已解决 ValueError: Setting an array element with a sequence. 问题

博主猫头虎的技术世界 &#x1f31f; 欢迎来到猫头虎的博客 — 探索技术的无限可能&#xff01; 专栏链接&#xff1a; &#x1f517; 精选专栏&#xff1a; 《面试题大全》 — 面试准备的宝典&#xff01;《IDEA开发秘籍》 — 提升你的IDEA技能&#xff01;《100天精通Golang》…

Mac 环境多JDK安装与切换

一、下载jdk 去Oracle官网上下载想要安装的jdk版本&#xff0c;M芯片选择arm架构的.bmg格式的文件。 https://www.oracle.com/java/technologies/downloads/。 二、安装jdk 2.1 双击下载的文件&#xff0c;安装步骤一步步点继续就好。 2.2 安装完成后会在/Library/Java/JavaV…

Java网络爬虫--概述与原理

目录标题 基本概念与原理爬虫与搜索系统的关系爬虫运行原理爬虫步骤DNS域名解析 爬虫开发本质网络爬虫的分类通用网络爬虫聚集网络爬虫增量式网络爬虫Deep Web爬虫 参考文献 基本概念与原理 爬虫又叫网络蜘蛛&#xff0c;一种运行在互联网上用来获取数据的自动程序。 互联网的…

高级鉴权网关设计二:SM2国密+协议SPI可扩展+动态配置

​ 上一篇文章是定义切面来做鉴权&#xff0c;针对接口时使用比较方便&#xff0c;还有一种是网关的鉴权如何处理&#xff1f;下面为大家介绍一种比较常用的方案&#xff0c;附带可扩展设计 ​ 既然是网关其实就是和外部的礼尚往来&#xff0c;每个第三方还有可能不一样&#…

2.5 KERNEL FUNCTIONS AND THREADING

我们现在准备讨论更多关于CUDA内核功能以及启动这些内核功能的效果。在CUDA中&#xff0c;内核函数指定所有线程在并行阶段执行的代码。由于所有这些线程执行相同的代码&#xff0c;CUDA编程是众所周知的单程序多数据&#xff08;SPMD&#xff09;[Ata 1998]并行编程风格的实例…

Matlab绘制动态心形线

1. 代码 for alpha0:0.1:30 x-1.8:0.001:1.8; y(x.^2).^(1/3)0.9*(3.3-x.^2).^(1/2).*sin(alpha*pi*x); plot(x,y,r-,LineWidth,1.2); set(gca,YGrid,on); axis([-3,3,-2,4]); text(-2,3.35,$f(x)x^{\frac{2}{3}}0.9(3.3-x^2)^{\frac{1}{2}}sin(\alpha\pi x)$,Interpreter,lat…

如何在整个项目中有效管理成本?

在项目管理方面&#xff0c;没有什么比控制成本更重要。尤其是在项目复杂的情况下&#xff0c;开支可能会让项目成本比预期飙升得更快。项目经理需要采取积极主动的成本管理方法&#xff0c;以保证预算不超支。 项目成本管理的各个阶段 管理项目成本需要在整个项目周期中保持…

【Docker】部署mysql 和 tomcat

目录 部署MySQL 1.搜索镜像 2. 拉取镜像 部署Tomcat 1. 搜索镜像 2.拉取镜像 3.查看镜像 部署MySQL 1.搜索镜像 docker search mysql 2. 拉取镜像 通过mysql 镜像创建对应的容器&#xff0c;并设置端口映射&#xff0c;目录映射 创建mysql 的目录 docker run -id \ …