DevExpress擁有.NET開發(fā)需要的所有平臺控件，包含600多個UI控件、報表平臺、DevExpress Dashboard eXpressApp 框架、適用于 Visual Studio的CodeRush等一系列輔助工具。

獲取DevExpress v23.2正式版下載

DevExpress技術(shù)交流群9：909157416      歡迎一起進(jìn)群討論

Bottom Sheet是一個組件，它顯示固定在屏幕底部的補充內(nèi)容。

這種UI比喻在桌面應(yīng)用程序中并不常見，但在移動應(yīng)用中被廣泛應(yīng)用。它允許您有條件地顯示大型UI元素，為它們提供幾乎整個屏幕空間，而無需導(dǎo)航到單獨的頁面。

在本文中，我們將展示一些使用場景，其中底部表單可以增強移動用戶體驗！

1. 主 - 詳細(xì)數(shù)據(jù)

在桌面應(yīng)用程序中顯示主 - 詳細(xì)數(shù)據(jù)的常見解決方案是使用帶有可擴展行和細(xì)節(jié)網(wǎng)格的數(shù)據(jù)網(wǎng)格。在移動屏幕上，為多個數(shù)據(jù)網(wǎng)格或列表分配空間可能具有挑戰(zhàn)性。此外，創(chuàng)建可擴展的層次結(jié)構(gòu)級別可能會使UI復(fù)雜化，特別是在每個數(shù)據(jù)行顯示不同信息的情況下。這個UI問題的一個可能解決方案是，在選擇主項時在Bottom Sheet中顯示詳細(xì)數(shù)據(jù)。

Bottom Sheet允許您在視覺上顯示與主要內(nèi)容分離的大數(shù)據(jù)段，它的優(yōu)點是不需要用戶導(dǎo)航到單獨的頁面來查看相關(guān)信息。

我們的Bottom Sheet支持模態(tài)和內(nèi)聯(lián)顯示模式，在內(nèi)聯(lián)模式下，當(dāng)?shù)撞抗ぷ鞅泶蜷_時，您可以與主要內(nèi)容交互。當(dāng)用戶與主要內(nèi)容交互時，您可能希望在主區(qū)域為他/她提供更多空間，但仍然保持底部表單可見，可以通過設(shè)置屬性來實現(xiàn)這個操作。

如上面的動畫所示，我們的底部表單是放置與點擊項目相關(guān)的附加操作按鈕的好地方。

2. 顯示篩選項

您可以在DevExpress的集合視圖和數(shù)據(jù)網(wǎng)格旁邊使用過濾器UI元素來應(yīng)用各種過濾器，一個常見的移動UI實現(xiàn)是在Bottom Sheet中顯示過濾器。您可以使用芯片來激活過濾器和選項卡視圖從一個過濾器組切換到另一個在相同的底部工作表。

3. 選擇值

大多數(shù)商業(yè)應(yīng)用程序都包含數(shù)據(jù)編輯器的使用，允許用戶從預(yù)定義的列表中選擇值。在桌面應(yīng)用程序中，最明顯的組件選擇是帶有標(biāo)準(zhǔn)下拉菜單的ComboBoxEdit。在移動應(yīng)用中，下拉菜單可能不是最好的解決方案，因為它不能充分利用可用的屏幕空間。DevExpress ComboBoxEdit和Form Item元素為您提供項目選擇模式，其中使用底部工作表替代下拉：

總結(jié)

Bottom Sheet是一個多用途的UI控件，旨在解決各種移動特定的UI需求，包括：

• 您可以使用Bottom Sheet在主屏幕中顯示大型數(shù)據(jù)段。
• 內(nèi)聯(lián)(非模態(tài))顯示模式允許您與主要內(nèi)容交互，并在需要時自動降低底部工作表的高度。
• 當(dāng)一個項目被選中時，您可以顯示一個帶有操作的欄。
• 可以向底部工作表添加篩選項。
• 底部表單是下拉菜單的一個很好的選擇。

更多DevExpress線上公開課、中文教程資訊請上中文網(wǎng)獲取