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

點(diǎn)擊下載最新版DotNetBar for WPF

接上文

對(duì)GroupBar中的元素進(jìn)行分組

GroupBar是一個(gè)容器，允許您對(duì)其他元素進(jìn)行分組。

GroupBar實(shí)現(xiàn)功能區(qū)的元素溢出。溢出是將元素從主顯示屏中移除并放置在溢出面板中的位置，因?yàn)楣δ軈^(qū)的寬度不足以容納它們。溢出面板本身包含在彈出窗口中，當(dāng)用戶(hù)單擊組欄的溢出按鈕時(shí)，該彈出窗口將打開(kāi)。如果元素要參與溢出，則它們必須位于GroupBar中。

當(dāng)組欄上有溢出項(xiàng)時(shí)，溢出按鈕會(huì)顯示在未溢出元素的右側(cè)，并且會(huì)顯示一個(gè)字形，指示可以按下該按鈕。將組欄中的所有元素都移入溢出后，溢出按鈕將顯示由組欄的ImageSource屬性指定的圖像（如果有的話(huà)）。

可以通過(guò)組欄的PopupTitle屬性設(shè)置溢出項(xiàng)的標(biāo)題。

與RibbonItem一樣，GroupBar從技術(shù)上講可以包含任何類(lèi)型的UIElement，但是最好使用專(zhuān)為功能區(qū)設(shè)計(jì)的控件，如上一節(jié)中所列。不能放置到組欄中的唯一控件是GalleryBar。像往常一樣，在Xaml中，將元素添加為組欄的直接子元素，在同一件事后面的代碼中，通過(guò)將元素添加到Items集合來(lái)完成，并且對(duì)于數(shù)據(jù)綁定方案，將數(shù)據(jù)對(duì)象的集合綁定到ItemsSource屬性。

調(diào)整父窗口的大小，減小寬度時(shí)，并非所選功能區(qū)的所有元素都適合可用空間，元素將移入溢出狀態(tài)。

設(shè)置溢出順序

元素放入組欄溢出面板的順序由附加的依賴(lài)項(xiàng)屬性RibbonItem.OverflowIndex確定。此屬性是在RibbonItem上定義的，因?yàn)楸M管溢出是由GroupBar管理的，但是相對(duì)于包含的功能區(qū)項(xiàng)目定義了序列。該序列從0開(kāi)始，并且對(duì)于每個(gè)連續(xù)的“跳躍”遞增1，并且序列中不能有任何間隙。換句話(huà)說(shuō)，要放入溢出的第一個(gè)元素是OverflowIndex為0，其后為index 1的元素，依此類(lèi)推。允許具有相同索引的多個(gè)元素。請(qǐng)注意，序列是在功能區(qū)項(xiàng)目中的所有組欄中定義的。例如，假設(shè)功能區(qū)項(xiàng)目中有兩個(gè)組欄，即組欄A和組欄B。

為方便起見(jiàn)，所有專(zhuān)門(mén)為功能區(qū)定義的控件，允許它們成為GroupBar的子控件，盡管它們都映射回了RibbonItem.OverflowIndex附加屬性，但它們都有自己的OverflowIndex屬性。

看下面的例子。前兩個(gè)RibbonRadioButton控件將始終位于頂層（它們不會(huì)溢出），因?yàn)樗鼈儾辉贕roupBar中。要隱藏在溢出中的第一個(gè)項(xiàng)目是Show / Hide GroupBar中的最后一個(gè)RibbonCheckBox，其OverflowIndex =0。其余的將根據(jù)上升的溢出索引進(jìn)行。兩個(gè)OverflowIndex為3的RibbonButtons將同時(shí)移入溢出狀態(tài)。請(qǐng)注意，Zoom GroupBar內(nèi)的第一個(gè)RibbonButton沒(méi)有OverflowIndex的值，表明它將永遠(yuǎn)不會(huì)被放置到溢出中。雖然同一組欄中的最后一個(gè)元素的溢出索引為–1，但始終會(huì)處于溢出狀態(tài)。

<mobile:RibbonItem Header="View">
     <mobile:RibbonRadioButton Content="Edit" IsChecked="True" ImageSource="Images/EditModeIcon.png" />
     <mobile:RibbonRadioButton Content="Read" ImageSource="Images/ReadModeIcon.png" />
     <Separator />
     <mobile:GroupBar PopupTitle="Zoom">
         <mobile:RibbonButton Content="100%" ImageSource="Images/100PercentZoomIcon.png" />
         <mobile:RibbonButton OverflowIndex="3" Content="Zoom Out" />
         <mobile:RibbonButton OverflowIndex="3" Content="Zoom In" />
         <mobile:RibbonCheckBox OverflowIndex="-1" IsChecked="True" Content="Enable Auto Zoom" />
     </mobile:GroupBar>
     <Separator />
     <mobile:GroupBar PopupTitle="Show/Hide" ToolTip="Show/Hide">
         <mobile:RibbonCheckBox OverflowIndex="2" Content="Ruler" />
         <mobile:RibbonCheckBox OverflowIndex="1" Content="Grid" />
         <mobile:RibbonCheckBox OverflowIndex="0" Content="Navigation Pane" />
     </mobile:GroupBar>  </mobile:RibbonItem>

在溢出中排列元素

無(wú)論項(xiàng)目實(shí)際以何種順序移入溢出區(qū)，它們總是以其原始順序放入溢出區(qū)面板中。這無(wú)法更改。但是，可以指定將相鄰的項(xiàng)目放置在同一行中。這是通過(guò)附加的依賴(lài)類(lèi)型為Object的依賴(lài)項(xiàng)屬性GroupBar.OverlowRow完成的。具有相同值的OverflowRow的相鄰元素將共享同一行。

要將分隔符放置在溢出面板中但不在主顯示屏中顯示的行之間，請(qǐng)?jiān)趦蓚€(gè)條目之間插入一個(gè)OverflowSeparator控件。

帶有畫(huà)廊的物品選擇

Gallery是帶有SelectedItem以及其他相關(guān)屬性和事件的ItemsControl。畫(huà)廊中的項(xiàng)目有兩種本機(jī)容器類(lèi)型，GalleryItem和GalleryCategory。畫(huà)廊可以包含一個(gè)或另一個(gè)的集合，或兩者結(jié)合的集合。可以選擇GalleryItem。另一方面，無(wú)法選擇GalleryCategory。其功能僅是組織項(xiàng)目的一種手段。GalleryCategory本身是一個(gè)ItemsControl，其本機(jī)容器類(lèi)型也是GalleryItem。屬于子類(lèi)別的畫(huà)廊項(xiàng)目是完全可以選擇的，就好像它們是父畫(huà)廊本身的子項(xiàng)目一樣。選擇包含在類(lèi)別中的項(xiàng)目時(shí)，該項(xiàng)目（或作為其容器的項(xiàng)目）將成為父庫(kù)的選定項(xiàng)目。

可以通過(guò)屬性SelectedItem設(shè)置或讀取畫(huà)廊的所選項(xiàng)目。與SelectedItem相關(guān)的屬性是SelectedIndex和Value。SelectedIndex是相對(duì)于畫(huà)廊的Items集合的所選項(xiàng)目的索引。在使用類(lèi)別的情況下，所選索引從一個(gè)類(lèi)別的結(jié)尾到下一個(gè)類(lèi)別的開(kāi)頭依次連續(xù)。

值由所選項(xiàng)目與ValuePath屬性一起確定。如果未設(shè)置ValuePath，則Value將等于SelectedItem。如果設(shè)置，它指定相對(duì)于SelectedItem持有的對(duì)象的屬性路徑，該路徑是Value的值。請(qǐng)注意，如果無(wú)法將Value解析為圖庫(kù)中包含的項(xiàng)目（或圖庫(kù)中的類(lèi)別所包含的項(xiàng)目），則SelectedItem將設(shè)置為null，SelectedIndex設(shè)置為-1。

 Gallery和GalleryCategory都具有ItemsPanelOption屬性，可能的值是VerticalSttack，HorizontalStack，VerticalWrap和HorizontalWrap。此屬性是定義自定義ItemsPanel的捷徑（盡管如果需要，您仍然可以使用ItemsPanel。）

使用GalleryCategory的Header屬性指定類(lèi)別標(biāo)題，并使用HeaderTemplate顯示如何呈現(xiàn)它。

GalleryItem是具有IsSelected屬性的控件。將IsSelectable設(shè)置為false將使該項(xiàng)目不可選擇。如果需要，可以使用Command和CommandParameter，以及路由事件“選定”，“未選定”和“單擊”。Content和ContentTemplate定義，以及ImageSource定義視覺(jué)外觀。

有幾個(gè)選項(xiàng)可用于自定義圖庫(kù)項(xiàng)目的外觀。一種是使用父庫(kù)的ItemContainerStyle屬性，即使它們?cè)陬?lèi)別中，該屬性也將應(yīng)用于它們。若要為不同類(lèi)別中的項(xiàng)目定義不同的樣式，請(qǐng)使用GalleryCategory的ItemContainerStyle屬性。如果在Gallery或GalleryCategory上設(shè)置了ItemTemplate，則將其用作畫(huà)廊項(xiàng)目的ContentTemplate。最后，總是有可能定義一個(gè)針對(duì)GalleryItem的隱式樣式。

當(dāng)使用Gallery的ItemContainerStyle屬性時(shí)，該樣式將應(yīng)用于它所包含的GalleryCategory或GalleryItem控件，具體取決于樣式TargetType。

默認(rèn)情況下，畫(huà)廊項(xiàng)目在按下時(shí)是動(dòng)畫(huà)的。若要關(guān)閉此行為，請(qǐng)使用屬性DontAnimateWhenPressed。

您可能會(huì)注意到Gallery是一個(gè)扁平容器，類(lèi)似于ListBox，并且不適合功能區(qū)的主工具欄。它必須顯示在彈出窗口中。有兩個(gè)從Gallery繼承的控件，它們適合功能區(qū)的主工具欄，并使用彈出窗口顯示Gallery項(xiàng)目。這些是GalleryBar和ComboBox。可以用于在彈出窗口中顯示圖庫(kù)的另一個(gè)控件是RibbonPopupButton。接下來(lái)介紹這些控件。

使用GalleryBar快速訪(fǎng)問(wèn)。

GalleryBar控件被設(shè)計(jì)為RibbonItem的直接后代。換句話(huà)說(shuō)，它不能放置在GroupBar中，因此它將始終位于頂層，并且本身不能移入溢出狀態(tài)。但是它確實(shí)有其自身的溢出。

GalleryBar有兩個(gè)集合。第一，它從Gallery繼承的Items集合顯示在彈出窗口中。另一個(gè)是QuickAccessItems集合。它用于顯示在頂層的項(xiàng)目，而無(wú)需打開(kāi)彈出窗口。這個(gè)想法是放置在QuickAccessItems中的項(xiàng)目是Items集合中項(xiàng)目的子集。選擇快速訪(fǎng)問(wèn)項(xiàng)目也會(huì)導(dǎo)致選擇相應(yīng)的圖庫(kù)項(xiàng)目，反之亦然。請(qǐng)注意，快速訪(fǎng)問(wèn)項(xiàng)僅需要與圖庫(kù)項(xiàng)具有相等的值。如果引用相等是不可能的，則沒(méi)有必要。可以使用Xaml或代碼將項(xiàng)目直接添加到QuickAccessItems集合。要在數(shù)據(jù)綁定方案中定義集合，請(qǐng)創(chuàng)建一個(gè)集合并將其綁定到QuiclAccessItemsSource屬性。以下是一個(gè)Xaml示例，該示例顯示了如何添加具有相應(yīng)圖庫(kù)項(xiàng)目的快速訪(fǎng)問(wèn)。請(qǐng)注意，圖庫(kù)項(xiàng)目的“內(nèi)容”將用于在快速訪(fǎng)問(wèn)中的項(xiàng)目與其對(duì)應(yīng)的圖庫(kù)項(xiàng)目之間建立相等性。

<mobile:GalleryBar PopupTitle="Styles" ToolTip="Styles" QuickAccessOverflowIndexes="5,6,11">
     <mobile:GalleryBar.QuickAccessItems>
         <mobile:GalleryItem Content="Normal" IsSelected="True" />
         <mobile:GalleryItem Content="No Spacing" />
         <mobile:GalleryItem Content="Heading 1" FontSize="18" Foreground="Blue" />
     </mobile:GalleryBar.QuickAccessItems>
     <mobile:GalleryItem Content="Normal" />
     <mobile:GalleryItem Content="No Spacing" />
     <mobile:GalleryItem Content="Heading 1" FontSize="21" Foreground="LightSkyBlue" />
     <mobile:GalleryItem Content="Heading 2" FontSize="18" Foreground="LightSkyBlue" />
     <mobile:GalleryItem Content="Title" FontSize="24" />
</mobile:GalleryBar>

使用QuickAccessItemContainerStyle和QuickAccessItemTemplate屬性可自定義快速訪(fǎng)問(wèn)庫(kù)項(xiàng)目的外觀或其內(nèi)容。

與上面討論的GroupBar類(lèi)似，GalleryBar有一個(gè)溢出，用于快速訪(fǎng)問(wèn)項(xiàng)目。使用QuickAccessOverflowIndexes（可枚舉的整數(shù)值）來(lái)指定將項(xiàng)目移入溢出的順序。這些值將按順序應(yīng)用于快速訪(fǎng)問(wèn)項(xiàng)，這樣索引列表中的第一個(gè)值將應(yīng)用于最后一個(gè)快速訪(fǎng)問(wèn)項(xiàng)。重要的是要注意，索引是相對(duì)于父RibbonItem的，與分配給GroupBar中項(xiàng)目的溢出索引完全相同。

使用圖庫(kù)欄的溢出按鈕打開(kāi)顯示圖庫(kù)本身的彈出窗口，該按鈕顯示在快速訪(fǎng)問(wèn)項(xiàng)目的右側(cè)。只要快速訪(fǎng)問(wèn)區(qū)域中有可見(jiàn)的項(xiàng)目，此按鈕的內(nèi)容將是一個(gè)下拉字形。當(dāng)所有項(xiàng)目都移入溢出狀態(tài)時(shí)，將顯示圖像。該圖像通過(guò)GalleryBar的ImageSource屬性設(shè)置。

使用IsDropDownOpen以編程方式打開(kāi)彈出窗口。

您可以使用屬性MaximumPopupHeight指定彈出窗口的最大高度。

使用PopupTitle和PopupTitleTemplate指定彈出窗口的標(biāo)題以及如何呈現(xiàn)它，與GroupBar相同。

使用RibbonComboBox

RibbonComboBox是從Gallery繼承的另一個(gè)控件。它不是WPF ComboBox的后代。原因主要是支持類(lèi)別。RibbonComboBox確實(shí)從標(biāo)準(zhǔn)ComboBox借用了很多屬性，并且行為方式大致相同。

請(qǐng)注意，RibbonComboBox的本機(jī)容器類(lèi)型是RibbonComboBoxItem。將其用作隱式樣式定義的TargetType或設(shè)置為ItemContainerStyle值的樣式。

為方便起見(jiàn)，提供了Header屬性。默認(rèn)情況下，標(biāo)題顯示在實(shí)際組合框的左側(cè)。HeaderTemplate顯示如何呈現(xiàn)Header。

IsDropDownOpen獲取或設(shè)置組合框的下拉菜單是否打開(kāi)。MaxDropDownHeight指定下拉菜單的最大高度。

IsEditable指定所選內(nèi)容顯示在TextBox中還是作為彈出按鈕的內(nèi)容顯示。如果IsEditable為true，則將IsReadOnly應(yīng)用于TextBox并確定用戶(hù)是否可以輸入文本。

要獲取或設(shè)置可編輯文本框的文本，請(qǐng)使用Text屬性。請(qǐng)注意，文本代表組合框的值，而不是其SelectedItem（除非兩者相同）。如果用戶(hù)輸入的文本轉(zhuǎn)換為圖庫(kù)中包含的值，則將選擇該項(xiàng)目。如果該值不在圖庫(kù)中，則SelectedItem設(shè)置為null。如果從文本到值的轉(zhuǎn)換失敗，則可編輯文本框中的文本將還原為開(kāi)始編輯時(shí)的文本。

當(dāng)Text的值更改時(shí)，將引發(fā)TextChanged路由事件。事件處理程序是RoutedPropertyChangedEventHandler <string>。這是在MainWindow中為T(mén)extChanged添加處理程序的示例。下一行來(lái)自窗口的構(gòu)造函數(shù)：

AddHandler(RibbonComboBox.TextChangedEvent, 
           new RoutedPropertyChangedEventHandler<string>(RibbonComboBox_TextChanged), false);  

And here is the handler itself:

private void RibbonComboBox_TextChanged(object sender, RoutedPropertyChangedEventArgs<string> args)  {
     var comboBox = (RibbonComboBox)args.OriginalSource;
     // Loops through all categories.
     foreach (GalleryCategory category in comboBox.Categories)
     { }
     // Loop through all items, from all categories.
     foreach(object item in comboBox.AllItems)
     { }  }

當(dāng)組合框可編輯且不是只讀時(shí)，支持自動(dòng)完成。屬性AutoCompleteOption可以打開(kāi)或關(guān)閉自動(dòng)完成功能，并定義其行為。該屬性是一個(gè)標(biāo)志枚舉，其可能值為Off，ReadOnly，F(xiàn)reeText和DontConvertCase。關(guān)禁用自動(dòng)完成。ReadOnly啟用自動(dòng)完成功能，同時(shí)將輸入限制為圖庫(kù)所包含的值。FreeText啟用自動(dòng)完成功能，并允許用戶(hù)輸入任何文本。可以將DontConvertCase設(shè)置為ReadOnly或FreeText，以使自動(dòng)完成區(qū)分大小寫(xiě)。

像所有旨在放置在RibbonItem或GroupBar中的功能區(qū)控件一樣，RibbonComboBox同時(shí)具有OverflowIndex屬性和SharedOverflowRow屬性。這些在上面有關(guān)GroupBar的部分中進(jìn)行了詳細(xì)討論。

RibbonPopupButton –通用下拉菜單。

RibbonPopupButton是一個(gè)HeaderedItemsControl，帶有一個(gè)切換按鈕和一個(gè)彈出窗口。選中切換按鈕后，將打開(kāi)彈出窗口以顯示項(xiàng)目。

除了ContentPresenter外，RibbonPopupButton沒(méi)有特定的本機(jī)容器類(lèi)型。您可以將任何所需的內(nèi)容放入其中-任何類(lèi)型的Visual或任何類(lèi)型的對(duì)象。如果某項(xiàng)不是可視項(xiàng)（即是數(shù)據(jù)對(duì)象或視圖模型對(duì)象），請(qǐng)確保關(guān)聯(lián)一個(gè)顯示如何渲染它的DataTemplate。（要為對(duì)象定義DataTemplate，請(qǐng)使用ItemTemplate或ItemTemplateSelector屬性，或?yàn)閷?duì)象類(lèi)型定義隱式DataTemplates。）

可以將RibbonPopupButton放在另一個(gè)RibbonPopupButton內(nèi)。當(dāng)第二個(gè)按鈕的彈出窗口打開(kāi)時(shí)，它將替換其父級(jí)的彈出窗口，并且在彈出窗口的標(biāo)題旁邊將有一個(gè)后退按鈕，允許用戶(hù)關(guān)閉第二個(gè)彈出窗口并返回到第一個(gè)彈出窗口。

使用IsOpen屬性獲取或設(shè)置彈出窗口是否打開(kāi)。MaximumPopupHeight和MaximumPopupWidth定義彈出窗口的大小。與往常一樣，PopupTitle設(shè)置彈出內(nèi)容的標(biāo)題，而PopupTitleTemplate顯示如何呈現(xiàn)它。如果需要，可以使用PopupPadding設(shè)置彈出內(nèi)容的填充。

切換按鈕的內(nèi)容由Header和HeaderTemplatte屬性定義。使用ImageSource添加一個(gè)沒(méi)有標(biāo)題的圖片。或者，為了獲得更大的靈活性，可以使用Icon和IconTemplate代替ImageSource。默認(rèn)樣式添加了默認(rèn)的下拉字形。

Qt常用組件：

• QtitanRibbon| 下載試用: 遵循Microsoft Ribbon UI Paradigm for Qt技術(shù)的Ribbon UI組件，致力于為Windows、Linux和Mac OS X提供功能完整的Ribbon組件。
• QtitanChart | 下載試用 :是一個(gè)C ++庫(kù)，代表一組控件，這些控件使您可以快速地為應(yīng)用程序提供漂亮而豐富的圖表。并且支持所有主要的桌面操作系統(tǒng)。
• QtitanDataGrid | 下載試用 :這個(gè)Qt數(shù)據(jù)網(wǎng)格組件使用純C++創(chuàng)建，運(yùn)行速度極快，處理大數(shù)據(jù)和超大數(shù)據(jù)集的效果突出。QtitanDataGrid完全集成了QtDesigner，因而極易適應(yīng)其他相似的開(kāi)發(fā)環(huán)境，保證100%兼容Qt GUI。