Titanium视频教程:实现页面跳转

移动开发
今天我们将学习在titanium中实现页面之间的跳转,但这并不是唯一的实现方法,朋友们可以灵活应变。

下面为视频内容:

创建工程时不选任何模板,直接点击“finish”。在自动生成的代码里,titanium在app.js中已经为我们创建了一个***容器为tabGroup,两个tab,其下各自有一个window,每个window也都有一个label。详细请看我做的思维图。而我们今天要实现:在win1对象中使用外部链接的方式,链接到一个外部window,实际效果与默认的win2一样,就像html中使用外部的javascript文件一样,把所有代码都写在一个文件里显然不会是我们以后做项目的方式。在外部window中点击一个按钮触发页面跳转事件,达到我们今天要的效果。

一、在app.js修改win1属性

1url:'win1.js'

二、创建win1.js文件

varwin=Titanium.UI.currentWindow;

varbutton1=Titanium.UI.createButton({

title:'按钮',

borderRadius:2,

textAlign:1,

top:100,

width:50,

height:50,

borderColor:'#cccccc',

backgroundColor:'#eeeeee'

});

win.add(button1);

button1.addEventListener('click',function(e){

//alert('点击事件触发')

varnewWin=Titanium.UI.createWindow({

title:'新窗口',

url:'newWin.js'

});

newWin.myvar='这是一个变量文本';

Titanium.UI.currentTab.open(newWin,{animation:true});

});

三、创建newWin.js文件

varwin=Titanium.UI.currentWindow;

varmyvar=win.myvar;

varlabel1=Titanium.UI.createLabel({

color:'red',

text:myvar,

font:{fontSize:20,fontFamily:'HelveticaNeue'},

textAlign:'center',

width:'auto'

});

win.add(label1);

OK!完成

该图片为适合页面被自动缩小.查看大图请点击.

责任编辑:佚名 来源: 移动web开发社区
相关推荐

2012-04-20 13:59:41

Titanium视频window

2012-04-19 16:02:19

Titanium StTitaniumUI Fundamen

2012-04-19 16:55:48

Titanium视频jQuery Mobi

2012-04-19 16:33:03

Titanium视频更改默认图片

2009-03-22 18:16:04

CCNA视频教程

2009-04-10 18:16:19

CCNP视频

2013-06-18 02:39:29

CocoStudio工Cocos2d-x

2011-06-14 16:13:48

Dalvik系统架构Android

2011-06-14 15:49:45

Android视频教程

2011-12-30 15:21:38

PhoneGap视频

2011-06-14 16:33:21

Android视频教程

2009-12-24 17:57:53

WPF页面跳转

2009-07-02 09:25:41

JSP实现页面跳转

2009-03-23 18:03:26

CCNA视频教程

2011-06-14 14:54:02

Android视频教程

2009-12-16 17:24:26

Ruby on Rai

2010-08-05 09:39:17

Flex页面跳转

2009-07-03 17:24:31

Servlet页面跳转

2009-12-11 13:25:01

PHP页面跳转

2009-06-04 08:53:57

struts2视频教程
点赞
收藏

51CTO技术栈公众号