如何使用Sencha Touch 2在Android上实现PhoneGap应用

Question

如何使用Sencha Touch 2在Android上实现PhoneGap应用

androidcordovasencha-touchextjssencha-touch-2

3

我有一个Sencha Touch 2的示例应用程序，可以在我的本地主机浏览器中（http://localhost/sencha/examples/navigationview/index.html）正常工作。

现在我需要使用PhoneGap 1.5.0将这个Sencha应用程序集成到Android上。

我从PhoneGap下载了PhoneGap库。

从PhoneGap网站下载的phonegap-phonegap-1.5.0-0-gde1960d.zip文件中，我获得了cordova-1.5.0.js和cordova-1.5.0.jar文件，而不是PhoneGap。
我查阅了PhoneGap网站，发现cordova-1.5.0和PhoneGap是一样的。

我遵循了入门指南，但他们没有说明如何集成Sencha Touch2 MVC文件架构。入门指南中的基本示例对我来说可以正常工作。

我的问题是，我无法集成我的Sencha2 MVC文件架构。我已经谷歌搜索过，但没有成功。我在这里做错了什么吗？你能建议我正确的方式来做吗？
提前致谢。

这是我的index.html文件。

<!DOCTYPE HTML>
<html manifest="" lang="en-US">
<head>
    <meta charset="UTF-8">
    <title>Ajax</title>
     <script type="text/javascript" charset="utf-8" src="cordova-1.5.0.js"></script>
    <script id="microloader" type="text/javascript" src="development.js"></script>   
</head>
<body>
</body>
</html>

在 app.js 文件中，我遇到了错误：

   //<debug>
    Ext.Loader.setPath({ // line no. 2
        'Ext': 'src'
    });
    //</debug>

- atluriajith

请问您能否解释一下“集成我的sencha2 MVC文件架构”是什么意思？您应该将任何Web代码放入Android项目的assets/www文件夹中。您提到在入门指南中基本示例正在运行，那么在尝试运行您的项目时遇到了哪些错误？ - Jay

是的，jayraj。感谢您的回复。实际上，如果您比较senchatouch1.1（http://screencast.com/t/chDMwE7d13K）和senchatouch2.0（http://screencast.com/t/y9ykJLxi）的文件结构，它们完全不同。在senchatouch1.1中，整个JavaScript代码都存在于index.html中（您可以直接将此index.html与支持的文件添加到android / assets / www /中，它将正常工作）。在senchatouch2.0中，文件夹结构不同，在app文件夹中可以找到model、view、controller和store文件夹。我无法理解如何将这些文件添加到android-phonegap资产/ www文件夹中。 - atluriajith

4个回答

0

对于生产构建，您需要使用命令行工具，该工具会为您提供一个包含所有MVC组件和额外API或库所需的EXT和Sencha文件的单个js文件，而不再多余。

达到这个阶段是相当大的成就，然后您应该准备好将index.html文件制作成APK。

- landed

0

看看phonegap-build。在论坛上看看我关于phonegap的答案。你可以立即在iPhone、Android、黑莓和其他所有设备上运行你的Sencha应用程序！

你甚至不需要使用phonegap API调用！

你只需要将app.html复制到index.html中。

如果你确实想要使用phoneGap API，那么就直接使用它。不需要添加任何文件或其他东西。在index.html中，你只需要添加这一行即可。

<script...  phonegap="cordova-1.0.7" />

或者任何有效的版本。

（此信息截至2012年6月11日属实 - 我想当 beta 期结束时它将收费）

- pashute

0

我建议您使用MDS鼓掌PhoneGap http://wiki.phonegap.com/w/page/34483744/PhoneGap%20Eclipse%20PlugIn%20for%20Android

来开发带有phone gap的sencha 2应用程序。这将为您提供一种与phonegap+sencha一起工作的方式，然后您可以在index.html中添加路径到您的sencha js和css文件，并手动添加app文件夹。索引将如下所示

  <!DOCTYPE HTML>
   <html>
   <head>
   <meta name="viewport" content="width=320; user-scalable=no" />
   <meta http-equiv="Content-type" content="text/html; charset=utf-8">
   <title>PhoneGap Demo with Sencha Touch</title>
   <link rel="stylesheet" href="sencha/resources/css/sencha-touch.css" type="text/css">
   <script type="text/javascript" src="sencha/sencha-touch-all.js"></script>
  <script type="text/javascript" charset="utf-8" src="phonegap-1.4.1.js"></script>
  <script type="text/javascript" charset="utf-8" src="main.js"></script>
  <script type="text/javascript" charset="utf-8" src="phonegapdemo-w-sencha.js">        </script>
  </head>

- Saurabh Verma

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Jay · Accepted Answer

Ext.Loader是使您的JS文件能够存放在app文件夹内不同文件夹中的工具。如果您已按照教程中所述配置Ext.Loader，那么Sencha Touch可以从适当的目录动态加载您的文件。

然后将index.html放入app文件夹，将其他所有内容放入Phonegap的www文件夹中即可。它与网页完全相同。要完全明确：

www
 |
 |-index.html
 |-app/
 |-css/
 |-whatever else