JavaScript iPhone Apps

Posted on | 十二月 10, 2008 | No Comments

按：此文为John Resig的JavaScript iPhone Apps一文的翻译稿。John Resig是个必须要认识的牛人，JQuery框架的主创人员，Mozilla基金会的JavaScript布道者（Evangelist）。这些名头其实也不算什么，更让我倾心折服的是此人的精力，其名下有76个项目，涉及范围非常之广。牛人的影响力自然不一样，所以此文的留言同样很精彩，应该基本囊括了目前使用JavaScript开发iPhone应用涉及到的框架，不可不看。

－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－

我一直在关注iPhone的开发。我想知道如果开发一个可下载的javascript应用/iPhone应用，可以有哪些选择。在做了一些研究之后，我找到一些解决方案，有些简单，有些需要些Objective-C的知识。
在讨论具体的解决方案之前，需要注意的是，如果你要进行正式的iPhone开发的话，还是需要学习下Objective-C. 和正常模式开发的应用相比，所有的这些选项都不能提供全部功能。

JiggyApp
在2007就进入JavaScript的iPhone应用开发市场，使用需要“越狱”。
和大多数典型APIs不同，JiggyApp提供开发应用的完整API。而且代码也可能是相对易用的。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23

Plugins.load( "UIKit" );
 
var window = new UIWindow( UIHardware.fullScreenApplicationContentRect );
window.setHidden( false );
window.orderFront();
window.makeKey();
window.backgroundColor = [ 0.8 , 0 , 0, 1 ];
 
var mainView = new UIScroller();
mainView.contentSize = [ window.bounds[ 2 ] * 2 , window.bounds[ 3 ] * 2 ];
mainView.backgroundColor = [ 0 , 0 , 0 , 0 ];
 
window.setContentView( mainView );
 
var hello = new UITextLabel( [ 20 , 20 , window.bounds[ 2 ] - 40 , 100 ] );
 
hello.text = "Hello World!";
hello.backgroundColor = [ 0 , 0 , 0 , 0.25 ];
hello.setFont( new Font( "Trebuchet MS" , 2 , 46 ) );
hello.color = [ 1 , 1 , 1 , 1 ];
hello.centersHorizontally = true;
 
mainView.addSubview( hello );

上面这段代码来自Jiggy起步.

JSCocoa
JSCocoa架起了JavaScript通往Cocoa开发的桥梁（不是通常的Objective-C开发Cocoa），在OS X和iPhone上都可以使用。它移植了Objective-C风格和方法，但使用JavaScript语法。注意其中的一些区别：

Objective-C/Cocoa:

1

[[NSButton alloc] initWithFrame:NSMakeRect(0, 0, 100, 40)];

JSCocoa:

1

NSButton.instance({ withFrame:NSMakeRect(0, 0, 100, 40) })

MobileSafari上的应用
准确讲并不是真正的iPhone应用。
Apple提供了一系列技巧来帮助改进你的Web应用. 下面是一些要点:

1. 提供一个图标 (当用户保存的时候使用).
2. 提供一个全屏视图 (不显示MobileSafari的工具条).

使用iui的风格和设置后，你的Web应用将更像一个普通的iPhone应用.

PhoneGap

下一步将通过使用底层的API，使你的iPhone Web应用更像本地应用。其中之一是PhoneGap.

PhoneGap是一个应用，提供了一些JavaScript APIs给MobileSafari的页面. 目前包括Geolocation 和 加速感应器.

Geolocation:

1
2
3
4
5
6

getLocation();
 
function gotLocation(lat,lon){
document.body.innerHTML = "latitude: " + lat +
" longitude: " + lon;
}

Accelerometer:

1
2
3
4

function updateAccel(){
document.body.innerHTML = "accel: " + accelX + " " + accelY + " " + accelZ;
setTimeout(updateAccel, 100);
}

相机，声音，震动等接口目前还在开发中。

WebTouch

某天”Dr Nic”写了篇关于他如何用HTML, CSS, and JavaScript创建一个WebKit实例来移植他的一个iPhone应用.
我联系了他，想知道他是否愿意提供一些代码。这就是他在Mocra的同伴 Anthony Mittaz提供的WebTouch.

这是一个zip文件，包括一些示例代码，希望在某些点上可以被扩展。
这是一个很好的入门，帮你进入HTML/CSS/JavaScript/Objective-C/Cocoa的世界. 如果你对Objective-C感兴趣，这同样也是一个很好的起点。

额外奖励
这个你可能用不到，但我认为他很酷。有人将我的Processing.js 移植到iPhone上, 用OpenGL ES写了他自己的Canvas实现.

对于JavaScript开发者来说，还有很多选择。最现实的我认为就是WebTouch. 很显然如果要开发最好的iPhone应用你需要知道Objective-C. 而在JavaScript基础上更进一步是每个JavaScript程序员的目标。

Comments

关于我

程序员. 暂居上海. 目前关注平板和电子商务. 用Google, Mac.

Email/Gtalk: qycpublic [AT] gmail.com

订阅我的博客

搜索

管理

• 登录
• Wordpress
• XHTML