弹出面板
FlyoutPanel是一个容器,您可以在相对于链接控件的位置上显示它。面板可以横跨其父容器拉伸,支持动画效果,并显示一个可选的喙元素。
表单查阅
当您将弹出面板从Visual Studio工具箱拖放到表单中时,该面板将自动接收子FlyoutPanelControl容器。不像面板本身是无边界的,这个容器有根据当前应用程序皮肤绘制的边界,如果不需要边框,请删除此容器并将自定义控件直接放置在面板上。
如果不删除这个内部容器,则每次单击面板时都会自动选择它。选择FlyoutPanel本身,右键单击它并选择“Select ‘<your_panel_name>’”,然后您可以利用面板的智能标记,它提供了对大多数相关面板选项的访问
或者按“ESC”键。
面板所有者
新添加的面板会提醒您指定其FlyoutPanel.OwnerControl属性。
一个弹出面板必须始终有一个父UI元素,因为面板只相对于它的父UI元素出现在屏幕上,使用面板的智能标签来设置其父面板。
弹出面板必须有表单、用户控件或常规面板作为父面板,原始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()
点击复制
可选的方法参数允许您跳过动画效果并立即显示面板。
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方法重载,该方法将位置作为参数。
- 如果启用了动画,则始终是淡出动画,而不管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”参数设置为true。
C#:
flyoutPanel1.ShowPopup(true); flyoutPanel.ShowBeakForm(true);
点击复制
VB.NET:
flyoutPanel1.ShowPopup(True) flyoutPanel.ShowBeakForm(True)
点击复制
对于Beak面板,FlyoutPanelOptions.AnimationType属性没有效果,因为它们只支持淡出动画。此外,建议您使用淡出动画的常规弹出面板与手动对齐。
按钮面板
您可以提供一个带有按钮或检查按钮的弹出面板。
按钮被放置在一个按钮面板中,如果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”。在出现的集合编辑器对话框中,单击“Add”来创建按钮,并利用对话框右侧的属性网格来自定义按钮设置(标题、图像、按钮类型等)。
要响应最终用户在FlyoutPanel按钮上的单击,请处理FlyoutPanel.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
点击复制