ASP.NET MVC入门---实例演示：通过ContentResult实现主题定制

来源：互联网发布：电子幻灯片制作软件编辑：程序博客网时间：2024/05/30 04:59

实例演示：通过ContentResult实现主题定制

由于可以通过ContentResult的ContentType属性指定媒体类型，所以我们不仅仅可以利用它来返回最终会在浏览器中显示的文本，还可以返回其他一些类型的文本内容，比如JavaScript脚本（“text/javascript”）和CSS样式（“text/css”）等。通过ContentResult我们可以实现“静态文本的动态化”，也就是说我们可以在某个Action中根据当前的请求动态地生成一些文本（比如CSS样式），而这些文本内容原本是定义在静态文本文件中。

在接下来的这个实例演示中，我们将利用ContentResult实现对界面主题的定制。实现的机制非常简单：让一个返回类型为ContentResult的Action方法返回基于当前主题的CSS样式，而当前的主题通过一个可持久化的Cookie保存下来。我们在一个ASP.NET MVC应用中定义了如下一个HomeController，其Action方法Css返回一个表示CSS样式的ContentResult。在该Action方法中，我们从请求中提取表示主题的Cookie，并根据它生成基于当前主题的CSS样式（这里仅仅设置了字体类型和大小）。

   1: public class HomeController : Controller

   2: {

   3:     //其他成员

   4:     public ActionResult Css()

   5:     {

   6:         HttpCookie cookie = Request.Cookies["theme"] ?? new HttpCookie("theme","default");

   7:         switch (cookie.Value)

   8:         {

   9:             case "Theme1": return Content("body{font-family: SimHei; font-size:1.2em}", "text/css");

  10:             case "Theme2": return Content("body{font-family: KaiTi; font-size:1.2em}", "text/css");

  11:             default: return Content("body{font-family: SimSong; font-size:1.2em}", "text/css");

  12:         }

  13:     }

  14: }

我们在HomeController中定义了如下两个Index方法，无参的Index方法（针对HTTP-GET请求）从预定义Cookie中提取当前的主题（如果没有则采用默认的主题default）并以ViewBag的形式传递给View。另一个应用HttpPostAttribute特性的Index方法中接收用户提交的主题名称并设置为响应的Cookie，同样通过ViewBag的形式保存当前的主题名称。两个Index方法最终都将默认的View呈现出来。

   1: public class HomeController : Controller

   2: {

   3:     //其他成员

   4:     public ActionResult Index()

   5:     {

   6:         HttpCookie cookie = Request.Cookies["theme"] ?? new HttpCookie("theme", "default");

   7:         ViewBag.Theme = cookie.Value;

   8:         return View();

   9:     }

10:

  11:     [HttpPost]

  12:     public ActionResult Index(string theme)

  13:     {

  14:         HttpCookie cookie = new HttpCookie("theme", theme);

  15:         cookie.Expires = DateTime.MaxValue;

  16:         Response.SetCookie(cookie);

  17:         ViewBag.Theme = theme;

  18:         return View();

  19:     }

  20: }

通过Css方法的定义看出我们定义了三个主题（Theme1、Theme2和Default），它们采用不同的中文字体（黑体、楷体和宋体）。Action方法Index对应View具有如下一个表单，该表单中为这三种主题添加了相应的RadioButton使用户可以对主题进行定制。这个View最核心的部分是用于引用CSS文件的<link>元素，可以看到它的href属性指向的地址正是对应着HomeController的Action方法Css，也就是说最终用于控制页面样式的CSS是通过调用该Action得到的。

   1: <html>

   2: <head>

   3:     <title>主题设置</title>

   4:     <link type="text/css"  rel="Stylesheet" href="@Url.Action("Css")" />

   5: </head>

   6: <body>

   7:     @using(Html.BeginForm())

   8:     {

   9:         string theme = ViewBag.Theme.ToString();

  10:         @Html.RadioButton("theme", "Default", theme == "Default")<span>默认主题（宋体）</span><br/>

  11:         @Html.RadioButton("theme", "Theme1", theme == "Theme1")<span>主题1（黑体）</span><br/>

  12:         @Html.RadioButton("theme", "Theme2", theme == "Theme2")<span>主题2（楷体）</span><br />

  13:         <input type="submit" value="保存" />

  14:     }

  15: </body>

  16: </html>

现在我们直接运行我们的程序，并在出现的“主题设置”界面中设置不同的主题，界面的样式（字体）将会根据我们选择的主题而动态改变，具体的显示效果如下图所示。

clip_image004

0 0