MGTemplateEngine 模版引擎简单使用(转)
原文:http://blog.csdn.net/crazy_srufboy/article/details/21748995
要实现的效果
首先上图中间的 标题至内容 都是使用UIWebView显示,评论是UITableView可以往下拖加载更多评论,也可以增加评论同删除评论。
动机
评细页中使用 UIWebView 会使显示内容更加的灵活和简单,当然你也许可以网上找UITextView的扩展同样也行,但我感觉HTML更符合我的需求。在多年的PHP开发中我们知道,其实详细页都是大同小异,主要是显示的内容风格不同。但在iOS平台上,做这些拼拼接接的活很累也不易于维护,还要不断计算各种类型页面对象的位置,实在吃力不讨好。使用UIWebView将是一个不错的选择。
MGTemplateEngine 模版引擎
MGTemplateEngine比较象 PHP 中的 Smarty 模版引擎,是一个轻量级的引擎,简单好用。只要设置很多不同的HMTL模版,就能轻松的实现一个View多种内容格式的显示,对于不熟悉HTML或者减轻工作量而言,把这些工作让设计分担一下还是很好的,也比较容易实现设计想要的效果。
首先,看看模版的代码
- <!DOCTYPE html>
- <html lang="en">
- <head>
- <meta charset="utf-8">
- <title></title>
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
- <link href="./detail.css" rel="stylesheet">
- </head>
- <body>
- <div id='container' name="container">
- <div class="title">{{ title }}</div>
- <div class="date">{{ date }}</div>
- <div class="content">{{ content }}</div>
- </div>
- </body>
- </html>
Objective-C代码 - 下面的创建代码MGTemplateEngine都是从官方的例子中参考下来的,已经有很详细的说明
- // Set up template engine with your chosen matcher.
- MGTemplateEngine *engine = [MGTemplateEngine templateEngine];
- //[engine setDelegate:self];
- [engine setMatcher:[ICUTemplateMatcher matcherWithTemplateEngine:engine]];
- // 这里就是设置,或者里边塞变量的地方。其实也可以设置一个数组,这样模板的灵活也会更强。这里我就不演示了官方有例子
- [engine setObject:self.detailData[@"title"] forKey:@"title"];
- [engine setObject:self.detailData[@"content"] forKey:@"content"];
- // MGTemplateEngine/Detail/detail.html
- // MGTemplateEngine/Detail/detail.css
- NSString *templatePath = [[NSBundle mainBundle] pathForResource:@"detail" ofType:@"html"];
- // Process the template and display the results.
- NSString *html = [engine processTemplateInFileAtPath:templatePath withVariables:nil];
- // 获得HTML
- self.htmlWebView = [[UIWebView alloc] initWithFrame:CGRectMake(8, 5, 304, 320)];
- self.htmlWebView.delegate = self;
- self.htmlWebView.userInteractionEnabled = NO;
- // 你就能加载到HTML里面的.css文件
- NSString *baseURL = [[[NSBundle mainBundle] resourcePath] stringByAppendingPathComponent:@"Detail"];
- [self.htmlWebView loadHTMLString:html baseURL:[NSURL fileURLWithPath:baseURL]];
- [self.detailView addSubview:self.htmlWebView];
因为我的UIWebView是在插入到UITableView,所以在UIWebView加载完后,就得重新计算高度。因为我想让用户感觉不到这其实是一个HTML。
- // 我将UIWebView添加到了self.detailView
- self.listTableView.tableHeaderView = self.detailView;
- #pragma mark -
- #pragma mark -# UIWebViewDelegate
- - (void)webViewDidFinishLoad:(UIWebView *)webView {
- // 获取整个HMTL的高度,这很好理解,很简单的JS
- NSString *heightString = [self.htmlWebView stringByEvaluatingJavaScriptFromString:@"document.getElementById(\"container\").offsetHeight;"];
- // 重设view内容大小
- CGRect nFrame = self.detailView.frame;
- nFrame.size.height = [heightString doubleValue] + 35.0;
- self.detailView.frame = nFrame;
- // 重设webview内容大小
- CGRect nWebViewFrame = self.htmlWebView.frame;
- nWebViewFrame.size.height = [heightString doubleValue] + 15;
- self.htmlWebView.frame = nWebViewFrame;
- // 让UIWebView加载完后,才设置UITableView,最后才加载评论
- [self tableViewSetting];
- [self getCommentList];
- }
以上的都是 MGTemplateEngine 很基本的使用,将来也会大派用场的。对于内容页的显示,没有比HTML来的更方便直接,通过切换模版和简单的参数设置,多个不同类型的栏目也可以使用同一个详细页,很大程度上减轻工作理和易于维护。
要更深入的了解,可以去 MGTemplateEngine 官方网站
MGTemplateEngine 模版引擎简单使用(转)的更多相关文章
- MGTemplateEngine 模版发动机简单使用
https://github.com/nxtbgthng/MGTemplateEngine MGTemplateEngine 模版引擎 MGTemplateEngine比較象 PHP 中的 Smart ...
- 简单JavaScript模版引擎优化
在上篇博客最简单的JavaScript模板引擎 说了一下一个最简单的JavaScript模版引擎的原理与实现,作出了一个简陋的版本,今天优化一下,使之能够胜任日常拼接html工作,先把上次写的模版函数 ...
- 简单的 js 模版引擎
简单的 js 模版引擎 var tplEngine = function(tpl, data) { var reg = /<%([^%>]+)?%>/g, regOut = /(^( ...
- 构建自己的PHP框架--构建模版引擎(1)
前段时间太忙,导致好久都没有更新博客了,今天抽出点时间来写一篇. 其实这个系列的博客很久没有更新了,之前想好好规划一下,再继续写,然后就放下了,今天再捡起来继续更新. 今天我们来说一下,如何构建自己的 ...
- js模版引擎handlebars.js实用教程——为什么选择Handlebars.js
返回目录 据小菜了解,对于java开发,涉及到页面展示时,比较主流的有两种解决方案: 1. struts2+vo+el表达式. 这种方式,重点不在于struts2,而是vo和el表达式,其基本思想是: ...
- PHP模版引擎 – Twig
在网站开发过程中模版引擎是必不可少的,PHP中用的最多的当属Smarty了.目前公司系统也是用的Smarty,如果要新增一个页面只需把网站的头.尾和左侧公共部分通过Smarty的include方式引入 ...
- Nodejs学习笔记(五)--- Express安装入门与模版引擎ejs
目录 前言 Express简介和安装 运行第一个基于express框架的Web 模版引擎 ejs express项目结构 express项目分析 app.set(name,value) app.use ...
- T4教程1 T4模版引擎之基础入门
T4模版引擎之基础入门 额,T4好陌生的名字,和NuGet一样很悲催,不为世人所熟知,却又在背后默默无闻的奉献着,直到现在我们项目组的人除了我之外,其它人还是对其豪无兴趣,基本上是连看一眼都懒得看 ...
- T4教程2 T4模版引擎之生成数据库实体类
T4模版引擎之生成数据库实体类 在通过T4模版引擎之基础入门 对T4有了初步印象后,我们开始实战篇.T4模板引擎可以当做一个代码生成器,代码生成器的职责当然是用来生成代码(这不是废话吗).而这其中 ...
随机推荐
- wafer
Wafer Dicing:晶圆划片 wafer:晶圆 Wafer bumping:晶圆凸起 300mm wafer line:300mm晶圆线 wafer fabrication:晶圆加工 silic ...
- 强烈推荐一款CSS导航菜单
强烈推荐一款CSS导航菜单,用到政府学校类网站上超级不错,有点类似站长网菜单的味道,只不过颜色不一样而已,这种菜单还不是真正意义上的“下拉”菜单,应该叫滑出菜单吧?反正比较不错,不多说了. <! ...
- How ASP.NET MVC Works?
原文地址:http://www.cnblogs.com/artech/archive/2012/04/10/how-mvc-works.html?ADUIN=7783008&ADSESSION ...
- iOS 堆和栈 的理解
本文部分内容整理于网络,感谢原作者. 堆(heap)和栈(stack)是C/C++编程不可避免会碰到的两个基本概念.首先,这两个概念都可以在讲数据 结构的书中找到,他们都是基本的数据结构,虽然栈更为简 ...
- Docker自学资源
1. Docker 的官方文档和博客: Docker官方文档 Docker Blog(官方博客 ) 2. Docker中文这区 网站上的[Docker手册]以及[Docker ppt]两个栏目有 Do ...
- 操作hadoop的经验积累
操作hadoop的经验积累 Hadoop namenode –format 在执行格式化-format命令时,要避免namenode的namdespaceid与datanode的namespaceid ...
- Server(Iocp)的那些烦恼
自G-Socket0.88版开源以来,得到很多朋友的支持.从1.0版本至2.0之前,内核几乎没有改变,经过多处的应用其稳定性和效率表现是相当不错的.这几年的经验总结成一句话:服务器程序不是有了一个好的 ...
- iOS 键盘挡住UITextField
iOS经常使用的两个功能:点击屏幕和return隐藏虚拟键盘和解决虚拟键盘挡住UITextField的方法 iOS上面对键盘的处理非常不人性化,所以这些功能都须要自己来实现, 首先是点击return ...
- sctf pwn400
这个题目在这个链接中分析得很透彻,不再多余地写了.http://bruce30262.logdown.com/posts/245613-sctf-2014-pwn400 exploit: from s ...
- Js特效总结
1.//#hidediv2为一个需要隐藏的div 这个功能实现当点击hidediv2以外的其他任何位置时,隐藏该div $(document).click(function() { ...