titanium もくもく会 #4
TRANSCRIPT
![Page 1: Titanium もくもく会 #4](https://reader034.vdocuments.mx/reader034/viewer/2022042516/5590bc4a1a28abca308b471f/html5/thumbnails/1.jpg)
♥Titanium もくもく会 #4
12年12月18日火曜日
![Page 2: Titanium もくもく会 #4](https://reader034.vdocuments.mx/reader034/viewer/2022042516/5590bc4a1a28abca308b471f/html5/thumbnails/2.jpg)
自己紹介• いそべこーすけ(@k0sukey)
• 浜松で働いています
• Ti 歴はもうちょっとで2年
12年12月18日火曜日
![Page 3: Titanium もくもく会 #4](https://reader034.vdocuments.mx/reader034/viewer/2022042516/5590bc4a1a28abca308b471f/html5/thumbnails/3.jpg)
初めに
ぼく自身は CoffeeScript を書けませんので、そちらは CoffeeScript ガチな方にお任せします
12年12月18日火曜日
![Page 4: Titanium もくもく会 #4](https://reader034.vdocuments.mx/reader034/viewer/2022042516/5590bc4a1a28abca308b471f/html5/thumbnails/4.jpg)
Alloy とは• Appcelerator 公式の MVC Framework です
• 詳しくは @ryugoo_ さんのブログが非常に参考になります→ http://imthinker.net/2012/10/alloy-trial/
12年12月18日火曜日
![Page 5: Titanium もくもく会 #4](https://reader034.vdocuments.mx/reader034/viewer/2022042516/5590bc4a1a28abca308b471f/html5/thumbnails/5.jpg)
なぜ Alloy で
CoffeeScript?
12年12月18日火曜日
![Page 6: Titanium もくもく会 #4](https://reader034.vdocuments.mx/reader034/viewer/2022042516/5590bc4a1a28abca308b471f/html5/thumbnails/6.jpg)
なぜ Alloy で CoffeeScript?• まだまだ Alloy 人口が少ない。寂しい
• ST2 用の MakeAlloy を作ったのに。寂しい
• (@ryugoo_ さんアルファヒトバシラーを除く)
CoffeeScript 勢が来てくれない。寂しい
• とにかく寂しい
12年12月18日火曜日
![Page 7: Titanium もくもく会 #4](https://reader034.vdocuments.mx/reader034/viewer/2022042516/5590bc4a1a28abca308b471f/html5/thumbnails/7.jpg)
CoffeeScript で Alloy アプリが書ければ良いんじゃね?
Alloy がもっと便利で安定すれば良いんじゃね?
12年12月18日火曜日
![Page 8: Titanium もくもく会 #4](https://reader034.vdocuments.mx/reader034/viewer/2022042516/5590bc4a1a28abca308b471f/html5/thumbnails/8.jpg)
書けるようにしました!• alloy.jmk を使って Alloy 製アプリがコンパイルされる際に、CoffeeScript から
JavaScript へコンパイルします
• CoffeeScript 用のフォルダを作る必要もないですよ
• Guard とか入れる必要もないですよ
12年12月18日火曜日
![Page 9: Titanium もくもく会 #4](https://reader034.vdocuments.mx/reader034/viewer/2022042516/5590bc4a1a28abca308b471f/html5/thumbnails/9.jpg)
alloy.jmk とは• Alloy 製アプリがコンパイルされる前後にフックして、別の処理を割りこませることができます
• $ alloy generate jmk で ProjectDir/app/
alloy.jmk が作られます
• node.js な JavaScript です
12年12月18日火曜日
![Page 10: Titanium もくもく会 #4](https://reader034.vdocuments.mx/reader034/viewer/2022042516/5590bc4a1a28abca308b471f/html5/thumbnails/10.jpg)
alloy.jmk とはtask("pre:compile", function(event,logger) { // コンパイル前に割り込ませる処理});
task("post:compile",function(event,logger){ // コンパイル後に割り込ませる処理});
12年12月18日火曜日
![Page 11: Titanium もくもく会 #4](https://reader034.vdocuments.mx/reader034/viewer/2022042516/5590bc4a1a28abca308b471f/html5/thumbnails/11.jpg)
Alloy with CoffeeScript1. pre:compile で ProjectDir/app 内の .coffee
ファイルを .js へコンパイル
2. Alloy のコンパイル
3. post:compile で .coffee から .js へコンパイル されたファイルを削除
※ .js を問答無用で削除しているわけでは ないので、もちろん混在OK
12年12月18日火曜日
![Page 12: Titanium もくもく会 #4](https://reader034.vdocuments.mx/reader034/viewer/2022042516/5590bc4a1a28abca308b471f/html5/thumbnails/12.jpg)
Alloy with CoffeeScript
• https://gist.github.com/4095824 に予め作ってある alloy.jmk があります
• ついでに TypeScript 用の alloy.jmk も作っておきました
12年12月18日火曜日
![Page 13: Titanium もくもく会 #4](https://reader034.vdocuments.mx/reader034/viewer/2022042516/5590bc4a1a28abca308b471f/html5/thumbnails/13.jpg)
ひとつ注意点があります
12年12月18日火曜日
![Page 14: Titanium もくもく会 #4](https://reader034.vdocuments.mx/reader034/viewer/2022042516/5590bc4a1a28abca308b471f/html5/thumbnails/14.jpg)
CoffeeScript で Alloy アプリを書く時の注意点
index.xml<Label id="label" onClick="doClick">Hello, World</Label>
index.coffeedoClick = (e) -> alert $.label.text return
これ、イベントが発火しません
12年12月18日火曜日
![Page 15: Titanium もくもく会 #4](https://reader034.vdocuments.mx/reader034/viewer/2022042516/5590bc4a1a28abca308b471f/html5/thumbnails/15.jpg)
CoffeeScript で Alloy アプリを書く時の注意点
index.js$.__views.label = A$(Ti.UI.createLabel({ width: Ti.UI.SIZE, height: Ti.UI.SIZE, color: “#000”, text: “Hello, World”, id: “label”}), “Label”, $.__views.index);$.__views.label.on(“click”, doClick);
var doClick;doClick = function(e) { alert($.label.text); return;};
コンパイル後のソースを見てみるとわかりますが、これではイベントが発火しませんよね
12年12月18日火曜日
![Page 16: Titanium もくもく会 #4](https://reader034.vdocuments.mx/reader034/viewer/2022042516/5590bc4a1a28abca308b471f/html5/thumbnails/16.jpg)
CoffeeScript で Alloy アプリを書く時の注意点
Alloy でコンパイルされると関数宣言であればどこに書いても問答無用でソース先頭部へ移動されますが、関数式は移動されないので「`」で括って JavaScirpt を書きますindex.coffee`function doClick(e) { alert($.label.text);}`
12年12月18日火曜日
![Page 17: Titanium もくもく会 #4](https://reader034.vdocuments.mx/reader034/viewer/2022042516/5590bc4a1a28abca308b471f/html5/thumbnails/17.jpg)
ダサイ...
12年12月18日火曜日
![Page 18: Titanium もくもく会 #4](https://reader034.vdocuments.mx/reader034/viewer/2022042516/5590bc4a1a28abca308b471f/html5/thumbnails/18.jpg)
CoffeeScript で Alloy アプリを書く時の注意点
• 「`」がダサければ、view で onClick を使わなければ良いじゃない
• Alloy 自体がコンパイル時に関数式もソース先頭部へ移動してくれるのを待つ
12年12月18日火曜日
![Page 19: Titanium もくもく会 #4](https://reader034.vdocuments.mx/reader034/viewer/2022042516/5590bc4a1a28abca308b471f/html5/thumbnails/19.jpg)
というわけで、CoffeeScript でAlloy
アプリが書けるようになりましたので、人口が増えたら嬉しいです
12年12月18日火曜日
![Page 20: Titanium もくもく会 #4](https://reader034.vdocuments.mx/reader034/viewer/2022042516/5590bc4a1a28abca308b471f/html5/thumbnails/20.jpg)
ついでに ACS 人口も増えると嬉しいので、本日の Titanium Mobile Advent
Calendar へ ACS ネタを投下しました
12年12月18日火曜日
![Page 21: Titanium もくもく会 #4](https://reader034.vdocuments.mx/reader034/viewer/2022042516/5590bc4a1a28abca308b471f/html5/thumbnails/21.jpg)
ありがとうございました!
12年12月18日火曜日