首页 > 在别人那看到的很不错的ext.net的基本讲解

在别人那看到的很不错的ext.net的基本讲解

coolite控件：容器控件之FiledSet、Panel和Window学习(2011-10-13 13:36:00)

转载▼
标签：

window

panel

coolite

toolkit

filedset

杂谈

分类： Coolite_Toolkit
一、FieldSet控件FieldSet控件在开发中使用率还是很高的，毕竟Web中微软没有提供Group控件，通常都是使用FieldSet来进行表单等界面布局分组。在Coolite Toolkit中则专门提供了这样一个控件，同时还为其附加了很多其他的功能属性和方法。
<ext:FieldSet ID="FieldSet1" runat="server" Collapsible="True" Height="200px" Title="FieldSet分组" Width="200px"><Body><table border="0" cellpadding="0" cellspacing="0"><tr><td>日期：td><td><ext:DateField ID="DateField2" runat="server"/>td>tr>table>Body>ext:FieldSet>

Title、Height以及Width这些最基本的属性完全可以不去记忆，Collapsible属性是用来设置FieldSet是可折叠状态。上面代码片段的远行效果如下所示：

二、Panel控件 前面分析了FieldSet控件，可以用来做界面布局的分组，以及通过相关属性设置使其成为更为高级的应用操作。FieldSet所具备的这些特性对于Panel来说也是同样具备的。在ASP.NET里也提供得有Panel控件，那么Coolite Toolit所提供的相比ASP.NET里的Panel有什么特色呢？呵呵，特色可多了，请你继续看下面...... Panel控件我个人理解就是一个容器控件，不用它我自己随便通过一个html标签然后设置其runat="server"一样的可以达到等同的效果。Coolite Toolkit所提供的Panel同样如此，只是他在ASP.NET的Panel基础上扩展了一些常用的功能点，包括动态设值，外嵌其他的Web也面等多项功能。

<%--<ext:Panel ID="Panel2" runat="server" Height="300" Title="Title">--%><ext:Panel ID="Panel1" runat="server" Height="300" Title="Title" Collapsible="true" Width="300"><Body>Body>ext:Panel>

同FieldSet控件一样直接提供了公开属性设置是否允许折叠。如上html代码片段，在标签里可以放置我们需要在界面上呈现是元素，除此之外它还提供了一个属性(Html)，通过该属性也可以设置其显示内容，如下：

<ext:Panel ID="Panel2" runat="server" Height="100" Title="Title" Collapsible="true" Width="300" Html="
通过HTML属性设置其显示的内容
">ext:Panel>

在使用该控件的时候需要注意，虽然标签和Html属性都可以设置控件所呈现的内容，但是这里有一定的约束，标签和Html属性不能同时使用。 通过属性设置其要呈现的内容，控件还提供了属性用来设置其将自动加载的数据(比如一个页面，类似与IFrame的功能)。

<ext:Panel ID="Panel3" runat="server" Height="100" Width="400" Title="Title"><Body>Body>ext:Panel><script type="text/C#" runat="server"> protected void Page_load(object sender, EventArgs e) { this.Panel3.AutoLoad.Url ="http://beniao.cnblogs.com"; this.Panel3.AutoLoad.NoCache =true; } script>

 

<ext:Panel ID="Panel3" runat="server" Height="125px" Title="自动加载内容" Width="400px" Collapsible="true"><Body>Body><AutoLoad Url="http://beniao.cnblogs.com">AutoLoad>ext:Panel>

除了上面的实现方式外，也可以通过公开的方法LoadContent()实现动态加载一个页面呈现出来。

protectedvoid Page_load(object sender, EventArgs e) { this.Panel3.LoadContent("http://beniao.cnblogs.com", true); }

前面提到iframe，这个东西在我们平时开发中的使用率也是非常高的，Coolite Toolkit那当然也不会遗忘他的存在，对Panel控件也提供了iframe的支持，Panel控件加载一个外部web页面也是可以以iframe的形式呈现的。

protectedvoid Page_load(object sender, EventArgs e) { this.Panel3.AutoLoad.Url ="http://beniao.cnblogs.com"; this.Panel3.AutoLoad.Mode = LoadMode.IFrame; this.Panel3.AutoLoad.NoCache =true; }

同样可以在LoadContent()方法中设置加载模式：

this.Panel3.LoadContent(new LoadConfig("http://beniao.cnblogs.com", LoadMode.IFrame, true));

除了上述特性，Coolite Toolkit的Panel的折叠展开功能也有他独有的特性，通过Listeners可以设置让其在展开的时候加载指定的Web页面，折叠的时候清除内容。

<ext:Panel ID="Panel4" runat="server" Title="展开时加载|折叠时清除" Width="300" Height="100" Collapsible="true"><AutoLoad Url="http://www.cnblogs.com" Mode="IFrame" NoCache="true" ShowMask="true" MaskMsg="正在加载"/><Listeners><Expand Handler="this.reload();"/><Collapse Handler="this.clearContent();"/>Listeners>ext:Panel>



三、Window控件 窗体(Window)控件，这个控件多数时候是应用在做弹窗效果。很简单的说，我点一下按扭或是其他可同事件驱动的组件，立马给我弹出一个窗口出来，Window控件可以说是专门来解决这一技术需求。

<ext:Window ID="Window1" runat="server" Collapsible="true" Icon="Application" Title="Title"><body>body>ext:Window>

直接从工具箱里拖拽一个Window控件到界面上，默认是可折叠、可关闭且随着页面的加载而显示的。可以通过设置ShowOnLoad="false|true"属性使其在页面加载的时候显示与否。 在需要显示的时候可以通过调用其客户端API接口，也可以调用服务端API接口实现。

<ext:Window ID="Window1" runat="server" Collapsible="true" Icon="Application" Title="Title" ShowOnLoad="false"><body>body><Listeners><Hide Handler="this.clearContent();"/>Listeners>ext:Window><ext:Button ID="btnShowWindow" runat="server" Text="显示Window"><Listeners><%--<Click Handler="#{Window1}.show();"/>--%>Listeners><AjaxEvents><Click OnEvent="Show_Window">Click>AjaxEvents>ext:Button><script type="text/C#" runat="server"> protected void Show_Window(object sneder, AjaxEventArgs e) { this.Window1.Show(); } script>

Window控件我个人理解他也是一个容器控件，只不过他比其他的控件使用更为灵活，功能更强大，比如动态显示和隐藏（Show,Hide）、可拖拽性(Draggable)、摸态(Modal)等。

<ext:Window ID="Window1" runat="server" Collapsible="true" Icon="Application" Width="300" Draggable="false" Modal="true" Title="摸态|不可拖拽应用示例" ShowOnLoad="false"><body> 摸态|不可拖拽应用示例<br /> 不可拖拽：Draggable="false"<br /> 摸态：Modal="true"<br />body><Listeners><Hide Handler="this.clearContent();"/>Listeners>ext:Window><ext:Button ID="btnShowWindow" runat="server" Text="显示Window"><Listeners><%--<Click Handler="#{Window1}.show();"/>--%>Listeners><AjaxEvents><Click OnEvent="Show_Window">Click>AjaxEvents>ext:Button><script type="text/C#" runat="server"> protected void Show_Window(object sneder, AjaxEventArgs e) { this.Window1.Show(); //this.Window1.Hide(); } script>

转载于:https://www.cnblogs.com/yycan/archive/2013/04/24/3039797.html

更多相关：

  • 安卓相对布局常用语句

    不BB写在自己博客园看的舒服     RelativeLayout布局 android:layout_marginTop="25dip" //顶部距离 android:gravity="left" //空间布局位置 android:layout_marginLeft="15dip //距离左边距 // 相对于给定ID控件 andro...

  • LabelButtonScale

    top.geometry()设定窗口的初始大小 scale.set()设定滑块的初始值 scale.get()获取滑块变化的值 控件通过回调函数与其他控件进行通信（Label控件中的文本会受到Scale控件上操作的影响） 转载于:https://www.cnblogs.com/TmHm/p/9949947.html...

  • 关于捕获键盘信息的processDialogkey方法

    在一些控件里的keydown方法，没有办法捕获所有的按键消息 比如自己写一个窗体控件库，继承了UserControl 但是没有办法捕获一些键，比如方向键等 所以必须重载 processDialogkey 方法 processDialogkey 的描述 在msdn中是这样的   在消息预处理过程中调用此方法，以处理对话框字符，比如 Ta...

  • PetShop之表示层设计 - 《解剖PetShop》系列之六

    六 PetShop之表示层设计 表示层（Presentation Layer）的设计可以给系统客户最直接的体验和最十足的信心。正如人与人的相交相识一样，初次见面的感觉总是永难忘怀的。一件交付给客户使用的产品，如果在用户界面（User Interface，UI）上缺乏吸引人的特色，界面不友好，操作不够体贴，即使这件产品性能非常优异，架...

  • ASP.NET页生命周期概述

    ASP.NET页生命周期的定义，有以下8个方面：页请求，开始，页初始化，页加载，验证，回发事件，呈现，卸载。 ASP.NET 页运行时，此页将经历一个生命周期，在生命周期中将执行一系列处理步骤。这些步骤包括初始化、实例化控件、还原和维护状态、运行事件处理程序代码以及进行呈现。了解页的生命周期非常重要，这样就能在合适的生命周期阶段编写代...

©2024 11GX.COM