《Play for Java》学习笔记（一）项目框架 - Joanna Qian

《Play for Java》学习笔记（一）项目框架

从今天开始认真复习《Play for JAVA》，该书以一个案例为主线，以前为应付项目马马虎虎看了一遍，好多地方都不明白！现在跟着这本书再走一遍，认真模拟，当做一个项目啦！！

一、Play设置和新建Play项目

1、Play设置

1) 从http://playframework.org下载Play，并解压到你选择的目录

2）设置path

2、新建Play项目

Play new warehouse——Play会在当前路径下创建项目，项目目录为warehouse

此时在浏览器中输入：http://localhost:9000，即可浏览该Web应用的效果。

说明：

1）输入play eclipse <项目名>，Play会在项目目录中创建eclipse需要的配置文件，将其转换成eclipse项目。可以在eclipse中导入创建的项目。

Play转换eclipse项目时，在eclipse目录中生成了三个启动配置：

JPDA：连接到已经启动的Play Server，实现alive调试
helloworld：本地运行
Test：测试

选中它们，右键执行Run As，即可完成相应的任务。

2）有时需要清空所有编译后的文件如各种.class文件以恢复全新的状态，在待命状态下输入：

[web_app] $  clean（或者clean-all）

3）只编译，不运行——有时在进行程序编码为了校验语法等目的，不需要运行程序，以提高开发效率只需要执行编译指令 compile ：

[web_app] $  compile

4）退出SBT——在待命状态下输入：

[web_app] $  exit

5） .class文件在哪儿？

Play在运行时编译Java源代码，并将编译的类缓存在tmp\bytecode目录下。Play应用的可执行工件时.java源文件，不是已编译的.class（译注：包括jar文件）

二、项目框架

1. 项目结构

1）通用项目结构

web_app                          根目录                
├──  sbt                         SBT Unix 批处理脚本用于启动sbt-launch.jar 
├──  sbt.bat                     SBT Windows 批处理脚本用于启动sbt-launch.jar 
├──  sbt-launch.jar              SBT 启动的Java可执行类库
├── app                         Play Web 应用全部代码所在目录
|   ├── models                  模型代码所在目录
|   |    └──Message.scala       留言板例程模型代码
|   ├── controllers             控制器代码所在目录
|   |    └──Application.scala   默认控制器代码   |
|   └──views                    视图（Play Scala HTML模板） 代码所在目录
|       ├──main.scala.html      主模板文件
|       ├──index.scala.html     首页模板文件
|       └──msgboard.scala.html  留言板例程模板文件
├── conf                        Play 配置文件所在目录
|    ├──application.conf        应用配置文件
|    └──routes                  应用入口路由文件，所有的HTTP请求将通过该文件转发到指定的Scala对象处理
├── logs                        日志目录
|     └──application.log        应用运行日志
├── project                     SBT工程文件
|    ├── build.properties       保存所需的SBT版本信息，通常无需更改
|    ├── Build.scala            主要的工程配置文件
|    └── lugins.sbt             告知SBT本工程所需要的插件以及下载位置
├──public                       存储一切直接发送给浏览器的资源文件
|    ├──images                  图像文件，如JPEG、PNG、GIF等
|    ├──javascripts             JavaScript脚本文件
|    └──stylesheets             CSS样式表文件
└── target                      存放编译后的可执行代码和编译时的中间代码

2) 本书中使用的项目结构

├── README
├── app
│ ├── controllers
│ │        └── Application.java
│ └── views
│    ├── index.scala.html
│        └── main.scala.html
├── conf
│    ├── application.conf
│ └── routes
├── project
│ ├── build.properties
│ └── plugins.sbt
├── build.sbt
├── public
│ ├── images
│ │   └── favicon.png
│ ├── javascripts
│      │       └── jquery-1.9.0.min.js
│      └── stylesheets
│               └── main.css
└── test
├── ApplicationTest.java
└── IntegrationTest.java

2、项目配置

主要修改application.conf和routes两个文件，其中routes为：

# Home page
GET     / controllers.Application.index()
# Map static resources from the /public folder to the /assets URL path
GET    /assets/*file controllers.Assets.at(path="/public", file)

3. Debug

如果想在Eclipse中对Play项目调试，在菜单run--> debug cofigurations中设置

3、在项目中使用WebJar——WebJar Library

用WebJar引入Play，jQuery，bootstrap

设置1——在build.sbt中加入

libraryDependencies ++= Seq(
     "org.webjars"          % "webjars-play_2.10"       % "2.2.0"
    ,"org.webjars"          % "jquery"                  % "1.10.2"
    ,"org.webjars"          % "bootstrap"               % "3.1.1" 
)

设置2——在routes中加入

# Map static resources from the /public folder to the /assets URL path
GET     /assets/*file               controllers.Assets.at(path="/public", file)
GET     /webjars/*file              controllers.WebJarAssets.at(file)

引入——在模板文件（template）中加入

<link rel='stylesheet' href='@routes.WebJarAssets.at(WebJarAssets.locate("css/bootstrap.min.css"))'>
<script type='text/javascript' src='@routes.WebJarAssets.at(WebJarAssets.locate("jquery.min.js"))'></script>

4、在Play中使用RequireJS——参见项目example app

Play默认已经嵌入RequireJS，所有可以直接使用，不用设置WebJar引入。使用方法如下：

4.1）在模板文件（如：index.scala.html）的head标签中引入RequireJS

@Html(org.webjars.play.RequireJS.setup("js/app"))

全部html代码如下

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>My AngularJS App</title>
  <link rel="stylesheet" href="@routes.Assets.at("css/app.css")">
  @Html(org.webjars.play.RequireJS.setup("js/app"))
</head>
<body>
  <ul class="menu">
    <li><a href="#/view1">view1</a></li>
    <li><a href="#/view2">view2</a></li>
  </ul>

  <div ng-view></div>

  <div>Angular seed app: v<span app-version></span></div>

</body>
</html>

HTML Code

4.2）在JS中就可以使用RequireJS了，如public/js/app.js文件，如想使用RequireJS，只需在代码中写：

require(['angular', './controllers'], function(angular) {
     ......
}

/*global define, angular */

'use strict';

require(['angular', './controllers', './directives', './filters', './services', 'angular-route'],
  function(angular, controllers) {

    // Declare app level module which depends on filters, and services
    
    angular.module('myApp', ['myApp.filters', 'myApp.services', 'myApp.directives', 'ngRoute']).
      config(['$routeProvider', function($routeProvider) {
        $routeProvider.when('/view1', {templateUrl: 'partials/partial1.html', controller: controllers.MyCtrl1});
        $routeProvider.when('/view2', {templateUrl: 'partials/partial2.html', controller: controllers.MyCtrl2});
        $routeProvider.otherwise({redirectTo: '/view1'});
    }]);
      
    angular.bootstrap(document, ['myApp']);

});

JavaScript Code

posted on 2014-02-28 00:42 Joanna Qian 阅读(1577) 评论(1) 编辑收藏举报

刷新页面返回顶部