议程
1、使用titanium创建javascript程序
2、应对(趁着)不同的平台
3、跨平台技术,在行动
4、推出将tibountyhunter (实验室)
大的javascript程序
1、很多javascript开发者将会在titanium移动开发中开始他们第一个大的javascript程序
2、程序将不会削减它像随机AJAX或网页上的UI
3、需要adhere一些基线的最佳实践:
保护全球范围内
模块化( 00和模块模式的组合)
要努力保持代码干
编写富客户端程序
类似的精神,以单页的Web应用程序
复杂的UI控件
客户端的数据模型
本地存储和集中的远程数据访问
面向组件,事件驱动(稍后)
构建JavaScript代码
ti.include ( )
CommonJS的要求( )
url属性窗口
每一个窗口的文件,不建议
使用演示
在下面的例子中你可以学习到如何在主文件中调用其他文件并执行该文件的内容
首先创建titanium mobile 工程
打开并把app.js里系统自动生成的代码全部删除掉
编写如下代码:
Ti.include('include.js');
创建include.js文件
编写如下代码:
Ti.API.Info("include.js文件已经包含进来了");
运行该程序可以看到在titanium studio中的控制台里已经输出“include.js文件已经包含进来了”!在虚拟机上程序没有任何功能 只停留在启动页面上
D/TiAssetHelper( 348): Fetching "app.js" with Fastdev...
D/TiAssetHelper( 348): Fetching "lib/include.js" with Fastdev...
I/TiAPI ( 348): include.js文件已经包含进来了
I/TiRootActivity( 348): (main) [0,0] checkpoint, on root activity resume. activity = com.test.a4.TestActivity@44f84298
I/ActivityManager( 60): Displayed activity com.test.a4/.TestActivity: 9637 ms (total 9637 ms)
D/dalvikvm( 142): GC_EXPLICIT freed 888 objects / 50184 bytes in 85ms
上面使用的是include方法
下面使用的是require方法 注意两者的区别
在app.js文件中添加以下代码
var logger = require('logger');
logger.info("你好 commonJS");
创建一个logge.js文件
添加以下代码
extorts.info = function(_str){
Ti.API.info(_str);
};
运行程序后在控制台输出了 “你好 commonJS”
D/TiAssetHelper( 377): Fetching "app.js" with Fastdev...
D/TiAssetHelper( 377): Fetching "lib/include.js" with Fastdev...
I/TiAPI ( 377): include.js文件已经包含进来了
D/TiFastDev( 377): (KrollRuntimeThread) [646,3016] sent tokens successfully
D/Module ( 377): Loading module: logger -> Resources/logger.js
D/TiAssetHelper( 377): Fetching "logger.js" with Fastdev...
I/TiAPI ( 377): 你好 commonJS
I/TiRootActivity( 377): (main) [0,0] checkpoint, on root activity resume. activity = com.test.a4.TestActivity@44f84298
I/ActivityManager( 60): Displayed activity com.test.a4/.TestActivity: 6223 ms (total 6223 ms)
你的程序应该要像这样子
1、使用app.js文件启动你的程序
2、创建一个单独的特定的程序命名空间
3、单独的JavaScript文件执行额外的模块和对象
4、app.js创建并打开第一个UI组件
查看demo
删除刚才app.js里的代码
添加以下代码
//创建自定义的命名空间
var Test = {};
//引进UI文件
Ti.include('ui.js');
//使用自定义的命名空间创建窗口
var win = Test.UI.createAppWindow();
//执行打开该窗口
win.open();
创建ui.js文件
添加以下代码:
//以闭包的形式的匿名函数
(function(){
Test.UI = {};
Test.UI.createAppWindow = function(){
return Ti.UI.createWindow({
backgroundColor:'green'
});
};
})();
运行程序可以看到 程序的背景颜色显示为绿色了
跨平台在titanium
1、跨平台不等于一次编写到处运行
2、titanium是一次编写适应任何地方
3、我们将创建一个最好品种的程序
4、非可视代码和多UI代码可以是100%的可移植性
5、接受和拥抱平台的差异
Android:意图,背景服务,硬件菜单按钮
IOS:地图中的路线,预建的动画,自定义字体,可可UI
平台特定的API实现在一个平台特定的命名空间
钛API提供了一个平台的变量,可以使用if语句
平台特定的资源:
代码文件
图像,文字,以及任何其他文件类型
每个平台的样式与JSS (SDK 1.5.0 )
特定于平台的配置( tiapp.xml )
平台名字
我们的平台的名称分支
var isAndroid = false;
if(Titanium.Platform.name=='android'){
isAndroid =true;
menu = Titanium.UI.Android.OptionMenu.createMenu();
}
pincolor = isAndroid ? "orange" : Titanium.Map.ANNOTATION_RED
if(!isAndroid){
atlantaParams.color = Titanium.Map.ANNOTATION_PURPLE;
}else{
atlantaParams.pinImage="map.png";
}