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

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. js操作label,给label赋值,和取label的值

    取值:var Label_text=document.getElementById('test_label').innerHTML; 赋值:document.getElementById('test_ ...

  2. Global eval. What are the options?

    David Flanagan最近写了一个关于全局eval的简单表达式,可以用一行式子表示: var geval = this.execScript || eval; 尽管看起来很简短,但是跨浏览器的兼 ...

  3. Spring Boot启动流程详解(一)

    环境 本文基于Spring Boot版本1.3.3, 使用了spring-boot-starter-web. 配置完成后,编写了代码如下: @SpringBootApplication public ...

  4. gnuplot: 一种更为简洁的曲线,柱状图绘图软件

    gnuplot: 一种更为简洁的曲线,柱状图绘图软件 gnuplot: 一种更为简洁的曲线,柱状图绘图软件 Zhong Xiewei Wed Jun 25 gnuplot简单介绍 关于gnuplot的 ...

  5. JS实现输入框只能输入数字

    键盘下落事件实现输入框只能输入数字: <script type="text/javascript"> // 实现输入框只能输入数字 function ValidateN ...

  6. 异步IO比同步阻塞IO性能更好吗?为什么?

    最近在看node.js, 介绍中提到node是异步io的方式实现, 性能比同步阻塞io的更好. 对于一个request而言, 如果我们依赖io的结果, 异步io和同步阻塞io都是要等到io完成才能继续 ...

  7. 【原创】Kafka topic常见命令解析

    本文着重介绍几个常用的topic命令行命令,包括listTopic,createTopic,deleteTopic和describeTopic等.由于alterTopic并不是很常用,本文中就不涉及了 ...

  8. const 和 readonly

    const 和 readonly 的异同 Const readonly 字面意 不变常量,不可修改 只读操作,不可写 初始化 必须在声明的同时赋值 可在声明和构造方法中进行赋值 所属关系 类.即sta ...

  9. 客户端调用 WCF 的几种方式

    转载网络代码.版权归原作者所有..... 客户端调用WCF的几种常用的方式: 1普通调用 var factory = new DataContent.ServiceReference1.Custome ...

  10. C#文件或文件夹压缩和解压方法(通过ICSharpCode.SharpZipLib.dll)

    我在网上收集一下文件的压缩和解压的方法,是通过ICSharpCode.SharpZipLib.dll 来实现的 一.介绍的目录 第一步:下载压缩和解压的 ICSharpCode.SharpZipLib ...