Fatal编程技术网

Model view controller 具有多个视图的一个项目

model-view-controller playframework-2.0

Model view controller 具有多个视图的一个项目,model-view-controller,playframework-2.0,Model View Controller,Playframework 2.0,在我的play项目中，我将所有javascript和css链接到main.scala.html中。我还希望为我的应用程序提供一个使用JQuery mobile之类的东西的移动接口。一个项目可以有多个视图吗？我可以创建一个与main类似的包装器并将其用于移动css/js吗 你想做什么就做什么，玩吧！视图非常灵活 如果我不能完全理解你想要什么，我可以给你一些建议 从视图加载脚本 您可以将视图的特定脚本加载到main.scala.html中 main.scala.html @(title: Strin

在我的play项目中，我将所有javascript和css链接到main.scala.html中。我还希望为我的应用程序提供一个使用JQuery mobile之类的东西的移动接口。一个项目可以有多个视图吗？我可以创建一个与main类似的包装器并将其用于移动css/js吗

你想做什么就做什么，玩吧！视图非常灵活

如果我不能完全理解你想要什么，我可以给你一些建议

从视图加载脚本

您可以将视图的特定脚本加载到
main.scala.html
中

main.scala.html

@(title: String, scripts: Html = Html(""))(content: Html)

<!DOCTYPE html>

<html>
    <head>
        <link rel="stylesheet" media="screen" href='@routes.Assets.at("stylesheets/main.css")'>
        @* By default, nothing but you can override from any view *@
        @scripts
    </head>
    <body>
        @content
    </body>
</html>

@(title: String)

@* Declare the script(s) you need for that view *@
@scripts = {
    <script src='@routes.Assets.at("javascripts/my-specific-script.js")' type="text/javascript"></script>
}

@main(title, scripts) {
    @* Some content *@
}

@if(someParameter.isMobileDevice()) {
    <script src='@routes.Assets.at("javascripts/my-mobile-script.js")' type="text/javascript"></script>
}
如果视图中不需要额外的脚本，只需不传递
scripts
参数（它在
main.scala.html
中有一个默认的空值）

从
main.scala.html

通过传递参数（基于设备检测）

main.scala.html

@(title: String, scripts: Html = Html(""))(content: Html)

<!DOCTYPE html>

<html>
    <head>
        <link rel="stylesheet" media="screen" href='@routes.Assets.at("stylesheets/main.css")'>
        @* By default, nothing but you can override from any view *@
        @scripts
    </head>
    <body>
        @content
    </body>
</html>

@(title: String)

@* Declare the script(s) you need for that view *@
@scripts = {
    <script src='@routes.Assets.at("javascripts/my-specific-script.js")' type="text/javascript"></script>
}

@main(title, scripts) {
    @* Some content *@
}

@if(someParameter.isMobileDevice()) {
    <script src='@routes.Assets.at("javascripts/my-mobile-script.js")' type="text/javascript"></script>
}

@if（someParameter.isMobileDevice（））{
}
那么响应性设计呢？

您的样式可以根据用于查看页面的设备进行调整。您可能不需要加载额外的内容。

最简单的方法是。。。只需检查：）无论如何，是的，您可以根据需要拥有任意多个
布局，没有限制。（根据，
layout
是一个视图，它是其他视图的某种包装器，例如默认的
main.scala.html
文件）

为了保持顺序，我总是将
main.scala.html
布局移动到新创建的包中：
app.views.\u layouts
。我还创造了其他的。。。因此，在您的视图中，您可以轻松使用：


@_layouts.main(params){
   ...
}


或

p.S.：正如Alban所写，也可以使用一种布局并向其推送其他脚本。通过这两种技术的结合，您可能可以做您需要的任何事情。
My2c
我对这种用例的最佳猜测是使用正确的工具。
实际上，您真正想要的是应用程序对其使用方式做出响应。
也就是说，你想要的是回应。所以炒作不是吗；-）

此外，在服务器端，窗口缩小的情况将很难处理。。。简单地说，因为它们纯粹是客户端操作：-/。因此，在1200px（真实）屏幕上，视口的宽度为320px

但是，您确实可以使用传递到布局的特定参数来调整它们的行为，但这需要您使用浏览器提供的信息在服务器端管理案例



那么，为什么不让浏览器为你做一切呢？
希望稳定的库能帮上大忙，例如：
这将允许您定义加载与谓词相关的js文件（如
320
）

或者，为了减少设备之间的重复代码或if-then-else，您可以使用yesnope，这将使您有机会声明一些“响应”行为（没有JS-KoOl-huh？），例如：


<a 
   href=hi-fi.png
   data-min-width-320='<img src=lo-fi.png alt="image @ 320+">' 
   data-min-width-961='<img src=hi-fi.png alt="image @ 961+">'
> 
   text-only link @ <320px and no-js
</a>



从请求头中提取信息的控制器（至少）