Common use cases

    让我们来声明一个 模板来作为主要的布局模板：

    正如你所见，这个模板接收两个参数：标题（title）和 HTML 内容块（content）。下面我们在另一个模板（views/Application/index.scala.html）中使用它：

    1. @main(title = "Home") {
    3.   <h1>Home page</h1>
    5. }
    1. @(title: String)(sidebar: Html)(content: Html)
    2. <!DOCTYPE html>
    3. <html>
    4.   <head>
    5.     <title>@title</title>
    6.   </head>
    7.   <body>
    8.     <section class="sidebar">@sidebar</section>
    9.     <section class="content">@content</section>
    10.   </body>
    11. </html>

    在我们的 index 模板中使用：

    或者，我们可以单独声明侧边栏：

    1. @sidebar = {
    2.   <h1>Sidebar</h1>
    3. }
    5. @main("Home")(sidebar) {
    6.   <h1>Home page</h1>
    8. }

    下面我们来写一个简单的标签 ，用于显示 HTML 通知：

    2. @level match {
    4.   case "success" => {
    5.     <p class="success">
    6.       @body("green")
    7.     </p>
    8.   }
    10.   case "warning" => {
    11.     <p class="warning">
    12.       @body("orange")
    13.     </p>
    14.   }
    16.   case "error" => {
    17.     <p class="error">
    18.       @body("red")
    19.     </p>
    20.   }
    22. }

    同样没有任何特别之处，你可以调用任意其它模板（事实上可以调用任意地方的任意函数）：

    1. <h1>Home</h1>
    3. <div id="side">
    4.   @common.sideBar()
    5. </div>

    想在 Scala 模板中定义 moreScripts 和 moreStyles 等价物（像在 Play! 1.x 那样），你只需像下面那样在主模板中定义一个变量：

    2. <!DOCTYPE html>
    4. <html>
    5.     <head>
    6.         <title>@title</title>
    7.         <link rel="stylesheet" media="screen" href="@routes.Assets.at("stylesheets/main.css")">
    8.         <link rel="shortcut icon" type="image/png" href="@routes.Assets.at("images/favicon.png")">
    9.         <script src="@routes.Assets.at("javascripts/jquery-1.7.1.min.js")" type="text/javascript"></script>
    10.         @scripts
    11.     </head>
    12.     <body>
    13.         <div class="navbar navbar-fixed-top">
    14.             <div class="navbar-inner">
    15.                 <div class="container">
    16.                     <a class="brand" href="#">Movies</a>
    17.                 </div>
    18.             </div>
    19.         </div>
    20.         <div class="container">
    21.             @content
    22.         </div>
    23.     </body>
    24. </html>

    对于一个需要额外脚本的扩展模板，用法如下：

    1. @main("Title"){
    3.    Html content here ...