如何创建一个流畅的风格MVC 2 Html.Helper?

时间:2010-09-10 12:55:00

标签: asp.net-mvc html-helper

有人能指出我正确的方向,我将如何创建htmlhelpers,你可以在视图中调用类似下面的代码。

   <% using (Html.BeginSvg())
   {%>
   <% using (Html.BeginGroup("Group1")) {%>
        <%= Html.SvgLine("Line1").Class("blueLine").Style("stroke-width:2px").X1(25).Y1(25).X2(25).Y2(25).Transform().Scale(-2)%>
        <%= Html.SvgLine("Line1").Class("blueLine").Style("stroke-width:2px").X1(100).Y1(25).X2(100).Y2(125).Transform().Scale(-2)%>
   <%} %>
   <%= Html.SvgRect("box").Class("redBox").X(12).Y(10).Width(234).Height(200) %>
<%} %>

有可能吗?它是否理智? :)有没有这样的东西已经实现了?

干杯 硅

2 个答案:

答案 0 :(得分:0)

我不知道它是否已经完成但是Fluent Interfaces非常棒......这是一个非常基本的实现。

public static class SvgLineHelper {
    public static SvgLine SvgLine(this HtmlHelper helper, string name) {
        return new SvgLine(name);
    }
}

public class SvgLine {
    string _name;
    int _x;
    int _y;
    int _width;
    int _height;
    IList<string> _styles;

    public SvgLine(string name) {
        _styles = new List<string>();
        _name = name;
    }

    public static SvgLine Create(string name) {
        return new SvgLine(name);
    }

    public SvgLine X(int x) {
        this._x = x;
        return this;
    }

    public SvgLine Width(int width) {
        this._width = width;
        return this;
    }

    public SvgLine Style(string style) {
        this._styles.Add(style);
        return this;
    }

    public override string ToString() {
        //create your string from this object here
        return string.Format("x:{0}, width:{1}, style:{2}", _x, _width, _styles[0]);
    }
}

以下是你在html中使用它的方法

<% Html.SvgLine("test").X(100).Width(50).Style("stroke-width:2px").ToString() %>

你必须调用tostring方法作为最后一次调用(或者最终确定你的流畅界面的另一种方法 - 返回你对象的字符串表示的方法)

答案 1 :(得分:0)

使用<%=调用的Html助手必须返回stringMvcHtmlString。因此,除非您在最后添加ToString或其他内容,否则您建议的API将无效,例如:

<%= Html.SvgLine("Line1").Class("blueLine").ToMvcHtmlString() %>

或者,您可以将一个流畅的配置对象作为参数传递给SvgLine

<%= Html.SvgLine(With().Name("Line1").Class("blueLine")) %>

无论哪种方式都可行。选择你喜欢的。