ASP.NET要用程式設定Web控制項的Style的方法是採用一項一項項目設定,
obj.Style["color"] = "Red";
如果是只設定一個項目的話還好,但是設定一大串的樣式設定的時候還蠻麻煩的,
為了解決這樣的問題,想要做出一個可以像在HTML上那樣的方式來設定樣式
ASP.NET要用程式設定Web控制項的Style的方法是採用一項一項項目設定,
obj.Style["color"] = "Red";
如果是只設定一個項目的話還好,但是設定一大串的樣式設定的時候還蠻麻煩的,
為了解決這樣的問題,想要做出一個可以像在HTML上那樣的方式來設定樣式,
obj.Style = "color: Red; text-align: left";
一開始需要寫一個演算法來解析字串,我所想到的是利用正規表示式來解決,
而我所寫出的正規式:"(?<name>[\w\-]+):\s*(?<value>[\w\ \-\#]+);?"
這樣的話就可以分離出每個項目的名稱及設定值了。
完成的程式:
/// <summary>
/// Html文件輔助類別。
/// </summary>
public static class HtmlHelper
{
// 成員
private static Regex m_StyleRx = new Regex(@"(?<name>[\w\-]+):\s*(?<value>[\w\ \-\#]+);?",
RegexOptions.Compiled | RegexOptions.Singleline);
/// <summary>
/// 套用樣式表。
/// </summary>
/// <param name="ctrl">要套用的Web控制項。</param>
/// <param name="style">樣式字串。</param>
public static void ApplyStyle(WebControl ctrl, string style)
{
foreach (Match m in m_StyleRx.Matches(style))
ctrl.Style[m.Groups["name"].Value] = m.Groups["value"].Value;
}
}
這樣要使用這個程式時,需要
HtmlHelper.ApplyStyle(obj, "color: Red; text-align: left");
總覺不太直覺,
因此想到使用.NET 3.5的新特性,Extension Method來解決,
完成的程式碼:
/// <summary>
/// Html擴充方法。
/// </summary>
public static class HtmlExtension
{
// 成員
private static Regex m_StyleRx = new Regex(@"(?<name>[\w\-]+):\s*(?<value>[\w\ \-\#]+);?",
RegexOptions.Compiled | RegexOptions.Singleline);
/// <summary>
/// 套用樣式表。
/// </summary>
/// <param name="ctrl">要套用的Web控制項。</param>
/// <param name="style">樣式字串。</param>
public static void ApplyStyle(this CssStyleCollection ctrl, string style)
{
foreach (Match m in m_StyleRx.Matches(style))
ctrl[m.Groups["name"].Value] = m.Groups["value"].Value;
}
}
使用的方式變成,obj.Style.ApplyStyle("color: Red; text-align: left"),這樣感覺起來就直覺多了。