Web Control的Style設定

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"),這樣感覺起來就直覺多了。