MVC4学习笔记(四)- MVC界面设计
2013-06-09 20:25
295 查看
个人理解
就是说你的项目不可能每条数据都是TextBox能解决的吧,所以你要改,什么textarea,dropdownlist,selectlist之类的你都要设计,这也是Mvc的一个缺点,没有可视化的组件给你直接拖上来(cshtml视图有,貌似这个用的不多),可能下载一些插件什么的能实现吧,但Lz目前还没发现1.1. Label设计
<div class="editor-label"> @Html.LabelFor(model => model.TeacherName) </div>
1.2. Textbox设计
<div class="editor-field"> @Html.EditorFor(model => model.TeacherName) @Html.ValidationMessageFor(model => model.TeacherName) </div>
1.3. Textarea设计
<div class="editor-field"> @Html.TextArea("ContinuingEducation", Model.ContinuingEducation, 5, 50, null) </div>
1.4. 下拉框设计
修改Control在类顶加入如下加粗部分字段namespace TeacherManageSystem.Controllers { [HandleError] [UserAuthorizeAttribute(Roles = "teacher")] public class TeacherProjectController : Controller { private TMSEntities db = new TMSEntities(); List<string> projectTypeList = new List<string>(); List<string> manageTypeList = new List<string>(); TeacherInfo teacherInfo; // // GET: /TeacherProject/ public ActionResult Index(string title)
在相关的action里绑定数据
// // GET: /TeacherProject/Create public ActionResult Create() { projectTypeList.Add("自然科学类"); projectTypeList.Add("社会科学类"); ViewData["projectType"] = new SelectList(projectTypeList); manageTypeList.Add("主持"); manageTypeList.Add("参与"); ViewData["manageType"] = new SelectList(manageTypeList); return View(); }
修改view对应位置
<div class="editor-label"> @Html.LabelFor(model => model.ProjectType) </div> <div class="editor-field"> @Html.DropDownList("ProjectType", (SelectList)ViewData["projectType"]) @Html.ValidationMessageFor(model => model.ProjectType) </div>
1.5. 单选项设计
[DisplayName("是否申请专利")] /// <summary> /// 是否取得专利 /// </summary> public bool IsPatent { get; set; }
1.6. 滚动新闻效果设计
<MARQUEE onmouseover=this.stop() onmouseout=this.start()scrollAmount=4 width=400 height=150 direction="up"> 你要滚动的内容</MARQUEE>
把这段直接放在<td></td>中
解释:
onmouseover=this.stop()是鼠标悬浮停止
onmouseout=this.start()是鼠标离开继续滚动
width和height分别是宽度和高度.根据需要自定义大小.
BGColor:滚动文本框的背景颜色。
scrollamount:一次滚动总的时间量,数字越小滚动越慢。
Behaviour:滚动的方式设置,三种取值:Scroll(循环滚动) lide(单次滚动)、Alternate(来回滚动)。
align:文字的对齐方式设置。可选择Middle(居中)、Bottom(居下)还是Top(居上)。
direction:表示滚动的方向,默认为从右向左:←←←。可选的值有right、down、up。滚动方向分别为:right表示→→→,up表示↑,down表示↓。
scrollDelay:这也是用来控制速度的,默认为90,值越大,速度越慢。通常scrollDelay是不需要设置的。
未完待续。。。
相关文章推荐
- MVC4学习笔记(二)- MVC设计实例,5分钟内完成你的Mvc项目
- 表现层的设计(二)——MVC如何处理复杂的界面元素
- MVC大型商贸系统(库存管理)技术解释(三) 主界面设计
- 学习IOS开发UI篇--MVC设计界面及数据的模型转换
- ASP.NET MVC快速开发框架清新简洁界面设计,有兴趣可以模仿参考
- C#实例:5个.net经典例子(窗体与界面设计)
- Android仿微信语音聊天界面设计
- 【转】Web测试中的界面测试用例设计
- [全程建模]交互建模和界面设计的区分详释
- C#巧用anchor和dock设计复杂界面(控件随着窗体大小的变化而变化)
- iOS和Android的app界面设计规范
- [转]一种全新的软件界面设计方法
- MVC 设计模式
- UIwindow【界面设计】 少数派的选择
- 界面设计原则
- 使用BootStrap和Metroui设计的metro风格微网站或手机app界面
- springMVC session过期跳转到登录界面
- Android界面设计
- 理解MVC,MVP,MVVM设计模式的区别