titanium 学习笔记

Titanium学习笔记之Titanium入门（一）

 

    http://docs.appcelerator.com/titanium/latest/#!/guide/Quick_Start Titanium的官方文档，更多的内容可以参看官方文档的内容，在此写博客只是写一些入门级的技术。希望大家能帮助大家尽早入门Titanium开发。

   Titanium开发简介，目前主要的移动端操作系统是Android和Ios，企业在开发App的时候不得不同时雇佣Android开发人员和ios开发人员。同样的逻辑实现两遍，增加了开发和维护的成本。所以跨平台开发的技术自然就出现了。为了提高开发效率一般采用Alloy框架，使得开发和美工能分开同步进行，titanium在视图层采用xml文件写，逻辑层采用JavaScript。

   下面来一个简单的例子，程序员简单的例子永远是一个Hello word。在此也不例外。

安装好titanium后就可以新建项目了，File——〉new——〉mobile app project——〉

 

 

 

 

选择next

 

选择next

输入项目名称，输入App Id 点击Finish即可完成项目创建。

创建好的项目文件目录如下：

 

 

 

所有的代码都写在app目录下。App启动位置为index.js，在titanium中所有的界面都不需要配置，只需要一个View对应一个controller即可，所以默认的启动视图即对应view目录下的index.xml文件

assets文件主要用于存放app的资源文件，如App需要的声音文件，图片文件，视频文件等。

controller文件主要用于存放逻辑层的代码，所有的控制逻辑均写在controller文件下。

model文件夹主要用于存放model数据的，建议新手暂时不要去深入研究如何使用model。

style文件夹主要存放view对应的样式文件，后缀为tss，其代码风格和CSS相似。

view即为视图层文件，我们所看到的视图都是在view文件中写出来的。

config.json项目的配置文件，如项目中需要用到的域名，网络超时等一些常量的配置。

 

该项目中的view/index.js文件代码如下：

 

<Alloy>
	<Window class="container">
		<Label id="label" onClick="doClick">Hello, World</Label>
	</Window>
</Alloy>

 

所有的view文件都是<Alloy>作为顶级标签，假如该view是一个有窗口的view则Alloy的下一级标签为Window，由上代码可以看出该Window中有一个文本框，Id属性方便在js中引用，例如在js中要改变该Label的值只需要  $.label.text="Hello Titanium",

即可把文本的值改为Hello Titanium了，上面的代码可以看出当点击Hello，World后将会触发js中的doClick事件。

 

function doClick(e) {
    alert($.label.text);
}

$.index.open();

app首先执行$.index.open()，将id为index的window打开，在titanium中若没有定义window的id值则默认为index。

当点击view中的hello world后就触发doClick函数，此时会弹出一个对话框，并且输出label的值，

运行后的界面：

 

当点击hello world后：

 

到此一个简单的titanium入门程序即学习完了。