使用范例
MSN由個很好的功能,就是每當你的MSN好友上線時,MSN會自動在窗體托盤的右下角由下往上彈出消息框來通知你,這個功能十分實用,比如在論壇里,當有新回復你的帖子時,系統會自動彈出消息提示框,又或者在一個電子政務的系統里,當收到新的郵件或者工作單時,可以使系統彈出消息框提示等等。那么,在ASP.NET構建的Web應用中,如何實現這樣的功能呢?在本文中,向讀者推薦一個可以實現類似MSN的通知消息窗口效果的.NET控件。
首先讓我們來看下該控件實現后的樣子,如下圖:

可以看到,這個控件可以在各類型的瀏覽器中使用(IE,MOZILLA,NETSCAPE,OPERA),而且我們還可以自定義顏色,還可以進行拖拉,如下圖:

下面我介紹這個控件的一些使用方法。
首先,在該控件中,有兩種事件可以被激發:Linkcliked事件(當消息框內的連接被點擊時觸發)和Popupclosed事件(當消息框窗口被關閉時觸發)?丶腥N方式對這些事件進行處理,而actiontype屬性的取值,則決定了這三種方式:
1)messagewindow(默認):默認的彈出窗口方式,將以設置好的Title屬性和Text屬性為標題和窗口內的文字說明。
2)openlink:此時,控件允許當點擊窗口內的文字鏈接時,將以打開新窗口的方式打開該鏈接。
3)raiseevenst:當選擇該屬性時,控件將會在服務端處理linkcliked事件和popupclosed事件。
在使用該控件時是十分方便的,只需要在visual studio .net 中,使用add/remove toolbox功能,選擇該控件的dll,之后,該控件就會出現在工具箱中,就可以拖拉的方式放到網頁中去應用。
單擊該控件,在其設計器中,會發現有豐富的屬性(詳細的屬性,事件說明請參考該控件的文檔)。在設計器中的"操作"分類欄中,可以指定控件如何處理當用戶關閉窗口和點擊窗口內的文字時打開的新鏈接;在"文字"和"設計"分類欄中,將可以設計彈出消息窗口的字體,顏色,布局(如設置是從左下角還是從右下角彈出);在"行為"分類欄中,可以設置窗口彈出的彈出速度,是否自動在頁面加載后就彈出,以及窗口在彈出多久后會自動關閉,窗口是否可以設置為自由拖拉等等。
下面舉例通過代碼說明如何使用:
在popup.aspx中:
<!-- Popup.aspx --> <%@ Register TagPrefix="cc1" Namespace="EeekSoft.Web" Assembly="EeekSoft.Web.PopupWin" %>
<cc1:popupwin id="popupWin" runat="server" visible="False" colorstyle="Blue" width="230px" height="100px" dockmode="BottomLeft" windowscroll="False" windowsize="300, 200"></cc1:popupwin>
在code-behind代碼中寫入:
// Popup.aspx.cs
//設置為默認的消息窗口 popupWin.ActionType=EeekSoft.Web.PopupAction.MessageWindow;
//設置窗口的標題,消息文字 popupWin.Title="This is popup"; popupWin.Message="<i>Message</i> displayed in popup"; popupWin.Text="Text to show in new window..";
//設置顏色風格 popupWin.ColorStyle=EeekSoft.Web.PopupColorStyle.Green; //設置窗口彈出和消失的時間 popupWin.HideAfter=5000; popupWin.ShowAfter=500; popupWin.Visible=true;
在該控件的基礎上,我們再增強該控件的功能,實現一個叫popupanchor的控件。該控件可以動態檢測客戶端的事件,比如在一個輸入表單中,每當你在文本框填完數據,將鼠標的焦點轉移到另外的文本框時,會自動彈出消息提示框。而且,使用該控件,還可以動態更改原先彈出窗口的標題和文字。Popipanchor控件是配合popupwin控件使用的,比如,想重新打開已經彈出過的窗口框,可以這樣設置,添加一個popipanchor控件,設置popuptoshow屬性,指明要控制的是哪一個彈出消息框的窗口,之后并可以設置相關的handledevent屬性,指明要擊發的是什么樣的事件(比如onfocus,ondblick)等,如下圖

用下面的的代碼,可以重新設置已經彈出過的消息窗口的標題文字,并讓其再次彈出:
<!-- Anchor.aspx --> <%@ Register TagPrefix="cc1" Namespace="EeekSoft.Web" Assembly="EeekSoft.Web.PopupWin" %>
<cc1:popupwin id="popupWin" runat="server" visible="False" colorstyle="Blue" width="230px" height="100px" dockmode="BottomLeft" windowscroll="False" windowsize="300, 200"> </cc1:popupwin>
<cc1:popupwinanchor id="popupAnchor" runat="server" changetexts="False"></cc1:popupwinanchor>
<span id="spanreopen"> Click here to reopen popup !</span>
code-behind文件中的代碼如下:
// Anchor.aspx.cs // Handle onclick event .. //設置其響應的事件為onclick popupAnchor.HandledEvent="onclick";
popupAnchor.LinkedControl="spanReopen"; popupAnchor.PopupToShow="popupWin"; popupWin.Visible=true; popupWin.AutoShow=true;
則上面的代碼可以實現,當點擊spanreopen區域時,可以使已經彈出的消息窗口再次彈出。
DEMO例子里演示了如何使用popupanchor控件,如下圖,當點擊第一個文本框時,彈出窗口,提示要輸入文字;當輸入完第一個文本框的內容時,將鼠標移動到第二個文本框時,又會彈出第二個窗口:


在本文提供的下載中,提供了該控件的完整代碼,使用控件的范例工程,和關于該控件的詳細事件方法說明的CHM文件,可以在vs.net 2003上運行通過。
|