Question

我正在使用Appcloud制作Android应用程序。我的问题是，我设置了我的“页面”，所以它只是一个图片链接（HTML），将您发送到一个新页面（HTML文件）我知道有更好的方法来做到这一点。我问过某人，他们说使用Jquery Mobile在页面之间进行转换。 1.如何使用AppCloud设置Jquery Mobile。 2.使用Jquery Mobile进行页面和转换的最佳方法是什么。谢谢！

Answer 1

在本回复中，我将假设你对App Cloud有所了解，有点关于jQuery Mobile，还有一些关于JavaScript / jQuery的知识。答案将会有点冗长，但如果没有假设某些知识，它将会更长。

问题1：如何使用App Cloud设置jQuery Mobile。

这非常简单。您需要包含这两种技术的CSS和脚本。我已经将它用于标题并获得了成功。

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="user-scalable=no, width=device-width, initial-scale=1.0" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
<meta name="bc-manifest" content="manifest.json" />
<title>App Cloud</title>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
<script type="text/javascript" src="javascripts/lib/brightcove-app-cloud-1.12.min.js"></script>
<script type="text/javascript" src="javascripts/views/appcloud.js"></script>
<script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
</head>
<body>
…

问题2：使用Jquery Mobile进行页面和转换的最佳方法是什么。

我将以两种方式回答这个问题。第一个，如果你不使用jQuery Mobile（jQM），第二个方法，如果你没有。由于您正在寻找一种进行转换的方法，因此您不必使用jQM，因为App Cloud中内置了页面转换。

在标准App Cloud中，您希望将每个HTML页面创建为App Cloud视图。粗略地说，视图是应用程序的可导航部分，对应于HTML页面。视图可以包含多个逻辑页面。例如，视图可以包含一个页面，该页面显示可通过点击选择的项目列表，然后是另一个显示已点击项目详细信息的页面。在页面之间转换时，App Cloud API forwardPage（）方法内置了转换，默认为SLIDE_LEFT。此方案中的页面使用App Cloud的CSS使用class属性定义页面，如下所示：

<section id="pageone" class="page">`

如果您正在使用带有jQM的App Cloud，那么您很可能正在使用jQM的导航工具。我仍然会使用jQM的App Cloud视图，但jQM中的逻辑页面是使用jQuery的CSS定义的，而不是App Cloud的。与App Cloud一样，jQM将多个逻辑页面放在一个HTML文件中，使用jQuery的标准工具（包括jQM的转换）导航到这些逻辑页面不是问题。

问题是更改为App Cloud视图。通常在jQM中你会使用一个转到一个页面，但在App Cloud下，这将导致一个模态窗口被打开，你将离开你的应用程序，这很可能是你不想要的。相反，在仍然使用锚标记时，删除href，如下所示：

<a rel="external" data-role="button" class="mainNavTargetBC">

我添加了mainNavTargetBC类，然后在JavaScript中你可以在链接上监听点击事件，如下所示：

$("body").on( "tap", ".mainNavTargetBC", topNavClickedBC);

然后，在事件处理程序中，您可以使用navigateToView（）方法转换到新的App Cloud视图，如下所示：

bc.device.navigateToView("brightcove.html");

就是这样。使用标准App Cloud和jQM进行页面转换。回顾一下，App Cloud中内置的页面转换，但是如果使用jQM则使用它们的转换。

使用Appcloud和Jquery Mobile

1 个答案: