施用Titanium Mobile开发iPhone/Android应用（03）- Twitter客户端之页面调整

使用Titanium Mobile开发iPhone/Android应用（03）- Twitter客户端之页面调整
美化Twitter客户端

上回中，我们坐了一个把自己的Tweeter表示出来的页面，这只仅仅是把Tweet的正文并排放在页面上而已，这回我们要把从Twitter取的情报中的Tweeter时间，用户名，用户头像信息也表示出来。这篇中我们要说或如何将页面美化。

那么我们就尽早进入修改代码，修改前回做好的updateTimeLine函数。首先，在做成的页面功能的基础上，确认各个技能。

还不是特别的好，初步表示出了Twitter的TimeLine。那么页面机能部分我们一点点的说明一下。

Window和View

在Titanium中，把盖住整个页面的对象叫：“window”，可以考虑成Javascript的DOM中的Window，也可以作为iOS SDK的UIWindow考虑。在window上还可以放置多个view，而且在view上还可以在重叠放置view，上回我们说的Ti.UI.TableView和Ti.UI.TableViewRow也都是view的一种。这个view跟iOS SDK中的UIView基本相同。

关于view的布局，跟使用CSS调整HTML布局很相似，也能设定Titanium的view的布局。



这种也是很方便的布局调整方法。

显示图像

使用ImageView来表示Twitter的用户头像部分。ImageView是很方便的一个View，只需要指定url后就能显示出来图像。不是是表示http开始的网络图像，Project内部保存的图像也能显示。下边的代码就是显示Project中图像的例子。



app.js的内容还原到最初的例子代码，画表格的机能移到新作的table_view.js当中。需要主要看的一点是，app.js的createWindow的参数中，url的指定方法。使用这个方法可以在新的window中打开指定的JavaScript文件。

var win1 = Ti.UI.currentWindow;

这段代码是追加到最开始的。分割前的代码中，我们可以看到是把view追加到了全局变量为win1的window中。然后分割后的代码就不在使用这个变量了。在使用createWindow指定的文件的代码中，打开window的父文件中的变量是不能使用的。具体来说就是，在table_view.js中是不能访问app.js中定义的变量的。

在那里，需要改变成，使用currentWindow参数来获取当前window，然后追加view。

其他文件当中的变量不能使用的话，也就是说scope发生了改变。分离每个window当中的变量是很方便的结构。那么从一个window到一个window数据的传递就需要费点儿事了。这个基本上没有什么大的问题，从此以后开发过程中，做成新的window的时候要积极地分割成多个文件。

总结

这回我们说了一下Window和View的关系以及布局的调整方法。而且在后半部分还说了一下开发过程中把文件分割成多个文件的方法。下一回我们将说一下使用OAuth来调用API，朝着做一个像样的Twitter客户端方向编写代码。