記得去年年初的時(shí)候做了一個(gè)Colorful ListBox Control控件。當(dāng)時(shí)考慮的因數(shù)很少，雖然那個(gè)控件實(shí)現(xiàn)了簡單的調(diào)用接口，可是有一個(gè)致命的問題是居然沒有考慮到PostBack后的狀態(tài)保存問題。

　　新的ColorableListBox解決了控件被PostBack后的狀態(tài)保存。實(shí)現(xiàn)過程很簡單，就是把ListItem的ForeColor和BackColor信息存在ViewState里面，自己在控件中去維護(hù)。這個(gè)功能本來是很簡單的，可是在做完后發(fā)現(xiàn)也仍然并不完美，因?yàn)槟壳斑€是不能處理?xiàng)l目移動(dòng)的問題，如果條目被移動(dòng)，比如有刪除和插入等操作等，ListItem的顏色不能同步。目前的處理辦法是如果有ListItem的變動(dòng)，就清空所有的色彩信息。

　　執(zhí)行流程，在控件的OnPerRender事件運(yùn)觸發(fā)時(shí)，判斷ListBox的Item的Attributes.CssStyle屬性里是否被設(shè)置了color和background-color屬性。如果有就記錄下其屬性值，然后保存在ViewState里，PostBack后從ViewState里恢復(fù)Item的屬性值，在Render事件里，使用自己保存的屬性信息來修改<option ...>...</option>的css屬性。

protected override void OnPreRender(EventArgs e)
{
if ( m_IsClear )
{
m_ItemStyles = null;
}

ArrayList alstStyle = null;
Hashtable htItemStyles = null;

for( int i=0 ; i < this.Items.Count ; ++i )
{
if ( alstStyle != null )
{
alstStyle.Clear();
}
foreach( string key in this.Items[i].Attributes.CssStyle.Keys )
{
if ( htItemStyles == null )
{
htItemStyles = new Hashtable();
}
if ( m_ItemStyles != null )
{
foreach( object obj in m_ItemStyles )
{
object [] objs = (object [])obj;
htItemStyles[objs[0]] = objs[1];
}
}
if ( alstStyle == null )
{
alstStyle = new ArrayList();
}
string strKey = key.ToLower();
if ( strKey == "color" || strKey == "background-color" )
{
alstStyle.Add(key + ':' + this.Items[i].Attributes.CssStyle[key]);
continue;
}
}
if ( alstStyle != null && alstStyle.Count > 0 )
{
string [] strAry = new string[alstStyle.Count];
alstStyle.CopyTo(strAry);
htItemStyles[i] = strAry;
}
}
if ( htItemStyles != null )
{
int count = 0;
m_ItemStyles = new object[htItemStyles.Count];
foreach( object key in htItemStyles.Keys )
{
object [] objects = new object[2];
objects[0] = key;
objects[1] = (string [])htItemStyles[key];
m_ItemStyles[count++] = objects;
}
}
base.OnPreRender(e);
}

控件的使用方法為：

ColorableListBox clb = new ColorableListBox();
ListItem li = new ListItem(name, value);
li.Attributes.CssStyle.Add("color", "yellow");
li.Attributes.CssStyle.Add("background-color", "blue");
clb.Items.Add(li);

如果重新設(shè)置條目后(比如有Insert和Delete操作等)需要調(diào)用一下：ClearItemStyles();

#region 附ColorableListBox控件源碼
using System;
using System.IO;
using System.Collections;
using System.Text;
using System.Text.RegularExpressions;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.ComponentModel;

namespace WebExcel.UI.WebControls
{
/**//// <summary>
/// Summary description for ColorableListBox.
/// </summary>
[DefaultProperty("Text")]
[ToolboxData("<{0}:ColorableListBox runat=server></{0}:ColorableListBox>")]
public class ColorableListBox : ListBox
{
private object [] m_ItemStyles;
private bool m_IsClear = false;

protected override object SaveViewState()
{
ArrayList alstViewState = new ArrayList();
object objBaseVS = base.SaveViewState();
alstViewState.Add(objBaseVS);
alstViewState.Add(m_ItemStyles);
return alstViewState;
}

protected override void LoadViewState(object savedState)
{
if ( savedState != null )
{
ArrayList alstViewState = (ArrayList)savedState;
if ( alstViewState.Count >= 1 )
{
base.LoadViewState(alstViewState[0]);
}
if ( alstViewState.Count == 2 )
{
m_ItemStyles = (object [])alstViewState[1];
}
}
}

protected override void OnPreRender(EventArgs e)
{
if ( m_IsClear )
{
m_ItemStyles = null;
}

ArrayList alstStyle = null;
Hashtable htItemStyles = null;

for( int i=0 ; i < this.Items.Count ; ++i )
{
if ( alstStyle != null )
{
alstStyle.Clear();
}
foreach( string key in this.Items[i].Attributes.CssStyle.Keys )
{
if ( htItemStyles == null )
{
htItemStyles = new Hashtable();
}
if ( m_ItemStyles != null )
{
foreach( object obj in m_ItemStyles )
{
object [] objs = (object [])obj;
htItemStyles[objs[0]] = objs[1];
}
}
if ( alstStyle == null )
{
alstStyle = new ArrayList();
}
string strKey = key.ToLower();
if ( strKey == "color" || strKey == "background-color" )
{
alstStyle.Add(key + ':' + this.Items[i].Attributes.CssStyle[key]);
continue;
}
}
if ( alstStyle != null && alstStyle.Count > 0 )
{
string [] strAry = new string[alstStyle.Count];
alstStyle.CopyTo(strAry);
htItemStyles[i] = strAry;
}
}
if ( htItemStyles != null )
{
int count = 0;
m_ItemStyles = new object[htItemStyles.Count];
foreach( object key in htItemStyles.Keys )
{
object [] objects = new object[2];
objects[0] = key;
objects[1] = (string [])htItemStyles[key];
m_ItemStyles[count++] = objects;
}
}
base.OnPreRender(e);
}

/**//// <summary>
/// clear custom item styles
/// </summary>
public void ClearItemStyles()
{
m_IsClear = true;
}

public override void DataBind()
{
ClearItemStyles();
base.DataBind ();
}

/**//// <summary>
/// Render this control to the output parameter specified.
/// </summary>
/// <param name="output"> The HTML writer to write out to </param>
protected override void Render(HtmlTextWriter output)
{
StringBuilder strb = new StringBuilder();
StringWriter sw = new StringWriter(strb);
HtmlTextWriter htw = new HtmlTextWriter(sw);
base.Render(htw);

if ( m_ItemStyles != null )
{
foreach( object obj in m_ItemStyles )
{
object [] objs = (object [])obj;
int i = (int)objs[0];
AppendColorAttributes(strb, this.Items[i], (string [])objs[1]);
}
}
output.Write(strb.ToString());
}

private void AppendColorAttributes(StringBuilder select, ListItem li, string [] styles)
{
string strItemPattern = @"value=""{0}""{1}>{2}</option>";
string strOriginalItem = string.Format(strItemPattern, li.Value, "", li.Text);
string strStyle = " style=\"";
for( int i=0 ; i < styles.Length ; i++ )
{
string [] keyvalue = styles[i].Split(new char [] {':'});
string strStyleKey = keyvalue[0];
string strStyleValue = keyvalue[1];
strStyle += String.Format("{0}:{1};", strStyleKey.ToLower(), strStyleValue);
}
strStyle += @"""";
string strNewItem = string.Format(strItemPattern, li.Value, strStyle, li.Text);
select.Replace(strOriginalItem, strNewItem);
}
}
}
#endregion