介紹 Play 框架最好的方法就是給一個完整的演示步驟讓你看看 Play 到底有多簡單。本演示使用最新的 Play 2.0 Beta 版。
本文是在 Linux 環境下進行,如果你使用的 Windows,那會有一些小區別,例如路徑和環境變量的設置等等,請自行解決。
廢話少說,下面我們開始:
1. 下載並安裝
1
$ wget http://download.playframework.org/releases/play-2.0-beta.zip
2
$ unzip -q play-2.0-beta.zip
3
$
export
PATH=$PATH:`
pwd
`/play-2.0-beta
2. 創建一個新應用
01
$ play new tasks
02
03
What is the application name?
04
> tasks
05
06
Which template
do
you want to use
for
this new application?
07
08
1 - Create a simple Scala application
09
2 - Create a simple Java application
10
3 - Create an empty project
11
12
> 2
來看看都生成了什麼文件?
01
$
find
tasks -
type
f
02
tasks/.gitignore
03
tasks/app/controllers/Application.java
04
tasks/app/views/index.scala.html
05
tasks/app/views/main.scala.html
06
tasks/conf/application.conf
07
tasks/conf/routes
08
tasks/project/build.properties
09
tasks/project/Build.scala
10
tasks/project/plugins.sbt
11
tasks/public/images/favicon.png
12
tasks/public/javascripts/jquery-1.6.4.min.js
13
tasks/public/stylesheets/main.css
3. 運行程序
1
$
cd
tasks
2
$ play run
然後你就可以打開浏覽器訪問 http://localhost:9000 , 你看到什麼了嗎?
接下來我們加點動態的數據
編輯 app/views/index.scala.html 文件,內容如下:
1
@
(items
:
String)
2
3
@
main(
"Tasks"
) {
4
<h
1
>
@
item</h
1
>
5
}
編輯 app/controllers/Application.java 並修改 index() 方法,代碼如下(我們故意少輸入一個分號)
1
return
ok(index.render(
"Things"
))
刷新一下 http://localhost:9000 頁面就會報一個模板編譯錯誤:not found: value item.
該編譯錯誤表明必須聲明模板參數
在控制台中,輸入 Ctrl D 以停止 Play 程序,然後重新啟動 Play 控制並編譯程序:
1
$ play
2
[tasks] $ compile
在沒有運行應用的情況下你也可以發現這個模板編譯的錯誤
再次啟動應用:
1
[tasks] $ run
在 app/views/index.scala.html 修復該錯誤
刷新頁面,將顯示一個 Java 的編譯錯誤:';' expected
在 app/controllers/Application.java 中將那個缺少的分號加上。
再次刷新頁面,將顯示 Things 標題
在 public/stylesheets/main.css 中,我們添加一些 css 代碼:
01
body {
font-family
:
"Helvetica Neue"
;
padding
:
2em
;
background
:
#B2EB5A
url
(
"/assets/images/play20header.png"
)
no-repeat
top
center
; }
02
body:before {
content
:
'Play 2.0 task list demo'
;
color
:rgba(
255
,
255
,
255
,
0.7
);
font-size
:
150%
;
text-transform
:
uppercase
;
letter-spacing
:
0.4em
; }
03
ul {
padding
:
0
;
list-style
:
none
; }
04
li, form {
width
:
30em
;
background
:
white
;
padding
:
1em
;
border
:
1px
solid
#ccc
; border-radius:
0.5em
;
margin
:
1em
0
;
position
:
relative
;
min-height
:
1.2em
; }
05
li a {
text-decoration
:
none
;
color
:
transparent
;
position
:
absolute
;
top
:
1em
;
right
:
1em
; }
06
li a:after {
content
:
'❎'
;
color
:
#aaa
;
font-size
:
120%
;
font-weight
:
bold
; }
07
form * {
font-size
:
120%
; }
08
input {
width
:
16em
; }
09
button {
cursor
:
pointer
;
color
:
white
;
background-color
:
#3D6F04
;
background-image
: -webkit-linear-gradient(
top
,
#5AA706
,
#3D6F04
);
text-shadow
:
0
-1px
0
rgba(
0
,
0
,
0
,
0.25
);
border
:
1px
solid
#CCC
;
border-color
: rgba(
0
,
0
,
0
,
0.1
) rgba(
0
,
0
,
0
,
0.1
) rgba(
0
,
0
,
0
,
0.25
); border-radius:
4px
; }
10
p.error {
margin
:
0
;
color
:
#c00
; }
在 app/controllers/Application.java 中,我們使用一個字符串 items 方法參數來替換 Things 字符串
在 conf/routes 中,我們替換第一條路由信息(使用小寫的 string)
1
GET / controllers.Application.index(i: string)
打開 http://localhost:9000/?items=Tasks 將顯示路由編譯錯誤信息:
The routes file is compiled, and HTTP parameters must be declared. HTTP parameter names do not have to match the action method names.
在 conf/routes 中糾正這個錯誤:
1
GET / controllers.Application.index(i: String)
重新刷新頁面
撤銷剛剛在 app/controllers/Application.java 中的更改,刪除 index 方法參數:
1
public static Result index(
final
String items) {
2
return
ok(index.render(items));
3
}
撤銷在 conf/routes 中的更改,刪除參數:
1
GET / controllers.Application.index()
下面還有在 IDEA 環境中的使用以及表單處理和驗證等,詳情請看原文。