Fluent Ribbon 第三步 应用程序菜单
上一節,完成了Ribbon工具欄上部分控件的創建,本節主要介紹菜單控件的創建 。
Menu菜單,菜單有二種表現形式,下面分別介紹二種標識形式的樣式:
1、ApplicationMenu
應用程序菜單,和我們傳統的菜單形式比較相似,其主要是由眾多MenuItem組成,其MenuItem之間可以層級嵌套,其分割區域可以使用Separator和IsSplited進行區分,其基本的定義如下:
<Fluent:ApplicationMenu Header="應用程序菜單">
<Fluent:MenuItem Header="新創建" Icon="Images/GreenLarge.png">
<Fluent:MenuItem Header="項目" Icon="Images/GreenLarge.png" />
<Fluent:MenuItem Header="組件" Icon="Images/GreenLarge.png" />
</Fluent:MenuItem>
<Fluent:MenuItem Header="保存到..." Icon="Images/BlueLarge.png">
<Fluent:MenuItem Header="標準格式1"
Description="這是一個關于當前功能的描述"
ToolTip="提示信息"
Icon="Images/BlueLarge.png" />
<Fluent:MenuItem Header="標準格式2"
Description="這是一個關于當前功能的描述"
ToolTip="提示信息"
Icon="Images/BlueLarge.png" />
</Fluent:MenuItem>
<Fluent:MenuItem Header="退出"
Icon="Images/RedLarge.png"
KeyTip="X"
/>
</Fluent:ApplicationMenu>
其表現形式如下圖:
Backstage和office中的文件功能很相似,其主要是菜單全屏瀏覽的作用
其定義方式如下:
<Fluent:Ribbon.Menu>
<Fluent:Backstage Header="項目">
<Fluent:BackstageTabControl>
<Fluent:Button Header="保存"
Icon="Images/Save.png"
KeyTip="S" />
<Fluent:Button Header="保存為.."
Icon="Images/Save.png"
KeyTip="A"
CanAddToQuickAccessToolBar="False"
/>
<Fluent:Button Header="關閉"
Icon="Images/Exit.png"
KeyTip="X"
Command="{Binding ExitCommand}" />
</Fluent:BackstageTabControl>
</Fluent:Backstage>
</Fluent:Ribbon.Menu>
以上代碼,點擊項目菜單后,其主要表現button按鈕的效果,其顯示效果如下圖所示:
顯示的效果,右邊是一片空白,如何在右邊添加內容呢由于button按鈕只能做到按鈕的作用,故需要使用BackstageTabItem控件,實現右邊具有內容。
BackstageTabItem控件的使用采用如下方式:
<Fluent:Ribbon.Menu>
<Fluent:Backstage Header="項目">
<Fluent:BackstageTabControl>
<Fluent:BackstageTabItem Header="新建" KeyTip="T">
<StackPanel Orientation="Vertical">
<TextBlock>你是否需要新建一個新項目?</TextBlock>
<Fluent:Button Header="項目1" Width="120" Style="{DynamicResource ButtonBackstageStyle}" />
<Fluent:Button Header="項目2" Width="120" Style="{DynamicResource ButtonBackstageStyle}" />
</StackPanel>
</Fluent:BackstageTabItem>
<Fluent:Button Header="保存"
Icon="Images/Save.png"
KeyTip="S" />
<Fluent:Button Header="保存為.."
Icon="Images/Save.png"
KeyTip="A"
CanAddToQuickAccessToolBar="False"
/>
<Fluent:Button Header="關閉"
Icon="Images/Exit.png"
KeyTip="X"
Command="{Binding ExitCommand}" />
</Fluent:BackstageTabControl>
</Fluent:Backstage>
</Fluent:Ribbon.Menu>
以上代碼,產生的效果如下:
BackstageTabItem 控件中可以添加各種元素,保證其顯示結果。
轉載于:https://www.cnblogs.com/minhost/p/7232409.html
總結
以上是生活随笔為你收集整理的Fluent Ribbon 第三步 应用程序菜单的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: VS2013 生成时复制文件或目录到指定
- 下一篇: tail -f 不断刷新