65.9K
CodeProject 正在变化。 阅读更多。
Home

Gmail 风格的用户消息控件

starIconstarIconstarIconstarIconstarIcon

5.00/5 (4投票s)

2010年10月26日

CPOL

2分钟阅读

viewsIcon

23927

downloadIcon

214

这是一个我编写的 Gmail 风格的用户消息控件,它是 XWT 工具包的一部分。

引言

MessageControl 是一个 ASP.NET 控件,它以类似于 Gmail 应用程序的方式显示用户消息。 Gmail 用户消息标签具有以下特点:

  • 用户消息标签始终显示在顶部——无论滚动如何
  • 用户消息标签会在几秒钟后消失
  • 消息文本中可以使用 HTML 代码

MessageControl 继承了相同的特性,并且避免了自定义 JavaScript 代码的麻烦。

如何设置 MessageControl

与其他许多 ASP.NET 控件一样,只需将 MessageControl 从工具箱面板拖放到您的 ASP.NET 页面上即可。MessageControl 需要 PageManager 控件才能正常工作。要下载 PageManager 并设置工具箱,请阅读以下指南。

http://code.google.com/p/extensible-web-toolkit/wiki/xwtsetup

设置好 XWT 工具包后,您可以看到几个 ASP.NET 控件。如果您感兴趣,请在以下位置了解有关这些控件的更多信息。

http://code.google.com/p/extensible-web-toolkit/

如何使用 MessageControl

设置好工具箱后,您就可以在 ASP.NET 页面上使用 MessageControl 了。以下演练将指导您如何在按钮单击时使用 MessageControl。

步骤 1:将 PageManager 控件拖放到 ASP.NET 页面上。

步骤 2:将 MessageControl 控件拖放到 ASP.NET 页面上。

步骤 3:将按钮拖放到 ASP.NET 页面上。

步骤 4:将以下代码复制并粘贴到按钮的 OnClientClick 事件中

		 OnClientClick="return msg.text('Hello World!');"  

步骤 5:运行应用程序并单击按钮,以查看页面顶部的消息。您可以向下滚动页面,以查看消息固定在顶部。此外,消息将在 10 秒后消失。

您可以使用 MessageControl 中的以下 JavaScript 函数(如步骤 4 所示),根据您的需求:

msg.html(htmlText) – 在用户消息中显示 HTML。请参考示例代码。

msg.text(text, disappearTime) – 显示消息并修改消失时间,单位为秒。

注意:所有公开的方法都是 JavaScript 函数。但是,您可以像使用任何其他 JavaScript 函数一样,在服务器端代码中使用这些函数。

结论

MessageControl 是一个简单的 ASP.NET 用户消息控件。它封装了必要的 JavaScript 代码,并避免了在整个 Web 应用程序中重复代码。它易于使用,并为您提供类似于 Gmail 的用户消息体验。

MessageControl 是 XWT 工具包的一部分。请在以下位置了解有关该工具包的更多信息。

http://code.google.com/p/extensible-web-toolkit/
http://code.google.com/p/extensible-web-toolkit/downloads/list
http://www.extensible-web.com 

更新

请阅读以下文章,以了解有关 PageManager 控件的更多信息

aspnet-pagemanager.aspx 

© . All rights reserved.