得到“素材”
首先我們需要得到一個HTML編輯器的原始代碼，網上有不少這類的編輯器，如大名鼎鼎的RichTextBox，為了避免版權糾紛，以我所做得為例（暫名：UltraTextBox）：在編輯器工具欄的空白地方點擊鼠標右鍵－－>查看源代碼，如圖所示。
把代碼拷貝出來保存成一個.htm文件就可以看到效果，是不是感覺很簡單的就作了一半？：）
為了以後講解方面我們把它保存為editor.aspx文件，在這裡注意刪除掉__VIEWSTATE一段。
然後把相應的圖標，CSS文件等保存在相應的位置，否則你的界面會很難看，當然你也可以根據需要自己來做圖標。
好了，准備工作基本做完，下面是講怎樣把它封裝為.NET組件，方便你在工程中使用。
--------------------------------------------------------------------------------
封裝成ASP.NET組件
首先在VS.NET環境裡生成一個UltraTextBoxV1組件（也可以稱為自定義控件，我習慣稱為組件）項目，
using System;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.ComponentModel;
//設置該組件的標記前綴
[assembly:TagPrefix("gOODiDEA.UltraTextBoxV1", "UTBV1")]
namespace gOODiDEA.UltraTextBoxV1
{
//添加類聲明
[
DefaultProperty("Text"),
ValidationProperty("Text"),
ToolboxData("<{0}:UltraTextBoxV1 runat=server></{0}:UltraTextBoxV1>"),
ParseChildren(false),
Designer("gOODiDEA.UltraTextBoxV1.UltraTextBoxV1Designer")
]
public class UltraTextBoxV1: System.Web.UI.Control, IPostBackDataHandler
{
private static readonly object ValueChangedEvent = new object();
//聲明一個代理用於處理值被改變的事件，當組件的值更改時發生ValueChanged事件
public event EventHandler ValueChanged
{
add
{
Events.AddHandler(ValueChangedEvent, value);
}
remove
{
Events.RemoveHandler(ValueChangedEvent, value) ;
}
}
//觸發值被改變事件的方法
protected virtual void OnValueChanged(EventArgs e)
{
if( Events != null )
{
EventHandler oEventHandler = ( EventHandler )Events[ValueChangedEvent] ;
if (oEventHandler != null) oEventHandler(this, e);
}
}
//處理回發數據
bool IPostBackDataHandler.LoadPostData( string postDataKey,
System.Collections.Specialized.NameValueCollection postCollection )
{
if ( postCollection[postDataKey] != Text )
{
Text = postCollection[postDataKey];
return true;
}
return false;
}
//告訴應用程序該組件的狀態已更改
void IPostBackDataHandler.RaisePostDataChangedEvent()
{
OnValueChanged( EventArgs.Empty );
}
//我們對一個編輯器主要需要實現下面4個屬性，Text，Width，Height，BasePath。
//Text屬性：（從編輯器得到值和把值賦給編輯器）
[Bindable(true),DefaultValue("")]
public string Text
{
get
{
object o = ViewState["Text"];
return ( o == null ) ? String.Empty : ( string )o;
}
set
{
ViewState["Text"] = value;
}
}
//Width屬性：（編輯器的寬）
[Bindable(true),Category("Appearence"),DefaultValue("100%")]
public Unit Width
{
get
{
object o = ViewState["Width"];
return ( o == null ) ? Unit.Parse( "100%" ) : ( Unit )o ;
}
set
{
ViewState["Width"] = value ;
}
}
//Height屬性：（編輯器的高）
[Bindable(true),Category("Appearence"),DefaultValue("385px")]
public Unit Height
{
get
{
object o = ViewState["Height"];
return ( o == null ) ? Unit.Parse( "385px" ) : ( Unit )o ;
}
set
{
ViewState["Height"] = value ;
}
}
//BasePath屬性：（第一步保存的editor.aspx的路徑以及以後做的插件的路徑）
[Bindable(true),DefaultValue("../UltraTextBoxV1Sys/Plug-Ins/")]
public string BasePath
{
get
{
object o = ViewState["BasePath"];
return (o == null) ? "../UltraTextBoxV1Sys/Plug-Ins/" : (string)o;
}
set
{
ViewState["BasePath"] = value;
}
}
//接下來是最重要的怎樣把本組件和Editor.aspx結合起來，這裡使用的是iframe技術：
//覆蓋Render方法，運行時輸出：
protected override void Render(HtmlTextWriter output)
{
System.Web.HttpBrowserCapabilities oBrowser = Page.Request.Browser ;
//對應的IE版本必須是5.5或以上的版本
if (oBrowser.Browser == "IE" && oBrowser.MajorVersion >= 5.5 && oBrowser.Win32)
{
string sLink = BasePath + "Editor.aspx?FieldName=" + UniqueID;
//如果不使用SetTimeout則會提示找不到對象
output.Write(
"<IFRAME id=/"{5}/" src=/"{0}/" width=/"{1}/" height=/"{2}/" frameborder=/"no/" scrolling=/"no/"
