程序以及基本可用了,需要继续完善页面

1.创建页面模板

创建文件 app/views/tags/display.html

*{ Display a post in one of these modes: 'full', 'home' or 'teaser' }*

<div class="post ${_as == 'teaser' ? 'teaser' : ''}">
<h2 class="post-title">
<a href="#">${_post.title}</a>
</h2>
<div class="post-metadata">
<span class="post-author">by ${_post.author.fullname}</span>,
<span class="post-date">${_post.postedAt.format('dd MMM yy')}</span>
#{if _as != 'full'}
<span class="post-comments">
 |  ${_post.comments.size() ?: 'no'}
comment${_post.comments.size().pluralize()}
#{if _post.comments}
, latest by ${_post.comments[0].author}
#{/if}
</span>
#{/if}
</div>
#{if _as != 'teaser'}
<div class="post-content">
<div class="about">Detail: </div>
${_post.content.nl2br()}
</div>
#{/if}
</div> #{if _as == 'full'}
<div class="comments">
<h3>
${_post.comments.size() ?: 'no'}
comment${_post.comments.size().pluralize()}
</h3> #{list items:_post.comments, as:'comment'}
<div class="comment">
<div class="comment-metadata">
<span class="comment-author">by ${comment.author},</span>
<span class="comment-date">
${comment.postedAt.format('dd MMM yy')}
</span>
</div>
<div class="comment-content">
<div class="about">Detail: </div>
${comment.content.escape().nl2br()}
</div>
</div>
#{/list} </div>
#{/if}

  

  

修改index.html

#{extends 'main.html' /}
#{set title:'Home' /} #{if frontPost} #{display post:frontPost, as:'home' /} #{if olderPosts.size()} <div class="older-posts">
<h3>Older posts <span class="from">from this blog</span></h3> #{list items:olderPosts, as:'oldPost'}
#{display post:oldPost, as:'teaser' /}
#{/list}
</div> #{/if} #{/if} #{else}
<div class="empty">
There is currently nothing to read here.
</div>
#{/else}

  

  

2.修改Layout  views\main.html

<!DOCTYPE html>

<html>
<head>
<title>#{get 'title' /}</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<link rel="stylesheet" type="text/css" media="screen" href="@{'/public/stylesheets/main.css'}">
<link rel="shortcut icon" type="image/png" href="@{'/public/images/favicon.png'}">
</head>
<body>
<div id="header">
<div id="logo">
yabe.
</div>
<ul id="tools">
<li>
<a href="#">Log in to write something</a>
</li>
</ul>
<div id="title">
<span class="about">About this blog</span>
<h1><a href="#">${blogTitle}</a></h1>
<h2>${blogBaseline}</h2>
</div>
</div> <div id="main">
#{doLayout /}
</div> <p id="footer">
Yabe is a (not that) powerful blog engine built with the
<a href="http://www.playframework.org">Play framework</a>
as a tutorial application.
</p> </body>
</html>

  

3. Application.java 中添加方法,在页面上添加元素

@Before
static void addDefaults() {
renderArgs.put("blogTitle", Play.configuration.getProperty("blog.title"));
renderArgs.put("blogBaseline", Play.configuration.getProperty("blog.baseline"));
}

添加渲染 blog.title blog.baseline

4.修改配置文件 conf\application.conf

# Blog engine configuration
# ~~~~~
blog.title=Yet another blog
blog.baseline=We won't write about anything

  

5.添加页面样式

CSS: http://play-framework.herokuapp.com/zh/files/main.css

添加到 /public/stylesheets/main.css

运行效果:

..

Play Framework 完整实现一个APP(五)的更多相关文章

  1. Play Framework 完整实现一个APP(十一)

    添加权限控制 1.导入Secure module,该模块提供了一个controllers.Secure控制器. /conf/application.conf # Import the secure m ...

  2. Play Framework 完整实现一个APP(二)

    1.开发DataModel 在app\moders 下新建User.java package models; import java.util.*; import javax.persistence. ...

  3. Play Framework 完整实现一个APP(十四)

    添加测试 ApplicationTest.java @Test public void testAdminSecurity() { Response response = GET("/adm ...

  4. Play Framework 完整实现一个APP(十三)

    添加用户编辑区 1.修改Admin.index() public static void index() { List<Post> posts = Post.find("auth ...

  5. Play Framework 完整实现一个APP(十二)

    1.定制CRUD管理页面 > play crud:ov --layout 替换生成文件内容 app/views/CRUD/layout.html #{extends 'admin.html' / ...

  6. Play Framework 完整实现一个APP(十)

    1.定制Comment列表 新增加Comment list页面,执行命令行 > play crud:ov --template Comments/list 会生成/app/views/Comme ...

  7. Play Framework 完整实现一个APP(九)

    添加增删改查操作 1.开启CRUD Module 在/conf/application.conf 中添加 # Import the crud module module.crud=${play.pat ...

  8. Play Framework 完整实现一个APP(八)

    创建Tag标签 1.创建Model @Entity @Table(name = "blog_tag") public class Tag extends Model impleme ...

  9. Play Framework 完整实现一个APP(六)

    需要为Blog添加 查看和发表评论的功能 1.创建查看功能 Application.java中添加 show() 方法 public static void show(Long id) { Post ...

随机推荐

  1. 如何远程备份MySQL binlog

    以前备份binlog时,都是先在本地进行备份压缩,然后发送到远程服务器中.但是这其中还是有一定风险的,因为日志的备份都是周期性的,如果在某个周期中,服务器宕机了,硬盘损坏了,就可能导致这段时间的bin ...

  2. php对表格进行批量操作如全选反选删除功能

    <!DOCTYPE> <html> <head> <meta http-equiv="content-type" content=&quo ...

  3. DEBIAN下中文显示

    转:http://www.cppblog.com/colorful/archive/2012/05/28/176516.aspx 一.首先检查LOCALE情况 说明:DEBIAN因为基于GNU所以,对 ...

  4. 相克军_Oracle体系_随堂笔记008-存储结构

    控制文件.数据文件.日志文件    放在存储上.   参数文件:数据库启动时读取,并不关闭,但是启动过后丢了也没事.一般放在服务器上. $ORACLE_HOME/dbs下   备份文件{     控制 ...

  5. 第一篇blog

    之前不用blog,但是在杭电oj,poj上刷题,总会自己总结题型和使用什么算法,算法模板,自己在笔记本上写,耗时费力,感觉用键盘敲得总结,分享,大家相互学习提高.有时遇到不会做的,或者总是在oj上跑的 ...

  6. C#设置文件权限

    在开发中,我们经常会使用IO操作,例如创建,删除文件等操作.在项目中这样的需求也较多,我们也会经常对这些操作进行编码,但是对文件的权限进行设置,这样的操作可能会手动操作,现在介绍一种采用代码动态对文件 ...

  7. ASP.NET通过递归添加树(Treeview)

    先来看看效果,基本上就是这样的. 所谓树,无非就是2点,第一个:根节点,第二:叶子节点,其中叶子节点中还可能有叶子节点,但是根节点始终只有一个. 下面贴上 各部分的代码 1.PAGE_LOAD载入事件 ...

  8. github生成静态博客

    github生成静态博客很简单. 1.确认你知道你github的用户名,我的叫做chenxing12 2.创建一个项目名字叫做:用户名.github.io 我的用户名叫做chenxing12,所以我创 ...

  9. Net设计模式实例之抽象工厂模式(Abstract Factory Pattern)

    一.抽象工厂模式简介(Bref Introduction) 抽象工厂模式(Abstract Factory Pattern),提供一个创建一系列相关或者相互依赖对象的接口,而无需制定他们的具体类.优点 ...

  10. How PhoneGap & Titanium Works

    转载自 http://www.appcelerator.com/blog/2012/05/comparing-titanium-and-phonegap/ How PhoneGap Works As ...