天天看點

WPF 4 Ribbon 開發 之 應用程式菜單(Application Menu)RibbonCommandApplicationMenuApplicationButton

原文: WPF 4 Ribbon 開發 之 應用程式菜單(Application Menu)      在 上一篇 中我們完成了快捷工具欄的開發,本篇将講解應用程式菜單開發的相關内容。如下圖所示,點選程式視窗左上角的記事本圖示(Application Button)會顯示出應用程式菜單(Application Menu)清單,清單中的按鍵即為軟體的一些基本功能。

WPF 4 Ribbon 開發 之 應用程式菜單(Application Menu)RibbonCommandApplicationMenuApplicationButton

RibbonCommand

以“Open”按鍵為例,首先仍然需要在<RibbonWindow.Resources>中定義其<RibbonCommand>内容。

<r:RibbonCommand x:Key="OpenCommand" LabelTitle="Open"
                 CanExecute="OpenCommand_CanExecute"
                 Executed="OpenCommand_Executed"
                 SmallImageSource="Images/Open.png"
                 LargeImageSource="Images/Open.png"
                 ToolTipTitle="Open" 
ToolTipDescription="Open document" />
      
http://11011.net/software/vspaste

為<RibbonCommand>添加Command 事件實作打開文檔功能:

private void OpenCommand_CanExecute(object sender, CanExecuteRoutedEventArgs e)
{
    e.CanExecute = true;
}

private void OpenCommand_Executed(object sender, ExecutedRoutedEventArgs e)
{
    ShellContainer sc = KnownFolders.DocumentsLibrary as ShellContainer;
    CommonOpenFileDialog cofd = new CommonOpenFileDialog();
    cofd.InitialDirectoryShellContainer = sc;
    cofd.DefaultExtension = ".txt";
    cofd.Filters.Add(new CommonFileDialogFilter("Text Files", "*.txt"));
    if (cofd.ShowDialog() == CommonFileDialogResult.OK)
    {
        txtBox.Text = File.ReadAllText(cofd.FileName, Encoding.Default);
    }
}      

ApplicationMenu

     <RibbonCommand>完成後繼續在<Ribbon>中添加<RibbonApplicationMenu>用于設定菜單清單中的内容。其中<RibbonApplicationMenuItem>即為菜單按鍵,将相應的<RibbonCommand>添加到Command 屬性中。另,按鍵之間可用<Separator>作為分隔。

<r:Ribbon DockPanel.Dock="Top" FocusManager.IsFocusScope="True" Title="WPF4 Notepad">
    <r:Ribbon.ApplicationMenu>
        <r:RibbonApplicationMenu Command="{StaticResource AppMenuCommand}">
            <r:RibbonApplicationMenuItem Command="{StaticResource OpenCommand}" />
            <r:RibbonApplicationMenuItem Command="{StaticResource SaveCommand}" />
            <Separator/>
            <r:RibbonApplicationSplitMenuItem Command="{StaticResource SendAsCommand}">
                <r:RibbonApplicationMenuItem Command="{StaticResource MailCommand}" />
                <r:RibbonApplicationMenuItem Command="{StaticResource TwitterCommand}" />
            </r:RibbonApplicationSplitMenuItem>
            <Separator/>
            <r:RibbonApplicationMenuItem Command="{StaticResource CloseCommand}" />
        </r:RibbonApplicationMenu>
    </r:Ribbon.ApplicationMenu>
</r:Ribbon>
      
http://11011.net/software/vspaste

     上面代碼中對于存在子菜單的按鍵(例如,SendAs 按鍵)可用<RibbonApplicationSplitMenuItem>對其進行擴充。子菜單标題内容可通過<RibbonCommand>的LabelDescription 屬性進行設定(如下代碼)。

<r:RibbonCommand x:Key="SendAsCommand" LabelTitle="SendAs"
                 LabelDescription="Send this text to the World"
                 CanExecute="SendAsCommand_CanExecute"
                 SmallImageSource="Images/SendAs.png"
                 LargeImageSource="Images/SendAs.png"
                 ToolTipTitle="SendAs" 
                 ToolTipDescription="Send this text to the World" />
      
WPF 4 Ribbon 開發 之 應用程式菜單(Application Menu)RibbonCommandApplicationMenuApplicationButton

ApplicationButton

     最後來完成應用程式菜單圖示(記事本圖示)的開發。當然也需要通過<RibbonCommand>進行設定,與之前不同之處在于不用添加CanExecute 和Executed 内容。

<r:RibbonCommand x:Key="AppMenuCommand" LabelTitle="Application Button"
                 SmallImageSource="Images/Notepad.png"
                 LargeImageSource="Images/Notepad.png"
                 ToolTipTitle="WPF4 Notepad" 
                 ToolTipDescription="Notepad Application with Ribbon Sample" />      

     将<RibbonCommand>加入<RibbonApplicationMenu> Command 屬性後預設情況呈現下圖樣式,圖示的形狀并不與Office 2007 一樣為圓形。

WPF 4 Ribbon 開發 之 應用程式菜單(Application Menu)RibbonCommandApplicationMenuApplicationButton

     如果想要圓形效果其實也很簡單,Ribbon 控件庫為我們提供了三種樣式模闆:Office2007Black、Office2007Blue、Office2007Silver,隻需在MainWindow() 中加入一行代碼即可實作圓形效果和不同的Ribbon 樣式。

public MainWindow()
{
    InitializeComponent();
    this.Resources.MergedDictionaries.Add(PopularApplicationSkins.Office2007Black);
}      
http://11011.net/software/vspaste
WPF 4 Ribbon 開發 之 應用程式菜單(Application Menu)RibbonCommandApplicationMenuApplicationButton
WPF 4 Ribbon 開發 之 應用程式菜單(Application Menu)RibbonCommandApplicationMenuApplicationButton
WPF 4 Ribbon 開發 之 應用程式菜單(Application Menu)RibbonCommandApplicationMenuApplicationButton

     本篇關于應用程式菜單的開發就介紹到這裡,下篇将正式進行标簽工具欄(Tab Toolbar)的開發内容。同時本示例源代碼也将一同公布。敬請關注… …