彈出面板
FlyoutPanel是一個容器,您可以在相對于鏈接控件的位置上顯示它。面板可以橫跨其父容器拉伸,支持動畫效果,并顯示一個可選的喙元素。
表單查閱
當您將彈出面板從Visual Studio工具箱拖放到表單中時,該面板將自動接收子FlyoutPanelControl容器。不像面板本身是無邊界的,這個容器有根據(jù)當前應用程序皮膚繪制的邊界,如果不需要邊框,請刪除此容器并將自定義控件直接放置在面板上。
如果不刪除這個內部容器,則每次單擊面板時都會自動選擇它。選擇FlyoutPanel本身,右鍵單擊它并選擇“Select ‘<your_panel_name>’”,然后您可以利用面板的智能標記,它提供了對大多數(shù)相關面板選項的訪問
或者按“ESC”鍵。
面板所有者
新添加的面板會提醒您指定其FlyoutPanel.OwnerControl屬性。
一個彈出面板必須始終有一個父UI元素,因為面板只相對于它的父UI元素出現(xiàn)在屏幕上,使用面板的智能標簽來設置其父面板。
彈出面板必須有表單、用戶控件或常規(guī)面板作為父面板,原始UI元素(按鈕、編輯器、標簽等)應該只作為喙面板的父元素。
對齊
一旦設置了面板父類,使用FlyoutPanel.Options.AnchorType屬性來設置面板的相對位置,具有Top、Right、Bottom和Left錨類型的面板在其父容器上拉伸。
C#:
flyoutPanel1.Options.AnchorType = DevExpress.Utils.Win.PopupToolWindowAnchor.Top;
點擊復制
VB.NET:
flyoutPanel1.Options.AnchorType = DevExpress.Utils.Win.PopupToolWindowAnchor.Top
點擊復制
TopLeft和TopRight錨類型將面板與其父面板的上角對齊。在這些模式下,彈出面板不會拉伸,此外,您可以通過設置水平和垂直偏移量(FlyoutPanelOptions.HorzIndent 和FlyoutPanelOptions.VertIndent屬性)向內移動面板。
C#:
flyoutPanel1.Options.AnchorType = DevExpress.Utils.Win.PopupToolWindowAnchor.TopRight; flyoutPanel1.Options.HorzIndent = 20; flyoutPanel1.Options.VertIndent = 10;
點擊復制
VB.NET:
flyoutPanel1.Options.AnchorType = DevExpress.Utils.Win.PopupToolWindowAnchor.TopRight flyoutPanel1.Options.HorzIndent = 20 flyoutPanel1.Options.VertIndent = 10
點擊復制
最后,Manual錨類型允許您將彈出面板對齊到相對于所有者控件左上角的任何位置,使用FlyoutPanelOptions.Location屬性來指定手動模式下的面板坐標。
C#:
flyoutPanel1.Options.AnchorType = DevExpress.Utils.Win.PopupToolWindowAnchor.Manual; flyoutPanel1.Options.Location = new System.Drawing.Point(100, 100);
點擊復制
VB.NET:
flyoutPanel1.Options.AnchorType = DevExpress.Utils.Win.PopupToolWindowAnchor.Manual flyoutPanel1.Options.Location = New System.Drawing.Point(100, 100)
點擊復制
顯示和隱藏彈出面板
彈出面板最初是隱藏的,要顯示面板請調用它的FlyoutPanel.ShowPopup方法。
C#:
flyoutPanel1.ShowPopup();
點擊復制
VB.NET:
flyoutPanel1.ShowPopup()
點擊復制
可選的方法參數(shù)允許您跳過動畫效果并立即顯示面板。
C#:
flyoutPanel1.ShowPopup(true);
點擊復制
VB.NET:
flyoutPanel1.ShowPopup(True)
點擊復制
如果FlyoutPanelOptions.CloseOnOuterClick屬性等于true,最終用戶將能夠通過單擊面板外部的任何地方來隱藏面板。否則,您將需要調用 FlyoutPanel.HidePopup方法來關閉面板。
C#:
flyoutPanel1.HidePopup(); // Hide immediately flyoutPanel1.HidePopup(true);
點擊復制
VB.NET:
flyoutPanel1.HidePopup() ' Hide immediately flyoutPanel1.HidePopup(True)
點擊復制
Beak面板
調用FlyoutPanel.ShowBeakForm方法來顯示Beak面板而不是普通面板,要隱藏這個面板,使用FlyoutPanel.HideBeakForm 方法。
C#:
flyoutPanel1.OwnerControl = officeNavigationBar1; flyoutPanel1.ShowBeakForm();
點擊復制
VB.NET:
flyoutPanel1.OwnerControl = officeNavigationBar1 flyoutPanel1.ShowBeakForm()
點擊復制
與標準彈出面板相比,Beak面板有一些細微的差異。
- Beak面板應該接受簡單的控件(按鈕、編輯器、標簽等)作為父控件(FlyoutPanel.OwnerControl屬性)。
- Beak面板忽略FlyoutPanelOptions.AnchorType屬性,并顯示在默認位置(在相關UI元素之上,喙形位于表單底部)。Beak傾向于整體顯示,因此Beak的位置或形式本身可能因自由空間不足而變化。要強制Beak表單顯示在特定位置,請使用FlyoutPanel.ShowBeakForm方法重載,該方法將位置作為參數(shù)。
- 如果啟用了動畫,則始終是淡出動畫,而不管FlyoutPanelOptions.AnimationType設置如何。
動畫
使用FlyoutPanelOptions.AnimationType屬性來選擇當面板的可見性改變時是否應用Fade或 Slide動畫效果。
C#:
flyoutPanel1.Options.AnimationType = DevExpress.Utils.Win.PopupToolWindowAnimation.Fade; flyoutPanel1.ShowPopup();
點擊復制
VB.NET:
flyoutPanel1.Options.AnimationType = DevExpress.Utils.Win.PopupToolWindowAnimation.Fade flyoutPanel1.ShowPopup()
點擊復制
要顯示和隱藏沒有動畫的彈出面板,調用 FlyoutPanel.ShowPopup、FlyoutPanel.ShowBeakForm、FlyoutPanel.HidePopup和FlyoutPanel.HideBeakForm方法重載,并將“immediate”參數(shù)設置為true。
C#:
flyoutPanel1.ShowPopup(true); flyoutPanel.ShowBeakForm(true);
點擊復制
VB.NET:
flyoutPanel1.ShowPopup(True) flyoutPanel.ShowBeakForm(True)
點擊復制
對于Beak面板,F(xiàn)lyoutPanelOptions.AnimationType屬性沒有效果,因為它們只支持淡出動畫。此外,建議您使用淡出動畫的常規(guī)彈出面板與手動對齊。
按鈕面板
您可以提供一個帶有按鈕或檢查按鈕的彈出面板。
按鈕被放置在一個按鈕面板中,如果FlyoutPanelButtonOptions.ShowButtonPanel屬性等于true,這個按鈕面板就會變得可見,這個屬性(以及其他影響按鈕面板的屬性)可以從FlyoutPanel.OptionsButtonPanel部分訪問。
C#:
flyoutPanel1.OptionsButtonPanel.ShowButtonPanel = true; flyoutPanel1.OptionsButtonPanel.ButtonPanelLocation = FlyoutPanelButtonPanelLocation.Bottom;
點擊復制
VB.NET:
flyoutPanel1.OptionsButtonPanel.ShowButtonPanel = True flyoutPanel1.OptionsButtonPanel.ButtonPanelLocation = FlyoutPanelButtonPanelLocation.Bottom
點擊復制
要添加按鈕,調用彈出面板智能標記并單擊“Edit Buttons”。在出現(xiàn)的集合編輯器對話框中,單擊“Add”來創(chuàng)建按鈕,并利用對話框右側的屬性網(wǎng)格來自定義按鈕設置(標題、圖像、按鈕類型等)。
要響應最終用戶在FlyoutPanel按鈕上的單擊,請?zhí)幚鞦lyoutPanel.ButtonClick事件,如下面的示例所示。
C#:
private void flyoutPanel1_ButtonClick(object sender, DevExpress.Utils.FlyoutPanelButtonClickEventArgs e) { string tag = e.Button.Tag.ToString(); switch(tag) { case "accept": // . . . break; case "decline": // . . . (sender as FlyoutPanel).HidePopup(); break; } }
點擊復制
VB.NET:
Private Sub flyoutPanel1_ButtonClick(ByVal sender As Object, ByVal e As DevExpress.Utils.FlyoutPanelButtonClickEventArgs) Dim tag As String = e.Button.Tag.ToString() Select Case tag Case "accept" ' . . . Case "decline" ' . . . TryCast(sender, FlyoutPanel).HidePopup() End Select End Sub
點擊復制