翻譯|行業(yè)資訊|編輯:鮑佳佳|2021-01-19 11:54:41.723|閱讀 436 次
概述:要創(chuàng)建一個使用MobileRibbon的移動應(yīng)用程序,請從一個基本的WPF應(yīng)用程序開始,并添加對DevComponents.WPF.Mobile的引用。
# 界面/圖表報表/文檔/IDE等千款熱門軟控件火熱銷售中 >>
DotNetBar for WPF是一個用于創(chuàng)建專業(yè)WPF應(yīng)用并擁有超過38個原生WPF控件的工具箱,其中包含了新的日程安排控件、Wpf-Ribbon控件、具有Office樣式的Ribbon控件和Wpf-Dock控件以及具有OfficeOutlook樣式的Navigation Pane控件等。對于日期輸入,DotNetBar for WPF還提供了Date/Time Picker、Numeric Input、Month-calendar以及TabNavigation等控件。
創(chuàng)建一個移動應(yīng)用程序
要創(chuàng)建一個使用MobileRibbon的移動應(yīng)用程序,請從一個基本的WPF應(yīng)用程序開始,并添加對DevComponents.WPF.Mobile的引用。為了正常工作,MobileRibbon需要生活在一個MobileWindow里面,所以你要把MainWindow的基類改為MobileWindow。一旦您有了一個MobileWindow,下一步就是設(shè)置MobileTheme。所選的MobileTheme設(shè)置了色帶的主色調(diào)(藍(lán)色、綠色、橙色或紫色)。此外,它還定義了一組在整個移動命名空間中使用的全局資源。附加的依賴屬性MobileTheme.ApplicationTheme設(shè)置了主題,它可以是內(nèi)置的主題之一,也可以是你定義的自定義主題。下面是一個例子,它將被放在MobileWindow的xaml的主屬性部分。
mobile:MobileTheme.ApplicationTheme="{x:Static mobile:MobileTheme.BlueTheme}"
MobileWindow的顯著屬性是:
添加設(shè)置彈出
在進(jìn)入功能區(qū)之前,我們先來看看如何在窗口中添加一個SettingsFlyout。雖然布局通常是通過位于ribbon后臺的 "Settings"按鈕打開的,但SettingsFlyout控件本身并不位于ribbon內(nèi)部。相反,它是窗口的一個子控件。SettingsFlyout應(yīng)該以這樣的方式添加到窗口的根網(wǎng)格中,當(dāng)打開時,它能夠跨越窗口的全部高度和寬度。例如,如果根網(wǎng)格有2行和2列,那么flyout應(yīng)該將Grid.RowSpan和Grid.ColumnSpan都設(shè)置為2。
添加彈出框后,可以設(shè)置其頁眉和頁腳屬性。當(dāng)未選擇任何項目時,兩者都將顯示在主視圖中,同時顯示項目列表。
SettingsFlyout是SettingsFlyoutItem控件的容器。SettingsFlyoutItem同時具有Content和Header屬性。彈出菜單的主視圖中列出了所有項目的標(biāo)題,未選擇任何項目時將顯示該視圖。選擇一個項目時,將同時顯示標(biāo)題和內(nèi)容。
SettingsFlyoutItem不需要Content才有用。在這種情況下,你可以設(shè)置一個Command(和可選的CommandParameter),或者你可以處理項目的Clicked事件并做任何需要的事情。如果你想在一個項目被點擊時關(guān)閉飛出,將ClosesFlyout設(shè)置為true。如果你需要flyout保持打開,但不希望項目被選中,你也可以將IsSelectable設(shè)置為false。
添加功能區(qū)
MobileRibbon應(yīng)該插入到窗口的根網(wǎng)格的第一行中,并允許跨所有列。
MobileRibbon可以顯示與窗口標(biāo)題不同的標(biāo)題。TitleTemplate顯示如何呈現(xiàn)Title。如果您為“標(biāo)題”設(shè)置了一個值但想要隱藏它,請使用HideTitle屬性。
功能區(qū)具有一個內(nèi)部工具欄,您可以在其中放置與主顯示區(qū)分開的按鈕和其他控件-在項目標(biāo)題的右側(cè)。要將對象放入xaml或后面的代碼中,請使用ToolBarItems屬性。對于數(shù)據(jù)綁定方案,將對象放入綁定到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>
色帶可以折疊。當(dāng)折疊時,包含所選色帶項目內(nèi)容的底部條帶將被隱藏。Ribbon可以通過IsCollapsed屬性手動折疊和展開。也可以通過AutoCollapseOption屬性將ribbon設(shè)置為自動折疊。 AutoCollapseOption是一個枚舉,可能的值為None和WhenSelectedRibbonItemClicked。如果設(shè)置為后者,那么顧名思義,當(dāng)用戶點擊已經(jīng)選中的ribbon項目時,ribbon將自動折疊。WhenSelectedRibbonItemClicked是AutoCollapseOption的默認(rèn)值。
設(shè)置后臺將在下一節(jié)介紹。但ribbon本身也有與后臺相關(guān)的屬性,這里就不贅述了。默認(rèn)情況下,如果你設(shè)置了一個后臺,那么用來打開后臺的按鈕就會被顯示出來,如果沒有后臺,按鈕就不會被顯示出來。可以通過ShowBackstageButton屬性來覆蓋這個行為。后臺按鈕的內(nèi)容是通過BackstageButtonContent來設(shè)置的,而BackstageButtonContentTemplate則顯示了如何渲染它。如果你需要知道后臺是否打開,使用IsBackstageOpen。
添加后臺
功能區(qū)的后臺由Backstage控件實現(xiàn)。要將后臺添加到功能區(qū),請創(chuàng)建一個Backstage控件,并將其設(shè)置為功能區(qū)的Backstage屬性的值。或者,您可以將數(shù)據(jù)對象綁定到Backstage屬性,并使用在其根目錄處帶有Backstage的隱式DataTemplate。
Backstage是BackStageItem控件的容器。BackStageItem與上述的SettingsFlyoutItem非常相似。實際上,兩者之間的唯一區(qū)別是SettingsFlyoutItem具有其ClosesFlyout屬性,而BackstageItem具有名為ClosesBackstage的屬性。由于它們在功能上相同,因此它們的行為相同并且以相同的方式使用。
關(guān)于Backstage和SettingsFlyout值得注意的是,通常使用Backstage中的按鈕來打開設(shè)置彈出窗口。為了實現(xiàn)這一點,已將名為OpenSettingsFlyoutCommand的RoutedCommand定義為MobileWindow的靜態(tài)屬性。通過將其設(shè)置為后臺項目的命令,您的用戶可以從后臺打開設(shè)置。例如:
<mobile:BackstageItem Header="Settings" IsSelectable="False" ClosesBackstage="True" Command="{x:Static mobile:MobileWindow.OpenSettingsFlyoutCommand}" />向功能區(qū)添加項目
MobileRibbon是MobileRibbonItem控件的容器。在Xaml中,MobileRibbonItem控件可以作為Ribbon的子控件直接添加。在后面的代碼中,你會把它們添加到ribbon的Items集合中。在數(shù)據(jù)綁定方案中,創(chuàng)建一個數(shù)據(jù)對象集合,并將其綁定到ribbon的ItemsSource屬性。
RibbonItem的Header屬性指定了在ribbon的標(biāo)簽部分顯示的對象。使用HeaderTemplate來展示如何渲染Header。
當(dāng)用戶點擊一個ribbon項的頭部時,它的Click事件會被觸發(fā),它的Command會被執(zhí)行(如果它有Command的話),并被選中。要以編程方式設(shè)置一個ribbon項是否被選中,請使用它的IsSelected屬性。當(dāng)IsSelected屬性發(fā)生變化時,無論是通過用戶操作還是編程,ribbon項都會根據(jù)情況引發(fā)Selected/Unselected事件。這兩個事件都是路由事件。
將元素添加到功能區(qū)項目。從技術(shù)上講,可以將任何類型的UIElement添加到RibbonItem的Items集合中,并在選擇RibbonItem時顯示。元素可以作為直接子級添加到Xaml中。對于后面的代碼,請使用Items集合,對于數(shù)據(jù)綁定方案,請創(chuàng)建數(shù)據(jù)對象的集合并將其綁定到ItemsSource屬性。RibbonItem沒有ItemTemplate屬性,因此,如果確實將數(shù)據(jù)對象放入其中,則還需要定義一個隱含的DataTemplate,以數(shù)據(jù)對象的Type為目標(biāo),該Type顯示應(yīng)如何呈現(xiàn)它們。
即使可以將任何類型的UIElement添加到RibbonItem,也要實現(xiàn)與功能區(qū)的內(nèi)置樣式和行為的兼容性,請使用專門為其設(shè)計和實現(xiàn)的控件。這些是:
其中,GroupBar通常是功能區(qū)項目的子項,因為它是所有其他項目(GalleryBar除外)的容器,并且支持溢出。
使用分隔符在功能區(qū)項目的兩個元素之間放置一條垂直線。
下一章節(jié)將繼續(xù)講解對GroupBar中的元素進(jìn)行分組,設(shè)置溢出順序等。
本站文章除注明轉(zhuǎn)載外,均為本站原創(chuàng)或翻譯。歡迎任何形式的轉(zhuǎn)載,但請務(wù)必注明出處、不得修改原文相關(guān)鏈接,如果存在內(nèi)容上的異議請郵件反饋至chenjj@fc6vip.cn
文章轉(zhuǎn)載自: