Ribbon for WPF 发布 和使用教程 (Microsoft)

之前写过几篇关于WPF4 中开发Ribbon 工具栏的文章,其中利用的是 WPF Ribbon Control 控件库,开发出类似Office 2007 样式的Ribbon 工具栏。当然CodePlex 也提供了 Fluent Ribbon Control Suite 项目可以写出Office 2010 样式的工具栏应用程序。8月2日微软正式发布了Microsoft Ribbon for WPF,该Ribbon 控件是100%完全属于的WPF 工具,并支持WPF3.5 SP1 以及WPF4。

下载安装

     首先下载 MSI 安装程序。Microsoft Ribbon for WPF Source and Samples.msi 程序包括一些源码及实例,安装后VS2010 版的项目开发包MicrosoftRibbonForWPFSourceAndSamples.zip 会释放在C:\Program Files\Microsoft Ribbon for WPF\v3.5.40729.1 目录中。

     Microsoft Ribbon for WPF.msi 程序就是我们真正需要的东西,程序安装后打开VS2010 新建项目,在Windows 模板中可以看到"WPF Ribbon Application" 的选项。

Ribbon for WPF 发布 和使用教程 (Microsoft)_第1张图片

Ribbon for WPF 发布 和使用教程 (Microsoft)_第2张图片

VS2010 演示

新建项目后,一个默认Ribbon 模型已经为我们编写好了。

Ribbon for WPF 发布 和使用教程 (Microsoft)_第3张图片

看看XAML 代码,与原来用过的WPF Ribbon Control 也无太多差异。



    
        
            
            
        

        
            
                
                    
                
            
            
                
                    

                    
                    
                    

                

            
        

    

Blend4 演示

     更令人兴奋的是该Ribbon 库同样支持Blend4,这样可以更方便的设计Ribbon 工具栏样式。打开Blend4 新建项目也能看到"WPF Ribbon Application"的选项。

Ribbon for WPF 发布 和使用教程 (Microsoft)_第4张图片

在控件库里也有不少的Ribbon 控件供大家使用。

Ribbon for WPF 发布 和使用教程 (Microsoft)_第5张图片

在当前项目基础上,拖拽一个RibbonTab 进来,并将Tab 命名为"MyTab"。

Ribbon for WPF 发布 和使用教程 (Microsoft)_第6张图片 

Ribbon for WPF 发布 和使用教程 (Microsoft)_第7张图片

在设计窗口调整MyTab 区域范围。

Ribbon for WPF 发布 和使用教程 (Microsoft)_第8张图片

Tab 标签设计完成后,继续在MyTab 中添加MyGroup 组,为了设计方便先将Home 标签隐藏。

Ribbon for WPF 发布 和使用教程 (Microsoft)_第9张图片

调整MyGroup 区域范围。

Ribbon for WPF 发布 和使用教程 (Microsoft)_第10张图片

在MyGroup 中添加RibbonButton 和RibbonCheckBox 控件,并为RibbonButton 设置一个Small 图标。

Ribbon for WPF 发布 和使用教程 (Microsoft)_第11张图片

Ribbon for WPF 发布 和使用教程 (Microsoft)_第12张图片

接下来为添加RibbonButton 和RibbonCheckBox 一些简单的事件。

private void ribbonButton_Click(object sender, RoutedEventArgs e)
{
    // TODO: Add event handler implementation here.
    MessageBox.Show("Button Clicked.");
}

Ribbon for WPF 发布 和使用教程 (Microsoft)_第13张图片

private void RibbonCheckBox_Checked(object sender, RoutedEventArgs e)
{
    // TODO: Add event handler implementation here.
    MessageBox.Show("Checked.");
}

Ribbon for WPF 发布 和使用教程 (Microsoft)_第14张图片

private void RibbonCheckBox_Unchecked(object sender, RoutedEventArgs e)
{
    // TODO: Add event handler implementation here.
    MessageBox.Show("UnChecked.");
}

Ribbon for WPF 发布 和使用教程 (Microsoft)_第15张图片

     通过上面的简单的演示,本次微软发布的Ribbon  for WPF 的确为我们开发Ribbon 工具栏省了不少事,不必为繁琐的嵌套XAML 代码发愁了。感兴趣的朋友可以阅读MicrosoftRibbonForWPFSourceAndSamples.zip 中的源代码学习更为复杂的Ribbon 工具栏。

Ribbon for WPF 发布 和使用教程 (Microsoft)_第16张图片

Ribbon for WPF 发布 和使用教程 (Microsoft)_第17张图片

相关参考

1. Ribbon for WPF

2. WPF 4 Ribbon 开发 之 快捷工具栏(Quick Access Toolbar)

3. WPF 4 Ribbon 开发 之 应用程序菜单(Application Menu)

4. WPF 4 Ribbon 开发 之 标签工具栏(Tab Toolbar)


你可能感兴趣的:(软件产品设计,wpf,microsoft,2010,button,application,工具)