使用Titanium创建一个基本的布局

移动开发
本文为使用Titanium创建一个基本的布局。Titanium是一个Web应用程序运行环境,它支持不同的系统平台(Windows、Linux、Mac),并且支持Web应用程序对本地APIs的访问。在基于Titanium平台上,用户可以快速开发和方便的部署应用程序,并且这些应用程序可以使用本地APIs实现许多普通Web应用程序无法完成的功能和特性。

预览效果图:

分析代码:

  1. //创建基本的垂直窗口布局 
  2.  
  3. varwin=Ti.UI.createWindow({ 
  4.  
  5. title:"使用Titanium创建一个基本的布局",//标题 
  6.  
  7. layout:'vertical',//布局类型为垂直 
  8.  
  9. backgroundColor:'#123456'//背景颜色设置 
  10.  
  11. }); 
  12.  
  13. //增加一个文本标签到窗口里 
  14.  
  15. varlabel=Ti.UI.createLabel({ 
  16.  
  17. text:'你好世界',//文字显示的内容 
  18.  
  19. color:'#fff',//文字的颜色 
  20.  
  21. top:10,//文本离顶部的距离 
  22.  
  23. textAlign:'center',//文本对齐方式为居中 
  24.  
  25. font:{ 
  26.  
  27. fontWeight:'blod',//文本宽度 
  28.  
  29. fontSize:18//文本字体大小 
  30.  
  31. }, 
  32.  
  33. height:'auto'//高度设置为自动适应 
  34.  
  35. }); 
  36.  
  37. win.add(label);//上面为初始化这里可以理解为实例化把文本添加到窗口显示 
  38.  
  39. //增加一个输入框到窗口里 
  40.  
  41. vartextfield=Ti.UI.createTextField({ 
  42.  
  43. height:100, 
  44.  
  45. top:10, 
  46.  
  47. width:200, 
  48.  
  49. keyboardType:Ti.UI.KEYBOARD_DEFAULT,//设置键盘类型,该值为常量 
  50.  
  51. returnKeyType:Ti.UI.RETURNKEY_DONE, 
  52.  
  53. borderStyle:Ti.UI.INPUT_BORDERSTYLE_ROUNDED, 
  54.  
  55. hintText:'在此输入内容' 
  56.  
  57. }); 
  58.  
  59. win.add(textfield); 
  60.  
  61. //增加一个按钮到窗口里 
  62.  
  63. varbutton=Ti.UI.createButton({ 
  64.  
  65. title:'确定', 
  66.  
  67. top:10, 
  68.  
  69. height:40, 
  70.  
  71. width:200 
  72.  
  73. }); 
  74.  
  75. //按钮点击事件 
  76.  
  77. button.addEventListener('click',function(){ 
  78.  
  79. Ti.API.info('你已经点击了按钮'); 
  80.  
  81. varmsgTitle="提示框标题"
  82.  
  83. varmsgText=textfield.value; 
  84.  
  85. varalertBox=Ti.UI.createAlertDialog({ 
  86.  
  87. title:msgTitle, 
  88.  
  89. message:msgText, 
  90.  
  91. ok:'确定', 
  92.  
  93. }); 
  94.  
  95. alertBox.show(); 
  96.  
  97. }); 
  98.  
  99. win.add(button); 
  100.  
  101. win.open(); 

 

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

2012-04-19 16:22:12

TitaniumTabGroup

2014-04-09 16:16:56

System Imag镜像

2023-11-03 11:57:04

2012-04-20 11:07:12

Titanium

2009-08-19 04:14:00

线性链表

2012-04-19 12:58:26

TitaniumJSS

2012-05-17 09:09:05

Titanium单元测试

2012-04-19 13:55:19

TitaniumTiMVC

2012-04-18 15:50:45

2012-08-20 10:43:52

Titanium SD

2019-09-23 15:06:29

JavaScipio ERP在线商店

2024-07-10 08:51:29

2014-06-26 09:36:02

Angular评论应用

2023-06-01 08:24:08

OpenAIChatGPTPython

2013-05-02 10:40:24

xcode

2016-03-08 09:52:22

xcode插件开发

2024-06-06 08:46:26

弹性布局元素浏览器

2012-05-18 11:29:55

Titaniumpros

2012-04-20 13:59:41

Titanium视频window

2024-04-01 08:18:52

CSSHTMLWeb
点赞
收藏

51CTO技术栈公众号