DotNetBar for WPF是一個用于創建專業WPF應用并擁有超過38個原生WPF控件的工具箱，其中包含了新的日程安排控件、Wpf-Ribbon控件、具有Office樣式的Ribbon控件和Wpf-Dock控件以及具有OfficeOutlook樣式的Navigation Pane控件等。對于日期輸入，DotNetBar for WPF還提供了Date/Time Picker、Numeric Input、Month-calendar以及TabNavigation等控件。

點擊下載最新版DotNetBar for WPF

創建一個移動應用程序

要創建一個使用MobileRibbon的移動應用程序，請從一個基本的WPF應用程序開始，并添加對DevComponents.WPF.Mobile的引用。為了正常工作，MobileRibbon需要生活在一個MobileWindow里面，所以你要把MainWindow的基類改為MobileWindow。一旦您有了一個MobileWindow，下一步就是設置MobileTheme。所選的MobileTheme設置了色帶的主色調（藍色、綠色、橙色或紫色）。此外，它還定義了一組在整個移動命名空間中使用的全局資源。附加的依賴屬性MobileTheme.ApplicationTheme設置了主題，它可以是內置的主題之一，也可以是你定義的自定義主題。下面是一個例子，它將被放在MobileWindow的xaml的主屬性部分。

mobile:MobileTheme.ApplicationTheme="{x:Static mobile:MobileTheme.BlueTheme}"

MobileWindow的顯著屬性是：

• ChromeStyle –確定窗口鑲邊的外觀。可能的值為無，默認（標準Windows 10桌面鑲邊），Windows10，Office2013和ExtendedRibbon（鑲邊延伸到功能區中并且顏色相同）。
• ShowFullScreenButton –確定鑲邊是否具有將窗口置于全屏模式的按鈕。
• ChromeToolBarItems –用于將自定義工具欄項目添加到xaml中的鑲邊或后面的代碼中。（將ChromeToolBarItemsSourcee用于數據綁定方案。）

添加設置彈出

在進入功能區之前，我們先來看看如何在窗口中添加一個SettingsFlyout。雖然布局通常是通過位于ribbon后臺的 "Settings"按鈕打開的，但SettingsFlyout控件本身并不位于ribbon內部。相反，它是窗口的一個子控件。SettingsFlyout應該以這樣的方式添加到窗口的根網格中，當打開時，它能夠跨越窗口的全部高度和寬度。例如，如果根網格有2行和2列，那么flyout應該將Grid.RowSpan和Grid.ColumnSpan都設置為2。

添加彈出框后，可以設置其頁眉和頁腳屬性。當未選擇任何項目時，兩者都將顯示在主視圖中，同時顯示項目列表。

SettingsFlyout是SettingsFlyoutItem控件的容器。SettingsFlyoutItem同時具有Content和Header屬性。彈出菜單的主視圖中列出了所有項目的標題，未選擇任何項目時將顯示該視圖。選擇一個項目時，將同時顯示標題和內容。

SettingsFlyoutItem不需要Content才有用。在這種情況下，你可以設置一個Command(和可選的CommandParameter)，或者你可以處理項目的Clicked事件并做任何需要的事情。如果你想在一個項目被點擊時關閉飛出，將ClosesFlyout設置為true。如果你需要flyout保持打開，但不希望項目被選中，你也可以將IsSelectable設置為false。

添加功能區

MobileRibbon應該插入到窗口的根網格的第一行中，并允許跨所有列。

MobileRibbon可以顯示與窗口標題不同的標題。TitleTemplate顯示如何呈現Title。如果您為“標題”設置了一個值但想要隱藏它，請使用HideTitle屬性。

功能區具有一個內部工具欄，您可以在其中放置與主顯示區分開的按鈕和其他控件-在項目標題的右側。要將對象放入xaml或后面的代碼中，請使用ToolBarItems屬性。對于數據綁定方案，將對象放入綁定到ToolBarItemsSource屬性的集合中。這是xaml中的示例：

<mobile:Ribbon>     
    <mobile:Ribbon.ToolBarItems>         
        <Button controls:ControlBehavior.ImageSource="Images/smiley.png" Click="FeedBackButton_Click" />         
        <Button controls:ControlBehavior.ImageSource="Images/question.png" Click="QuestionButton_Click" />                     
    </mobile:Ribbon.ToolBarItems>
</mobile:Ribbon>

色帶可以折疊。當折疊時，包含所選色帶項目內容的底部條帶將被隱藏。Ribbon可以通過IsCollapsed屬性手動折疊和展開。也可以通過AutoCollapseOption屬性將ribbon設置為自動折疊。 AutoCollapseOption是一個枚舉，可能的值為None和WhenSelectedRibbonItemClicked。如果設置為后者，那么顧名思義，當用戶點擊已經選中的ribbon項目時，ribbon將自動折疊。WhenSelectedRibbonItemClicked是AutoCollapseOption的默認值。

設置后臺將在下一節介紹。但ribbon本身也有與后臺相關的屬性，這里就不贅述了。默認情況下，如果你設置了一個后臺，那么用來打開后臺的按鈕就會被顯示出來，如果沒有后臺，按鈕就不會被顯示出來。可以通過ShowBackstageButton屬性來覆蓋這個行為。后臺按鈕的內容是通過BackstageButtonContent來設置的，而BackstageButtonContentTemplate則顯示了如何渲染它。如果你需要知道后臺是否打開，使用IsBackstageOpen。

添加后臺

功能區的后臺由Backstage控件實現。要將后臺添加到功能區，請創建一個Backstage控件，并將其設置為功能區的Backstage屬性的值。或者，您可以將數據對象綁定到Backstage屬性，并使用在其根目錄處帶有Backstage的隱式DataTemplate。

Backstage是BackStageItem控件的容器。BackStageItem與上述的SettingsFlyoutItem非常相似。實際上，兩者之間的唯一區別是SettingsFlyoutItem具有其ClosesFlyout屬性，而BackstageItem具有名為ClosesBackstage的屬性。由于它們在功能上相同，因此它們的行為相同并且以相同的方式使用。

關于Backstage和SettingsFlyout值得注意的是，通常使用Backstage中的按鈕來打開設置彈出窗口。為了實現這一點，已將名為OpenSettingsFlyoutCommand的RoutedCommand定義為MobileWindow的靜態屬性。通過將其設置為后臺項目的命令，您的用戶可以從后臺打開設置。例如：

<mobile:BackstageItem Header="Settings"                        
                      IsSelectable="False"
                      ClosesBackstage="True" 
                      Command="{x:Static mobile:MobileWindow.OpenSettingsFlyoutCommand}" />

MobileRibbon是MobileRibbonItem控件的容器。在Xaml中，MobileRibbonItem控件可以作為Ribbon的子控件直接添加。在后面的代碼中，你會把它們添加到ribbon的Items集合中。在數據綁定方案中，創建一個數據對象集合，并將其綁定到ribbon的ItemsSource屬性。

RibbonItem的Header屬性指定了在ribbon的標簽部分顯示的對象。使用HeaderTemplate來展示如何渲染Header。

當用戶點擊一個ribbon項的頭部時，它的Click事件會被觸發，它的Command會被執行（如果它有Command的話），并被選中。要以編程方式設置一個ribbon項是否被選中，請使用它的IsSelected屬性。當IsSelected屬性發生變化時，無論是通過用戶操作還是編程，ribbon項都會根據情況引發Selected/Unselected事件。這兩個事件都是路由事件。

從技術上講，可以將任何類型的UIElement添加到RibbonItem的Items集合中，并在選擇RibbonItem時顯示。元素可以作為直接子級添加到Xaml中。對于后面的代碼，請使用Items集合，對于數據綁定方案，請創建數據對象的集合并將其綁定到ItemsSource屬性。RibbonItem沒有ItemTemplate屬性，因此，如果確實將數據對象放入其中，則還需要定義一個隱含的DataTemplate，以數據對象的Type為目標，該Type顯示應如何呈現它們。

即使可以將任何類型的UIElement添加到RibbonItem，也要實現與功能區的內置樣式和行為的兼容性，請使用專門為其設計和實現的控件。這些是：

• GroupBar –用于將彼此相關的其他元素分組的容器。有一個按鈕，用于打開一個彈出窗口以顯示溢出項。
• 畫廊–用于收集可選項目的容器，一次可以選擇一個（或零個）。支持項目類別。
• GalleryBar –具有按鈕的畫廊，該按鈕可打開用于顯示其項目的彈出窗口。可以在主顯示中顯示項目的子集。
• RibbonComboBox –功能正常的組合框，但基于Gallery以便支持類別。
• RibbonPopupButton –一個項目集合的容器，顯示為一個按鈕。當按下按鈕時，將打開一個彈出窗口以顯示項目。
• RibbonButton –用屬性和功能擴展ButtonBase（在Windows.Controls.Primitives中），以支持與功能區的兼容性并簡化您（程序員）的工作。
• RibbonToggleButton –從RibbonButton派生的切換按鈕。
• RibbonRadioButton –從RibbonToggleButton派生的單選按鈕。
• RibbonCheckBox –從RibbonToggle Butt派生的復選框。

其中，GroupBar通常是功能區項目的子項，因為它是所有其他項目（GalleryBar除外）的容器，并且支持溢出。

使用分隔符在功能區項目的兩個元素之間放置一條垂直線。

下一章節將繼續講解對GroupBar中的元素進行分組，設置溢出順序等。