EasyMvc入门教程-基本控件说明(3)时间线
我们有时候经常看到如下的页面:

或者快递物流信息图标,那么利用EasyMvc如何实现呢?很简单,看下面的例子:
@{
var data=new List<TimeLineItem>()
{
new TimeLineItem() {Title = "", Text = "开始"},
new TimeLineItem() {Title = "2014年", Text = "新版本发布1.0"},
new TimeLineItem() {Title = "2015年", Text = "新版本发布3.0"},
};
}
@Html.Q().TimeLine().SourceItems(data)
代码还容易看懂吧?基本就是准备数据,然后调用EasyMvc提供的组件TimeLine,(PS:实际中数据一般不写在这里哦。。这里是为了演示)那么效果如何呢?请看下图:

相信还是比较简单吧:)
技巧:一般人不告诉他:)数据里的Text支持html的,所以,在必要的时候,可以插入少量的html代码实现个性化亮点,比如增加个小图标什么的。
总结:时间线的使用就简单介绍到这里,怎么样,是不是很简单,脑海里面向对象的概念浮现没? :)
更多使用示例请浏览在线示例:http://core.zwc.cn
EasyMvc入门教程-基本控件说明(3)时间线的更多相关文章
- EasyMvc入门教程-基本控件说明(8)提醒导航
提醒导航顾名思义就是提醒大家注意某些文字了..请看下面的例子: 实现代码如下: @Html.Q().BlockRemind().Text("我可以作为提醒使用") 有的同学会说:这 ...
- EasyMvc入门教程-基本控件说明(11)菜单导航
基本上,是个网站就会有菜单导航,目前流行的菜单是不是这样样子的? 似乎是bootstrap引领的风格,我们就用EasyMvc实现吧,上代码: @{ var data = new List<Men ...
- EasyMvc入门教程-基本控件说明(13)选项卡导航
选项卡Tab导航主要用于企业页面显示不同子类或者子页面的信息内容. 先来一个基本的使用例子:代码如下: @{ var data = new List<TabItem>() { new Ta ...
- EasyMvc入门教程-图形控件说明(21)线形图+柱状图+饼形图
本章将介绍一些基本但常用的图形:线型图,柱状图和饼形图. 以上三种图形对于的数据都是键值对数组,请参考第一个例子: @{ var data = new List<LineItem>(); ...
- EasyMvc入门教程-基本控件说明(1)按钮
按钮是我们最常用的控件之一了,先看下我们提供的按钮风格: 不同颜色的: 实现代码: @Html.Q().Button().Text("Danger").ColorDanger() ...
- EasyMvc入门教程-基本控件说明(4)折叠面板
折叠面板一般出现在管理后台,大家用的OutLook里就是用了折叠面板,样子大概是这样的: 把其中的内容替换成图标按钮,是不是就是我们常见的样子了?:)那么如何实现呢?请看例子: @{ var data ...
- EasyMvc入门教程-基本控件说明(6)进度条
进度条的发明是很牛逼的,就如12306采用了队列解决了系统崩溃的问题一样..:) 进度条大家都见过,那么我们先来实现一个简单的进度条,请看例子: @Html.Q().Progress().Value( ...
- EasyMvc入门教程-基本控件说明(12)栏目导航
栏目导航一般用来显示当前页面所在的模块层级位置关系,如下图所示: 当然也有前端网站作为小栏目导航,凡是没有绝对,只要不违和就好:),下面上代码: @{ var data = new List<N ...
- EasyMvc入门教程-基本控件说明(2)定时器
我们有时候希望系统能自动刷新后台数据或者做某个动作,那么定时器的作用就体现出来了. EasyMvc默认提供的服务器可以定时调前端方法与定时调后端方法,先看例子: 定时调客户端事件 实现代码: @Htm ...
随机推荐
- STL学习笔记5--map and multimap
Maps是一种关联式容器,包含“关键字/值”对. Multimaps和maps很相似,但是MultiMaps允许重复的元素. 简单介绍: 1.声明,首先包含头文件 “map” map <int, ...
- C# 方法重载 overload、方法重写 override、隐藏 new
一.重载:同一个作用域内发生(比如一个类里面),定义一系列同名方法,但是方法的参数列表不同.这样才能通过传递不同的参数来决定到底调用哪一个. 值得注意的是,方法重载只有通过参数不同来判断调用哪个方法, ...
- 理解机器为什么可以学习(三)---Theory of Generalization
前边讨论了我们介绍了成长函数和break point,现在继续讨论m是否成长很慢,是否能够取代M. 成长函数就是二分类的排列组合的数量.break point是第一个不能shatter(覆盖所有情形) ...
- 模板与c++11--右值引用
函数参数传递 struct huge_data{ char *content; unsigned sz; huge_data():content(),sz(){ cout<<this< ...
- Eureka 简介以及简单示例(创建EurekaServer工程)
Eureka 是一款开源的服务注册与发现组件,通过配合其他组件可提供负载均衡能力. 服务发现类型的技术对比: 名称 类型 AP/CP 语言 依赖 集成 一致性算法 Eureka General AP ...
- cookie和session机制区别
会话(Session)跟踪是Web程序中常用的技术,用来跟踪用户的整个会话.常用的会话跟踪技术是Cookie与Session.Cookie通过在客户端记录信息确定用户身份,Session通过在服务器端 ...
- CentOS 6.4下编译安装MySQL 5.6.14 (转)
CentOS 6.4下通过yum安装的MySQL是5.1版的,比较老,所以就想通过源代码安装高版本的5.6.14. 正文: 一:卸载旧版本 使用下面的命令检查是否安装有MySQL Server rpm ...
- Transformer解析与tensorflow代码解读
本文是针对谷歌Transformer模型的解读,根据我自己的理解顺序记录的. 另外,针对Kyubyong实现的tensorflow代码进行解读,代码地址https://github.com/Kyuby ...
- Flask deployment on gunicorn with flask script
https://stackoverflow.com/questions/34265870/flask-deployment-on-gunicorn-with-flask-script 依赖 Flask ...
- BZOJ 3940: [Usaco2015 Feb]Censoring
3940: [Usaco2015 Feb]Censoring Time Limit: 10 Sec Memory Limit: 128 MBSubmit: 367 Solved: 173[Subm ...