zoukankan      html  css  js  c++  java
  • Chapter 2: Design the user experience

    Apply the user interface design for a web application

     介绍了Css的常用属性和html5的新element,以及Htmlhelper的简单方法,如BeginForm, TextBox, TextArea。

    Design and implement UI behavior

    • client validation:

    在Model中使用attribute binding to property,在View中使用EditorFor/ValidationMessageFor实现client validation。

    Server side再通过ModelState.IsValid来check。

    • remote validation

    通过Remote("Action", "Controller")属性binding to property,

    如下web.config中key的value需为true。

    <appSettings>

        <add key="ClientValidationEnabled" value="true" />

        <add key="UnobtrusiveJavaScriptEnabled" value="true" />

    </appSettings>

    • 使用AJAX更新部分page
    • 使用jQuery实现UI

    Compose the UI layout of an application

    1. 用partial view实现公共部分,@Html.Partial("partialPage")
    2. 使用Razor的templates实现如EditorFor这类功能,~/Views/ControllerName(Shared)/EditorTemplates/Templatename.cshtml, ~/Views/ControllerName(Shared)/DisplayTemplates/Templatename.cshtml
    3. 使用Master page,Layout可变,if(ViewBag.switch=="layout1") Layout = “~/Views/Shared/_plainLayout.cshtml"; else Layout = "~/Views/Shared/_Layout.cshtml";

    Enhance application behavior and style based on browser feature detection

    • 使用userAgent header的信息判断browser的名字,如IE
    • 通过DisplayModeProvider.Instance.Modes.Insert(0, new DefaultDisplayMode("")...),支持不同的display mode。

    Plan an adaptive UI layout

    • 使用<meta> tag和CSS的@media查询指定layout
    • 使用jQuery.Mobile.MVC
    --------------------------- 知道的更多,不知道的也更多 ---------------------------
  • 相关阅读:
    大话设计模式学习笔记简单工厂 工厂 抽象工厂
    910月总序(update 1)
    虚表思考再探虚表布局
    深入浅出 (代码+图示)递归反转一个栈 lp 专题讲解
    算法导论笔记 二叉查找树问题
    叹 尽然把vs2008 crash!!
    关于二叉查找树的讨论+ 我的误解
    算法情景分析 二叉排序树 前驱+后缀 测试用列
    iBatis.NET中使用时间的注意事项
    JDK和JRE官方下载地址
  • 原文地址:https://www.cnblogs.com/mryux/p/4737703.html
Copyright © 2011-2022 走看看