Mahhala – Fluent Ribbon Control Suite

Mahhala (isiZulu word for free or without charge) is a new series that showcases some of the cool free WPF/Silverlight controls available…

“You can learn a lot by reading other people's source code. That's the idea behind this series, "The Weekly Source Code." You can certainly become a better programmer by writing code but I think good writers become better by reading as much as they can.” - Scott Hanselman

Not many applications can claim they revolutionize software design… but somehow, office is always the ONE everyone is compared too! Take the ribbon as a example… Like it or not, it has changed the way menus are designed!!! This week, we chat with the creator of the Fluent Ribbon Control Suite, one of the most complete implementations of the Office ribbon.

Source: http://fluent.codeplex.com/

License: Microsoft Public License (Ms-PL)

RG - Welcome Daniel, tell us a little about yourself?

DD - I like to develop desktop application with interactive user interface. I derive pleasure from control development. Primarily I develop 3D and 2D desktop application using WPF, DirectX, XNA.

RG - What is the Fluent Ribbon Control Suite?

DD - Fluent Ribbon Control Suite is a library that implements an Office-like (Microsoft® Office Fluent™ user interface) for the Windows Presentation Foundation (WPF). It provides well-customized controls such as RubbonTabControl, Backstage, Gallery, QuickAccessToolbar, ScreenTip and so on. It is bundled with the most up-to-date Office 2010 styles.

RG - How does this differ from the one available from Microsoft?

DD - Actually we haven’t even BETA (only CTP) of Microsoft’s one, so I do not know how it will be. Hmm, for example, I can say that our Ribbon does not have any strange RibbonCommand. We are relying on regular WPF commands. Fluent is very friendly to MVVM. We provide complete control suite to develop applications with Microsoft® Office Fluent™ user interface. We are very carefully following the guidelines.

If you are reading this and never used the Microsoft ribbon CTP, check out how complicated it is creating a ribbon using it:

<ribbon:RibbonWindow x:Class="WpfApplication1.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:ribbon="clr-namespace:Microsoft.Windows.Controls.Ribbon;
		assembly=RibbonControlsLibrary"
        Title="MainWindow" Height="350" Width="525">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition Height="*" />            
        </Grid.RowDefinitions>
        <ribbon:Ribbon>
            <ribbon:RibbonTab Label="Tab">
                <ribbon:RibbonGroup>
                    <ribbon:RibbonGroup.Command>
                        <ribbon:RibbonCommand LabelTitle="Group" />
                    </ribbon:RibbonGroup.Command>
                    <ribbon:RibbonButton>
                        <ribbon:RibbonButton.Command>
                            <ribbon:RibbonCommand LabelTitle="Button" 
				Executed="RibbonCommand_Executed" />
                        </ribbon:RibbonButton.Command>                        
                    </ribbon:RibbonButton>
                </ribbon:RibbonGroup>    
            </ribbon:RibbonTab>
        </ribbon:Ribbon>
    </Grid>
</ribbon:RibbonWindow>

Why do I need all these RibbonCommands just to create this?

Well, here is the Fluent way…

<ribbon:RibbonWindow x:Class="WpfApplication1.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:ribbon="clr-namespace:Fluent;assembly=Fluent"
        Title="MainWindow" Height="350" Width="525">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition Height="*" />            
        </Grid.RowDefinitions>
        <ribbon:Ribbon>
            <ribbon:RibbonTabItem Header="Tab">
                <ribbon:RibbonGroupBox Header="Group">
                    <ribbon:Button Text="Button" Click="Button_Click" />          
                </ribbon:RibbonGroupBox>
            </ribbon:RibbonTabItem>
        </ribbon:Ribbon>
    </Grid>
</ribbon:RibbonWindow>

Slightly easier to understand!

Oooo, and 100% Office 2010 themes… no more ugly Office 2007 :)

The other “feature” I love about the fluent implementation is that it has support for Backstage… Here is a feature comparison:

I heard rumours that the FULL Microsoft version will be released shortly after WPF 4? We will wait and see…

Next week, I will chat with Ado, the creator of AvalonDock.