WPF之工具栏菜单栏功能区。

lingxiao168882024-05-11 19:42

1，菜单栏，工具栏，状态栏。

1.1，Menu中可添加菜单分隔条<Separator></Separator>作为分割线，使用Separator可以通过改变其template来自定义，Separator是无焦点的，如果简单的在MenuItem中添加一个textBlock它是可以有焦点的

1.2，ToolBar没有ToolBarItem，ToolBar会将添加到其中的Button,CheckBox,Combobox样式进行修改.

1.3，通过附加属性ToolBar.OverFlowMode来设置该项的溢出方式

1.4，ToolBarTray.Band：确定工具栏放在哪一栏中（最顶部的一栏索引为0），BandIndex属性明确设置一栏中什么位置放置工具栏.

1.5，ToolBarTray.Orientation:设置工具栏方向

1.6，示例：

XML 复制代码 
<Window x:Class="目录样例.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:local="clr-namespace:目录样例"
        mc:Ignorable="d"
        Title="MainWindow" Height="350" Width="525">
    <DockPanel LastChildFill="False">
        <Menu DockPanel.Dock="Top" >
            <MenuItem Header="File(_F)">
                <MenuItem Command="{x:Static ApplicationCommands.Open}"></MenuItem>
                <MenuItem Header="New(_N)" IsChecked="True" x:Name="menuitem01" ></MenuItem>
                <Separator ></Separator>
               
                <MenuItem Header="Save_S"></MenuItem>
            </MenuItem>
            <MenuItem Header="Eidt_E">
                <MenuItem Header="撤销"></MenuItem>
                <Separator>
                    <Separator.Template>
                        <ControlTemplate>
                            <Border Padding="10" BorderThickness="1" BorderBrush="Azure" CornerRadius="3">
                                <TextBlock HorizontalAlignment="Center">分割</TextBlock>
                            </Border>
                        </ControlTemplate>
                    </Separator.Template>
                </Separator>
                <Border Padding="10" BorderThickness="1" BorderBrush="Azure" CornerRadius="3">
                    <TextBlock HorizontalAlignment="Center">分割</TextBlock>
                </Border>
                <MenuItem Header="删除" InputGestureText="Ctr+D"></MenuItem>
            </MenuItem>
        </Menu>
        <ToolBarTray DockPanel.Dock="Top">
            <ToolBar Band="0" >
                <Button>Line</Button>
                <Button >Rectangle</Button>
            </ToolBar>
            <ToolBar Band="1">
                <Button>Color</Button>
                <Button >Font</Button>
            </ToolBar>
            <ToolBar Band="0" >
                <Button>One</Button>
                <Button >Two</Button>
            </ToolBar>
        </ToolBarTray>
        <StatusBar   DockPanel.Dock="Bottom">
            <!--<StatusBar.ItemTemplate>
                <ItemContainerTemplate>
                    <DockPanel></DockPanel>
                </ItemContainerTemplate>-->
            <!--</StatusBar.ItemTemplate>-->
            <StatusBarItem DockPanel.Dock="Right">账号：</StatusBarItem>
            <StatusBarItem DockPanel.Dock="Top" >状态1</StatusBarItem>
            <StatusBarItem  >状态2</StatusBarItem>
        </StatusBar>
        <ToolBarTray Orientation="Vertical" >
            <ToolBar   >
                <Button  >
                    <Button.Content>
                        <Image Source="/Img/download.png" Width="16" Height="16"></Image>
                    </Button.Content>
                </Button>
                <Button Content="Open"></Button>
                <Button Content="Save"></Button>
                <CheckBox FontWeight="Bold">Bold</CheckBox>
                <CheckBox FontStyle="Italic">Italic</CheckBox>
                <CheckBox >
                    <TextBlock TextDecorations="Underline">UnderLine</TextBlock>
                </CheckBox>
                <ComboBox ToolBar.OverflowMode="Never"  Width="80">

                    <ComboBoxItem>10%</ComboBoxItem>
                    <ComboBoxItem >20%</ComboBoxItem>
                    <ComboBoxItem>30%</ComboBoxItem>


                </ComboBox>
                <Separator></Separator>
            </ToolBar>
        </ToolBarTray>
        
    </DockPanel>
</Window>

1.7，效果：

2，功能区

2.1，使用功能区需要添加程序集System.Windows.Controls.Ribbon。

2.2，引用程序集：

XML 复制代码 
 xmlns:r="clr-namespace:System.Windows.Controls.Ribbon;assembly=System.Windows.Controls.Ribbon"

2.3，为了使快速访问工具栏出现在顶端，需要将默认继承自Window修改为继承自RibbonWindow

cs 复制代码 
 public partial class MainWindow : RibbonWindow
    {
        public MainWindow()
        {
            InitializeComponent();
            
        }
    }
XML 复制代码 
<r:RibbonWindow x:Class="功能区.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:local="clr-namespace:功能区"
        mc:Ignorable="d"
        xmlns:r="clr-namespace:System.Windows.Controls.Ribbon;assembly=System.Windows.Controls.Ribbon"
       
        Title="MainWindow" Height="350" Width="525">
    <Grid>
      
    </Grid>
</r:RibbonWindow>

2.4，示例：

XML 复制代码 
<r:RibbonWindow x:Class="功能区.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:local="clr-namespace:功能区"
        mc:Ignorable="d"
        xmlns:r="clr-namespace:System.Windows.Controls.Ribbon;assembly=System.Windows.Controls.Ribbon"
       
        Title="MainWindow" Height="350" Width="525">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="auto"/>
            <RowDefinition Height="279*"/>
        </Grid.RowDefinitions>
        <Ribbon>
<!--定义快速访问工具栏-->
            <Ribbon.QuickAccessToolBar>
                <RibbonQuickAccessToolBar>
                    <RibbonButton Label="Cut" SmallImageSource="/Img/cut.png"></RibbonButton>
                    <RibbonButton Label="Open" SmallImageSource="/Img/open1.png"></RibbonButton>
                </RibbonQuickAccessToolBar>
            </Ribbon.QuickAccessToolBar>
            <Ribbon.ApplicationMenu>
                <RibbonApplicationMenu SmallImageSource="Img/desktop.png">
                    <RibbonApplicationMenuItem Header="新建" ImageSource="Img/new window.png"></RibbonApplicationMenuItem>
                    <RibbonApplicationMenuItem Header="保存" ImageSource="Img/save.png">
                        <RibbonApplicationMenuItem Header="另存" ImageSource="Img/save-as.png"></RibbonApplicationMenuItem>
                    </RibbonApplicationMenuItem>
                    <RibbonSeparator></RibbonSeparator>
                    <RibbonApplicationMenuItem Header="另存" ImageSource="Img/save-as.png"></RibbonApplicationMenuItem>
                </RibbonApplicationMenu>
            </Ribbon.ApplicationMenu>
            <RibbonTab Header="Home" GroupSizeReductionOrder="ClipBoard,Files">
                <RibbonGroup Header="ClipBoard">
                    <RibbonButton Label="Copy" SmallImageSource="Img/copy.png" LargeImageSource="Img/copy.png"></RibbonButton>
                    <RibbonButton Label="Cut" SmallImageSource="Img/cut.png" LargeImageSource="Img/cut.png"></RibbonButton>
                    <RibbonButton Label="Paste" SmallImageSource="Img/paste.png" LargeImageSource="Img/paste.png" ToolTipTitle="粘贴" ToolTipDescription="对文档进行粘贴等操作" ToolTipImageSource="Img/cut.png" ToolTipFooterTitle="更多信息" ToolTipFooterDescription="按F1获取更多帮助" ToolTipFooterImageSource="Img/help.png"></RibbonButton>
                </RibbonGroup>
                <RibbonGroup Header="ClipBoard">
                    <RibbonButton Label="Copy" SmallImageSource="Img/copy.png" LargeImageSource="Img/copy.png"></RibbonButton>
                    <RibbonButton Label="Cut" SmallImageSource="Img/cut.png" LargeImageSource="Img/cut.png"></RibbonButton>
                    <RibbonButton Label="Paste" SmallImageSource="Img/paste.png" LargeImageSource="Img/paste.png" ToolTipTitle="粘贴" ToolTipDescription="对文档进行粘贴等操作" ToolTipImageSource="Img/cut.png" ToolTipFooterTitle="更多信息" ToolTipFooterDescription="按F1获取更多帮助" ToolTipFooterImageSource="Img/help.png"></RibbonButton>
                </RibbonGroup>
                <RibbonGroup Header="Task">
                    <RibbonButton Label="Copy" SmallImageSource="Img/copy.png" LargeImageSource="Img/copy.png"></RibbonButton>
                    <RibbonButton Label="Cut" SmallImageSource="Img/cut.png" LargeImageSource="Img/cut.png"></RibbonButton>
                    <RibbonButton Label="Paste" SmallImageSource="Img/paste.png" LargeImageSource="Img/paste.png" ToolTipTitle="粘贴" ToolTipDescription="对文档进行粘贴等操作" ToolTipImageSource="Img/cut.png" ToolTipFooterTitle="更多信息" ToolTipFooterDescription="按F1获取更多帮助" ToolTipFooterImageSource="Img/help.png"></RibbonButton>
                </RibbonGroup>
                <RibbonGroup Header="Files">
                    <RibbonButton Label="Copy" SmallImageSource="Img/copy.png" LargeImageSource="Img/copy.png"></RibbonButton>
                    <RibbonButton Label="Cut" SmallImageSource="Img/cut.png" LargeImageSource="Img/cut.png"></RibbonButton>
                    <RibbonButton Label="Paste" SmallImageSource="Img/paste.png" LargeImageSource="Img/paste.png" ToolTipTitle="粘贴" ToolTipDescription="对文档进行粘贴等操作" ToolTipImageSource="Img/cut.png" ToolTipFooterTitle="更多信息" ToolTipFooterDescription="按F1获取更多帮助" ToolTipFooterImageSource="Img/help.png"></RibbonButton>
                </RibbonGroup>
            </RibbonTab>
           
        </Ribbon>
           
      
    </Grid>
</r:RibbonWindow>

注明：

GroupSizeReductionOrder="ClipBoard,Files" ribbonTab中首先被缩小的Group。

快速访问工具栏。Ribbon.QuickAccessToolBar

2.5，效果：

相关推荐
明耀16 小时前
WPF TabControl 设置item不能点击
wpf
军训猫猫头18 小时前
20.抽卡只有金，带保底（WPF） C#
ui·c#·wpf
明耀18 小时前
WPF 设置平均布局 如果隐藏的话，能够自动扩展
wpf
晚安苏州1 天前
WPF DataTemplate 数据模板
wpf
甜甜不吃芥末2 天前
WPF依赖属性详解
wpf
Hat_man_2 天前
WPF制作图片闪烁的自定义控件
wpf
晚安苏州4 天前
WPF Binding 绑定
wpf·wpf binding·wpf 绑定
wangnaisheng4 天前
【WPF】RenderTargetBitmap的使用
wpf
dotent·4 天前
WPF 完美解决改变指示灯的颜色
wpf
orangapple6 天前
WPF 用Vlc.DotNet.Wpf实现视频播放、停止、暂停功能
wpf·音视频
热门推荐
01Cube-Studio：开源大模型全链路一站式中台02ARM学习（31）编译器对overlay方式的支持03玄机平台应急响应—webshell查杀04Ubuntu 20.04使用Livox mid 360 测试 FAST_LIO05校验 GPT-4 真实性的三个经典问题：快速区分 GPT-3.5 与 GPT-4，并提供免费测试网站06Docker 夺命连环 15 问07构建高效的广告投放系统：应用架构的设计与实现08基于大语言模型（LLM）的合成数据生成、策展和评估的综述09(欧拉)openEuler系统添加网卡文件配置流程、(欧拉)openEuler系统手动配置ipv6地址流程、(欧拉)openEuler系统网络管理说明10【一文读懂】NTN（非地面网络）技术介绍