FlickrShow

app.js

// this sets the background color of the master UIView (when there are no windows/tab groups on it)
Titanium.UI.setBackgroundColor('#000');
Titanium.UI.iPhone.statusBarStyle = Titanium.UI.iPhone.StatusBar.OPAQUE_BLACK;

// create tab group
var tabGroup = Titanium.UI.createTabGroup();

//
// create base UI tab and root window
//
var win1 = Titanium.UI.createWindow({  
    title:'FlickrShow',
    barColor:'#000',
    backgroundColor:'#000',
    url: 'win1.js'
});
var tab1 = Titanium.UI.createTab({  
    icon:'KS_nav_views.png',
    title:'FlickrShow',
    window:win1
});

//
//  add tabs
//
tabGroup.addTab(tab1);
win1.tabBarHidden = true;

// open tab group
tabGroup.open();

livecoding_app.js

// this sets the background color of the master UIView (when there are no windows/tab groups on it)
Titanium.UI.setBackgroundColor('#000');

// create tab group
var tabGroup = Titanium.UI.createTabGroup();

//
// create base UI tab and root window
//
var win1 = Titanium.UI.createWindow({
	title:'Tab 1',
	backgroundColor:'#fff'
});
var tab1 = Titanium.UI.createTab({
	icon:'KS_nav_views.png',
	title:'Tab 1',
	window:win1
});
// Flickrの画像URLを生成する
var buildFlickrPhotoUrl = function(photo, thumbnail) {
	var imageBaseUrl = "http://farm" + photo.farm + ".static.flickr.com/" + photo.server + "/" + photo.id + "_" + photo.secret;
	if(thumbnail) {
		return imageBaseUrl + "_s.jpg";
	} else {
		return imageBaseUrl + ".jpg";
	}
}
win1.layout = 'horizontal';

Titanium.Yahoo.yql('select * from flickr.photos.search where text="Cat" limit 10', function(e) {
	for(var i = 0; i < e.data.photo.length; i++) {
		(function() {
			var photo = e.data.photo[i];
			var tburl = buildFlickrPhotoUrl(photo, true);
			var imgView = Titanium.UI.createImageView({
				url: tburl,
				width: 72,
				height: 72,
				top: 4,
				left:4,

			});
			imgView.addEventListener('click', function(e) {
				Titanium.Platform.openURL(buildFlickrPhotoUrl(photo, false));
			});
			win1.add(imgView);

		})();
	}
});
//
//  add tabs
//
tabGroup.addTab(tab1);

// open tab group
tabGroup.open();

win1.js

// ベースUIを作成
var win = Titanium.UI.currentWindow;
var sv  = Titanium.UI.createScrollView({
	contentWidth: Titanium.Platform.displayCaps.platformWidth,
	contentHeight: 1000
});
sv.layout = "horizontal";
win.add(sv);
// Flickrの画像URLを生成する
var buildFlickrPhotoUrl = function(photo, thumbnail) {
	var imageBaseUrl = "http://farm" + photo.farm + ".static.flickr.com/" + photo.server + "/" + photo.id + "_" + photo.secret;
	if(thumbnail) {
		return imageBaseUrl + "_s.jpg";
	} else {
		return imageBaseUrl + ".jpg";
	}
}
// サムネイルとなるImageViewを作成する
var buildImageView = function(photo) {
	var imageView = Titanium.UI.createImageView({
		url: buildFlickrPhotoUrl(photo, true),
		height: 72,
		width: 72,
		borderColor: '#fff',
		borderWidth: 2,
		borderRadius:8,
		left: 6,
		top:6
	});
	imageView.addEventListener('click', function() {
		var newWindow = Titanium.UI.createWindow({
			barColor: '#000',
			title: photo.title
		});
		newWindow.add(Titanium.UI.createImageView({
			url: buildFlickrPhotoUrl(photo, false)
		}));
		Titanium.UI.currentTab.open(newWindow);
	});
	return imageView;
};
// YQLを用いてflickrの検索結果取得を10件ずつ行う。
var searchPhotos = function(keyword, page, maxPage) {
	var startNum = (page - 1) * 10 + 1;
	Titanium.Yahoo.yql('select * from flickr.photos.search(' + startNum + ', 10) where text="' + keyword + '"' , function(e) {
		// e.dataにresultの中身が入るので、その配下のphoto配列を走査する
		for (var p = 0; p < e.data.photo.length; p++) {
			(function() {
				var photo = e.data.photo[p];
				sv.add(buildImageView(photo));
			})();
		}
		// 引き続き読み込み
		if(page < maxPage) {
			searchPhotos(keyword, page + 1, maxPage);
		}
	});
};
searchPhotos('Cat', 1, 5);