titanium.cookbook0101创建并理解window与view

window相当于一块屏幕,view相当于一个div层。window拥有全屏和模态化属性,view则没有这2个属性。

Titanium与Ti是一样效果的命名空间。

最终效果:

实现思路:

1、创建一个window作为我们的APP的屏幕,之后我们将添加其他元素来丰富我们的界面

创建window的语法:

var 变量名 = Ti.UI.createWindow({

  属性: 值

})

2、创建一个view作为UI的一个显示层,你可以创建多个view,比如顶部的导航栏作为一个view,中部区域作为一个view,底部控制条作为一个view等等。

创建view的语法:

var 变量名 =  Ti.UI.createView({

  属性:值

})

3、单独定义一个变量,作为logo的左边距

var 变量 = (view.宽度 - 253) / 2;

可以看出,我们获取到view的宽度再作计算的。

4、创建一个imageview,用来显示我们的logo,在2中我们说到,一个window上可以同时具有多个view,用来显示不同的元素。

创建imageView的语法:

var 变量名 = Ti.UI.createImageView({

  属性:值

});

5、添加imageview到view即添加logo到view

6、添加view到window

7、在程序中打开window

源代码:

app.js

//创建window对象
//
var 变量 = Ti.UI.createWindow({window属性})
var win1 = Ti.UI.createWindow({
320,
height:480,
top:0,
left:0,
backgroundImage:'background.png'
});
//创建view
var view = Ti.UI.createView({
300,
height:win1.height - 40,
left:10,
top:10,
backgroundColor:'#fff',
borderRadius:5
});
//
var _logoMarginLeft = (view.width - 253) / 2 ;
//
var logo = Ti.UI.createImageView({
image:'logo.png',
253,
height:96,
left:_logoMarginLeft,
top:0
});
//
view.add(logo);
//
win1.add(view);
//
win1.open({fullscreen:true});



原文地址:https://www.cnblogs.com/xiaozhanga4/p/2434453.html