使用Appcloud和Jquery Mobile

我正在製作一個Appcloud的Android應用程序。我的問題是，我有我的「頁」設置，所以它只是一個圖片鏈接（HTML），將您發送到一個新的頁面（HTML文件）我知道有一個更好的方法來做到這一點。我問了一個人，他們說使用Jquery Mobile在頁面之間切換。 1.如何使用AppCloud設置Jquery Mobile？ 2.用Jquery Mobile做頁面和轉換的最佳方式是什麼？謝謝！使用Appcloud和Jquery Mobile

來源

2012-12-21 user1834524

在本回復中，我將假設您對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你最有可能使用的是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雲視圖，如下所示：

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

所以它就在那裏。使用標準App Cloud和jQM進行頁面轉換。回顧一下，App Cloud中內置的頁面轉換，但是如果使用jQM，則使用它們的轉換。

來源

2012-12-26 14:57:50 mboles57

使用Appcloud和Jquery Mobile

回答

相關問題