13 01 2013 javascript Ti Tweet
カメラで写真を取ってデータベースに格納するアプリを作ってみた。スクロールビューで画像が入れ替わるのがよくわからんがひと通りできた。
controllers/index.coffee
カメラ用のボタンを押したら内蔵カメラを起動して、写真をファイルに保存したら、パスをデータベースに保存する。
pts = Alloy.Collections.photo cameraButton = Ti.UI.createButton systemButton: Ti.UI.iPhone.SystemButton.CAMERA $.win1.rightNavButton = cameraButton cameraButton.addEventListener 'click', -> Ti.Media.showCamera success: (event) -> now = (new Date).getTime() file = Ti.Filesystem.getFile(Ti.Filesystem.applicationDataDirectory, String.format("%d-%d", now, Math.floor(Math.random() * 1000))) file.write(event.media) photo = Alloy.createModel('photo', { path: file.nativePath }) photo.save() Alloy.Collections.photo.add photo return mediaTypes:[Ti.Media.MEDIA_TYPE_PHOTO] pts.fetch() $.index.open()
models/photo.js
モデルの定義
exports.definition = { config: { "columns": { "path": "string" }, "adapter": { "type": "sql", "collection_name": "photo" } } }
views/index.xml
コレクションの定義をしておく
<Alloy> <Collection src="photo"/> <TabGroup> <Tab id="tab1" title="写真" icon="dark_book.png"> <Window id="win1" title="写真"> <ScrollView id="scroll" dataCollection="photo"> <Require src="photo"/> </ScrollView> </Window> </Tab> <Tab id="tab2"> <Window id="win2"> </Window> </Tab> </TabGroup> </Alloy>
views/photo.xml
個々の画像
<Alloy> <ImageView image="{path}" width="100%"> </ImageView> </Alloy>