eCoolWebPanelBar Outlook 样式网页面板

分享于 

11分钟阅读

Web开发

  繁體

Sample Image - eCoolWebPanelBar.gif

介绍

1.0.0.0

eCoolSoft一直专注于MFC开发 Windows GUI的过程。 eCoolSoft改变了它的思想,专注于web客户端GUI开发的ASP.NET 和 DHTML。

这主要是因为 ASP.NET 中的控件是服务器端控件,它们与浏览器上的Windows GUI没有相同的功能。

eCoolSoft搜索之后,eCoolSoft发现 ASP.NET 和DHTML的组合是开发客户端 ASP.NET 组件的最佳选择。

1.1.0.0

eCoolWebPanelBar 现在支持 VS.NET 属性框中的GroupsItems的Collection 属性。 这意味着你可以从两个XML文件和 VS.NET IDE的属性中定义 eCoolWebPanelBar 属性。

这里外,版本 1.1.0.0 支持菜单头字母的粗体或者非粗体字体,并添加菜单头的左图像。

引用

1.0.0.0

这个演示由三个名为 eCoolWebPanelBar.dll, MenuRef.xml 和 WebPanelBarScript.js.的文件组成

  • MenuRef.xml 是一个用来实现 eCoolWebPanelBar 菜单头和菜单项的属性的XML文件。
  • WebPanelBarScript.js 是 eCoolWebPanelBar 文件,用于收缩和扩展面板的文件。
  • eCoolWebPanelBar.dll 是由 ASP.NET. 创建的自定义控件

eCoolSoft在Mr发现了奇怪的Bug。 Zek3vil JavaScript代码,因为 WebPanelBarScripts.js 获取了 SPAN 如果我们使用 ASP.NET 控件来使用它的代码。 这主要是因为 ASP.NET 创造了 SPAN 标签,并且JavaScript尝试将 OnClick 事件分配给 Label 控件,例如。

为了解决这里问题,eCoolSoft添加了声明为 SPAN 名为 ecoolx的ID,x 表示数字。 x ( 计数数) 通过 MenuRef.xml. 定义的菜单头的数量在 Render 函数中由 HtmlTextWriter 生成

之后,只有 realMenuObj 被考虑去缩小或者展开菜单项。

//This is the part of WebPanelBarScripts.js function InitializeMenu() 
{
nCount=0;//get a collection of menusobjSpanCollection =document.body.getElementsByTagName("SPAN");for (var i = 0; i <objSpanCollection.length; i++)
{var objSpan = objSpanCollection(i);if(objSpan.id. indexOf("ecool")!= -1)
{
realMenuObj[nCount] = objSpan;// get a collection of Menus' heightmenuHeightCollection[nCount] = objSpan.childNodes.item(1).clientHeight;// assign the click event to every Menuheader// prevent the bug if asp.net control has the tag called span;if(objSpan.childNodes.item(0).id=="xpmenu" )
{
realMenuObj[nCount].childNodes.item(0).onclick = ControlMenu;if(nCount!= 0) realMenuObj[nCount].childNodes.item(1).style.display = "none";
}
nCount++;
}
}
}

eCoolWebPanelBar.dll 与Mr的结构几乎相同。 eCoolSoft之后的yanhao代码确认原始的HTML代码显示 Outlook 样式栏。

Render 函数在 HtmlTextWriter 中具有相同的HTML代码,通过 MenuRef.xml. 通过组和项计数来生成循环

这次,eCoolSoft不能提供 eCoolWebPanelBar.dll的源代码,因为eCoolSoft无法创建不同版本的代码。 使用自定义控件的同一个 TagPrefix 开发新版本似乎非常令人失望。

eCoolSoft获取错误消息,指出 eCool:Goup 是在同一目录的多个位置定义的。 因此,eCoolSoft继续使用 eCoolWebPanelBar的相同项目。 这意味着eCoolSoft不再具有这里 eCoolWebPanelBar.dll的相同代码。

1.1.0.0

eCoolSoft试图在设计时支持集合属性。 在设计时,MS ASP.NET 服务器控件和组件的开发提供了许多提示来解决在设计时收集属性。

但是,本书使用 IList 基类,然后eCoolSoft必须用 CollectionBase 类方法编写代码。 这里解决方案在后面的段落中显示。

如何在eCoolWebPanleBar中工作CollectionBase类

在eCoolSoft使 CollectionBase 类工作于 Collection 属性之前,eCoolSoft尝试找到这里类的示例代码。 然而,eCoolSoft永远不会找到任何关于这个。 一个示例具有选项卡 Collection 控件的代码,但选项卡实际上具有它的对象,因为选项卡控件对象是在另一个位置创建的。

也就是说,在 eCoolWebPanelBar 中有以下关系。

  • Groups 对象是 Group 对象的Collection。
  • Group 对象是 Items 对象的父对象。
  • Items 对象是 Item 对象的Collection。

因此,GroupsGroupItemsItem 不是GUI对象,所以我们必须自己来处理这些对象的创建。

  • 设计时 CollectionBase 类对象与 Collection 属性的关联?
publicclass Groups : System.Collections.CollectionBase, IStateManagerpublicclass Items : System.Collections.CollectionBase

在声明 GroupsItems 类之后,需要定义从 CollectionEditor 类派生的GroupsEditor 类。

namespace eCool.WebPanelBar.Design
{publicclass GroupsEditor : CollectionEditor
{public GroupsEditor(Type type) : base(type)protectedoverride Type[] CreateNewItemTypes()
{
Type[] types = new Type[]
{typeof(eCool.WebPanelBar.Group)
};return types;
}
}
}

之后,为了使设计编辑器能够理解它们之间的关系,必须将 GroupEditor 类映射到 Groups 类。

namespace eCool.WebPanelBar
{[Editor(typeof(
eCool.WebPanelBar.Design.GroupsEditor),
typeof(UITypeEditor)),]..... 
}

最后,问题是如何让设计编辑器知道 GroupItems 对象之间的父关系和子关系。

namespace eCool.WebPanelBar
{[TypeConverter(typeof(ExpandableObjectConverter)),
DefaultProperty("Items"),
ParseChildren(true, "Items")]publicclass Group : IStateManager
.....
}

没有 上面 代码,eCoolSoft获取错误消息表示没有定义 eCool:Items

另一个问题是eCoolSoft必须面对XML格式与设计编辑器格式之间的冲突。 即,如果我们通过设计框将新组添加到 eCoolWebPanelBar,则复制发生,然后再创建一个 GroupItem。 为了解决这个问题,eCoolSoft改变了从 OnRender(...) 函数中的XML文件加载数据的位置。 以前,在 WebPanelBar的构造函数中发生了这种情况。

因此,我们现在可以从XML文件和设计工具中定义数据。

如何使用 eCoolWebPanelBar

  • 将 MenuRef.xml 放入 C:Inetpubwwwrootaspnet_clienteCoolSoftMenuRef.xml.
  • 将 WebPanelBarScript.js 放入/aspnet_client/eCoolSoft/, 和/代表将. aspx 文件放入 eCoolWebPanelBar.dll.的虚拟目录
  • 将 eCoolWebPanelBar.dll 放置到 root的bin目录或者使用aspx文件的虚拟目录。
  • 单击panel要添加的面板上的鼠标右键,然后在浏览文件后选择,将 eCoolWebPanelBar 添加到 vs 网络的工具箱中。 NET选项卡选择。
  • eCoolWebPanelBar 拖放到 WebForm。

1.0.0.0

//This is the content of MenuRef.xml. <?xmlversion="1.0"encoding="utf-8"?><menudata><menuheadid="Product"caption="OutLook"imageurl="./images/up.gif"><menuitemid="item10"caption="Today"url="www.ecoolsoft.com/products.aspx"imageurl="./images/Today.gif"/><menuitemid="item11"caption="Calendar"url="www.ecoolsoft.com/product_2.aspx"imageurl="./images/Calendar.gif"/><menuitemid="item12"caption="Inbox"url="www.ecoolsoft.com/product_3.aspx"imageurl="./images/Inbox.gif"/></menuhead></menudata>//eCoolWebPanelBar doesn't support target of html tag of URL yet.

你可以修改 MenuRef.xml 以指向不同的图像文件。标题和 URL,只要保持相同的格式。

已知 Bug

1.0.0.0

  • eCoolWebPanelBar 仅适用于 IE5.5 及其后续版本。
  • 不在IDE设计框中修改 GroupItem 属性。 如果你修改了这些,eCoolWebPanelBar 就不工作了。
  • eCoolWebPabelBar 显示时,我们看到除了第一个面板之外的面板
  • eCoolWebPanelBar 不适用于 Group,但它还具有设计框的e Collection 特性。

目前,eCoolSoft努力修复这些 Bug,除了Netscape和 IE5.0 支持。

未来问题 [ 1.1.0.1 ]

eCoolSoft关注以下问题来保护 ASP.NET 免受反编译。

  • JavaScript代码应该编码?
  • XML文件应该从resx文件加载?
  • DHTML代码应该从XML格式加载到 XSLT?

eCoolSoft注意到一些竞争者使用这种方法来保护他们的知识产权。 此外,XSLT扩展了可以重用代码的XML文件的功能。


WEB  style  OUT  PAN  PANE  Outlook  
相关文章