[原创]FineUI秘密花园（二十七） — 窗体控件概述（上）

最新推荐文章于 2023-03-30 16:13:09 发布

sanshi_zhang

最新推荐文章于 2023-03-30 16:13:09 发布

阅读量3.6k

点赞数 16

分类专栏： Extjs

本文链接：https://blog.youkuaiyun.com/u010918003/article/details/9160605

版权

本文介绍了FineUI窗体控件的使用，包括创建、显示隐藏、在本页和父页弹出窗体。窗体控件具有如EnabledIFrame、CloseAction等属性，可用于内联框架，提供多种关闭操作方式，如Hide、HideRefresh、HidePostBack。此外，还讨论了ActiveWindow静态类在不同页面关闭窗体的应用。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

窗体控件在项目中使用非常频繁，同时窗体控件和启用IFrame的面板控件也一起构成了FineUI所特有的内联框架，从而使弹出窗体不再局限于IFrame页面中。本章我们会详细介绍窗体控件的基本用法。

创建窗体控件

在页面中声明窗体控件标签，并设置需要的属性：

   1:  <ext:Window ID="Window2" Width="500px" Height="300px" Icon="TagBlue" Title="窗体" Hidden="false"

   2:      EnableMaximize="true" EnableCollapse="true" runat="server" EnableResize="true"

   3:      IsModal="false" CloseAction="HidePostBack" OnClose="Window2_Close" Layout="Fit">

   4:      <Items>

   5:          <ext:ContentPanel ShowBorder="false" ShowHeader="false" ID="ContentPanel2" EnableBackgroundColor="true"

   6:              BodyPadding="5px" runat="server">

   7:              <br />

   8:              这是窗体的内容。

   9:              <br />

  10:              <br />

  11:              <br />

  12:              <br />

  13:          </ext:ContentPanel>

  14:      </Items>

  15:  </ext:Window>

显示效果如下图：

这是一个允许折叠、允许最大化、允许关闭、允许改变尺寸、允许拖动的模式窗体，并且关闭后会触发Close服务器端事件。

由于窗体控件也是一个面板控件，所以拥有面板控件的公共属性，这里列出几个常用的面板属性：

Expanded：是否展开
Title：面板的标题
EnableIFrame：是否启用IFrame
IFrameUrl：IFrame的地址
IFrameName：IFrame的名称

其中EnableIFrame、IFrameUrl、IFrameName三个属性在上一节介绍TabStrip控件时已经接触到，在Window控件中会经常使用这三个属性，比如下面的代码：

   1:  <ext:Window ID="Window2" Width="500px" Height="300px" Icon

最低0.47元/天解锁文章