Archive

For the 勉強会 category

Qiita 2-day Hackathon で「Hubstar」を作るまで

1 Comment

2月2日から3日にかけて開催されたQiita 2-day Hackathonに参加してきました。

その時その時の様子はQiita公式のブログにまとめられています。
スペシャルゲストも登場して盛り上がったQiita 2-day Hackathon総まとめ!

自分は1人で行く勇気がなかったので同じ大学の先輩を誘って2人で参加しましたw
自分達以外にも何人か大学生がいたようです。

今後ハッカソンに参加した際に活かせるよう、自分たちが何をどのように作っていったのかまとめてみました。

Continue reading this entry »

ActionScriptCompiler2.0について発表してきたよ

1 Comment

FxUG 第172回 勉強会@名古屋でActionScriptCompiler2.0について発表してきました。

僕のスライドはこっから見れるよ
http://ton1517.github.com/FxUGNagoya172-slide/

今回の勉強会はいろいろな事情で日程がズレにズレまくって参加者がまさかの6人!でしたw
そのうち4人が発表者w
そのおかげで発表中にバンバンツッコミ入れたり質問したりとかなり濃い勉強会ができました。
大人数でやるとただ発表を眺めてるだけになっちゃうので、少人数の勉強会は本当に勉強会!って感じでよかったです。

勉強会とは関係ないですが、今回のスライドはmarkdownで書いて、markdown2impressというツールを使ってスライドに変換しました。
変換してできたhtmlをgithub pagesの機能を使ってgithub上で公開しています。
こうすればmarkdownで資料を作れて、変換してpushするだけでスライドを更新できて楽でした。

ソースは自分のgithuhに公開しています。
ton1517/FxUGNagoya172-slide

FxUG名古屋勉強会でスピーカーをさせて頂きました

4 Comments

タイトルのとおりです、はいw

発表したスライドをSlideShareにアップしたので置いときます
発表時のスライドを一部加筆、修正してます

前にブログに載せたもの(AIR2.7でAIR for iOSを試してみた)とほとんど同じですが、
勉強会では実際にリモートデバッグのデモなどを行いました

アプリケーション記述ファイルのテンプレートも説明付きで用意したのでよかったら使ってください
AIR2.7でiPhoneアプリを作るときのテンプレートです
iPhone-app.xml

他の方の発表もすごく参考になりました

勉強会は勉強になるというより、いろんな方に会えたりすごい発表を聞いたりして、俺もやらなきゃ!っていう気持ちにさせてもらえるので助かってますw
今回は初めてスピーカーをさせて頂いたのですが、発表するために色々調べたりして、発表の準備自体がかなり勉強になりました
また機会があればスピーカーをさせてもらえればと思います

めっちゃ緊張したw

名古屋ひよこの会第1回勉強会 に行ってきた

No Comments

名古屋ひよこの会に行ってきました。

前回のミーティングの時の様子はこっち 名古屋ひよこの会に行ってきた

ほかの人のレポートはこっち にゃあプロジェクト – ウェブログ – 名古屋ひよこの会 (第1回勉強会) レポート

第一回目の勉強会のテーマは、「Eventは友達!

中村さんのお話

内容は後日資料をアップされるそうなので、そちらを見てくださいw
アップされたらここにも追記します。

本来のひよこの会はハンズオン形式で、誰か一人が講義するというものではないのですが、
第1回ということもあって、特別に講義していただきました。

中村さんのお話の中にもありましたが、ひよこの会の目的は「今さら人に聞けないことを聞く」というものですが、初心者は何を聞いたら良いかわからない、どう聞いたらいいかわからない という人が多いと思います。
そういう方にとっては、最初に中村さんにお話していただいてすごく参考になったのではないかと思います。

Eventは友達!

addEventListenerとdispatchEventについては中村さんの資料を見ていただくとして、ここではどうせなら違うことを書いてみようと思います。

AS3のように、addEventListenerでイベント待機して、dispatchEventでイベント発行して、という書き方をイベント駆動型プログラミングといいます。(イベント駆動型プログラミング – Wikipedia)
イベント駆動型はGUIプログラミングと相性が良く、Flashではイベント駆動でのプログラミングが前提となっています。
とまぁここらへんは知らなくても生きていけるのでどうでもいいですw

中村さんのお話では、独自のイベントを書いてdispatchEventしてましたが、初心者は既存のイベントをaddEevntListenerする機会の方が多いと思います。
そこでaddEventListenerするときの注意・小技をちょっとだけ紹介します

addEventListenerしたらremoveEventListenerもしてね

よくmcをaddChildしてremoveChildしても、イベントはaddEventListenerしたまま、ということがあります。
イベントはremoveChildしても消えません。
画面には写ってなくても裏でいっぱい動いてます。
気分的にも負荷的にもよろしくないので、後片付けはちゃんとしましょう!
というお話

removeEventListenerめんどいから勝手に消えて

イベント勝手に消えていいよ、ってとき

public function addEventListener(type:String, listener:Function, useCapture:Boolean=false, 
priority:int=0, useWeakReference:Boolean=false):void

addEventListenerの第五引数のuseWeakReferenceをtrueにするといつか勝手に消えてくれます。

無名関数をaddEventListenerに登録する方法

普通関数には名前がありますが、名前のない関数を作って、addEventLisnterすることもできます。

addEventListener(Event.ENTER_FRAME, function(e:Event):void {
	trace("hoge");
});

あんまりよろしい書き方じゃないけど、テストなんかでちゃちゃっと書きたい場合に便利!

無名関数でaddEventLisnterに登録したけど、removeEventListenerしたい

基本的に、無名関数で登録すると、削除できません。
だけど、ちょっとしたテクで、無名関数の中でならremoveEventListenerすることができます。

mc.addEventListener(Event.ENTER_FRAME, function(e:Event):void {
	trace("hoge");
	e.currentTarget.removeEventListener(e.type, arguments.callee);
})

これでremoveEventListenerできます。魔法と思っといていいですw
なにしてるかというと、
e.currentTargetは、addEventListenerしたmcを指します。
e.typeは、イベントのタイプ、上の例ではEvent.ENTER_FRAMEです。
arguments.calleeは、現在実行している関数の参照です。つまり今いる関数自身。
こいつらを使うと、自分自身をremoveEventListenerすることができます。難しいですねw

addEventListenerに引数付きの関数を渡したい

addEventListenerで登録するとき、関数に一緒に引数もつけて登録したいとき。

function func(moja:String):Function {
	return function(e:Event):void {
		trace(moja);
	};
}

addEventListener(Event.ENTER_FRAME, func("てすと"));

クロージャを使って引数を保持させ、引数付きの関数を登録できるようにしています。

 

適当にあげてみましたが、ひよこの会の人達がどのくらいのレベルなのかわからないので、難しいものも入ってます。
わからなくても大丈夫です、俺も全然分かりませんでしたw
全部わかるようになれば、立派なEvent使い!

質問タイム

中村さんのお話が終わったら質問タイムに突入。
最初の方はみなさん全然手があがらなかったのですが、後半になるとどんどん質問があがってきていい感じでした。
どんな質問があったかは覚えてな(ry

せっかくなので、覚えてる範囲で、自分なりの考えで答えていきます。

なんでボタンじゃなくてムービークリップ使うの?

中村さんのお話で、ボタン使わずにムービークリップで作れって話があったので、それに対する質問。

実際にボタンを作ってみるとわかるんですが、マウスオーバーやマウスダウンなどの状態毎に別々の絵をつけていく感じでとても作り易いんですけど、ボタン内のフレームにはas書けないんですよね。
慣れてきてあーしたいこーしたいって思ったときに融通がきかない。
じゃあ始めからムービークリップで作っとけよと。

ライブラリってなに?

ライブラリとは、よく使うようなプログラムをどこでも使えるように、エロイエライ人がまとめてくれたものです。
有名所では
簡単にasでアニメーションさせることができるTweener
簡単にフルFlashサイトが作れてしまうProgression
Adobeの中の人が作ってる、便利な機能がいっぱい入ってるas3corelib
などなど、あげると切りがないのでここらへんで。
日本にはAS3のライブラリをいっぱいまとめて置いてるSpark Projectという素晴らしいコミュニティサイトがあるので、活用したらいいよ!

プリローダーってどうすんの?

まずプリローダーって?
・画像とか読み込みが全部終わる前に再生しちゃうとおかしくなる
・swf自体のサイズが大きいと、完全に読み込まれるまで真っ白のままで表示されないからどうにかしたい
以上の2つの問題を解決するために、予め読み込んで、その間はなんかアニメーション表示させとこうってのがプリローダーです。
よく重たいFlash見るときに最初にローディングバーがあったり、くるくるしてるのがあったり、あれです。

前者の
・画像とか読み込みが全部終わる前に再生しちゃうとおかしくなる
ってのを解決するためには、一番最初に、URLLoaderとかでいっぱい読み込ませて、終わったら進むようにすればおkです。

・swf自体のサイズが大きいと、完全に読み込まれるまで真っ白のままで表示されないからどうにかしたい
ってのを解決するためには、swfを読み込むswfを用意します。
FlashDevelopを使うとテンプレが用意されてます。
Progressionもプリローダーが用意されてます。便利ですね。

外部ファイルを読み込みまくってるときは前者、swfに埋め込みまくってる時は後者を使うと良いです。

外部AS?

ってなんぞや?
asはタイムラインに書くことも、.asファイルとして外部にまとめて書くこともできます。
主にタイムラインメインで作ることをタイムラインベース、asファイルで作ることをクラスベースといいます。
大規模で動的なFlashを作るときはクラスベースじゃないときついと思います(多分)
タイムラインにいっぱいas書くと、どこに何書いてあるか全然わからなくなります。しんどい。

コンポーネントって?

ボタンとかチェックボックスとかカラーピッカーとか、Adobeが始めから準備してくれている便利な部品たちのことです。
こんなの

This movie requires Flash Player 9.0.0

これを使うと、適当に作ってもそれっぽく見えます←
でも分かる人にはAdobeのそのまま使ってるってバレバレなのでちょっとダサいです。
コンポーネントを自作することもできます。

ステージ外が見えちゃう

swfをそのまま開いたりするとよくステージ外が見えちゃったりします。
そういうの防ぐにはどうすればいいの?

一番ラクチンなのは、ステージのサイズでマスクをかけてやること。
これだけで領域外は見えなくなります。
他には領域外に行くとアルファを0にしたり。でもちゃんとremoveChildしてやるのが一番いいです。
ステージのサイズでマスクをかけて、領域外にでるとremoveChildするっていうのが一番確実だと思います。

スマートフォンに対応させるには?

・Androidの場合

AndroidはFlashが見れるので、そのままでも見れることには見れるのですが、重いです。
しっかりとしたAndroid対応のFlashを作るには、Flex SDK “Hero” のモバイル用フレームワークを使うと、モバイル用に最適化されたインターフェースを作ることができます。
(参考:Flex SDK 4.5 “Hero”を使って、お手軽Androidアプリ開発 | ClockMaker Blog)

また、AIR for Android を使ってAndroidアプリとして出すこともできます。
こちらはAIRなので、Flashよりも高速で、ローカルな機能を使うことができます。
(参考:Flash Professional CS5でAIR for Androidをはじめよう | デベロッパーセンター)

・iPhoneの場合

iPhoneはFlashは見れません。Flashを見ることができるアプリも出てますが、正直見れたものじゃないです。
しかし、FlashをiPhoneアプリに変換できるツール、Package for iPhoneがAdobeから出ています。
iPhoneの規約変更でおじゃんになりかけたけど、また復活したw
(参考:今すぐ出来るPackager for iPhone | エントリー | _level0.KAYAC | flash ActionScript blog)

どっから始めたらいいの?

どこから始めたらいいのかわからない、なにすればいいのかわからない、ってのは最初の頃はよくあると思います。

とりあえずAS3の基本的な型と文法だけわかるようになっとけばいいと思います。
文法くらいまでは、大体AS3の入門書を見ればどれも簡単に説明されてると思います。
あとは、何か作るものを決めて、それを作るためには何をすればいいかを考えて、ググる作業ですw
クラスの設計の仕方わかんねえ・・・とか思ったら、オブジェクト指向 とか デザインパターン とかでググればいいです。
わからなかったらひよこの会で聞くと誰か答えてくれます(多分)

Flashを勉強する上で便利なサイト

質問にはなかったのですが、調べ物したり勉強するのに便利なサイトをいくつか。

  • Adobe® Flash® Platform 用 ActionScript® 3.0 リファレンスガイド
    AS3使う限り見続けるであろう、AS3の説明書

  • アドビ-Flashデベロッパーセンター
    解説記事やチュートリアルが豊富

  • Flashゲームプログラミング講座 For ActionScript3.0
    ひとつひとつサンプル付きですごくよくまとめられてるHakuhinさんのサイト

  • FLASH-JP.COM – FLASH-japan FORUM
    日本最大級のFlashユーザーのためのコミュニティサイト
    ※質問を投稿する際には、必ず似たような質問が既にないか調べて、マナーを守って投稿してください。

  • にゃあプロジェクト – ウェブログ – 関連記事 : AS3.0 (まとめ)
    たくさんのFlash関連記事をサンプルと一緒に解説しているサイト。

  • wonderfl build flash online
    素晴らしいFlashが全てソースコード付きで見られる
    自分で作ったFlashを投稿することもできます。
    (tonというユーザー名で投稿してるのでよかったら見てくださいw)

  • Beautifl – Flash Gallery of wonderfl
    上記のwonderflの作品の中から美しい作品だけを集めたサイト。

    感想

    第1回目ということもあってどうなるか心配でしたが、後半はだいぶ質問も手が上がるようになって、ひよこの会らしくなってよかったと思います。
    なにより女性率が多くてよかったです!(ぇ
    ずっと一人で仕切っていただいた中村さんありがとうございました。
    中村さんのお話は、初心者を意識して分かりやすく解説していただいて、とても参考になりました。

    懇親会もみなさんと名刺交換できたり、わいわいがやがや楽しかったです。
    トライデントの可愛い女の子もいたしね!w

    次回のひよこの会はいつあるかわかりませんが、楽しみにしてます!

  • 名古屋ひよこの会に行ってきた

    No Comments

    6月6日に名古屋ひよこの会に行ってきました
    ひよこの会とは、いまさら他人に聞けないFlashの基礎的な何かを勉強する会 です
    東京、大阪と立ち上げられたので急遽名古屋も立ち上げられ、どういう方針でやっていくかということを話し合うためのミーティングということで行ってきました
    どんなことを話したのかは、すでにブログに書いてくださってる方がいるのでそっちみてくださいw
    La Thinking Motion. – [flash] 名古屋ひよこの会 第一回ミーティング報告 [study]
    こそこそえにっき – Flash 名古屋ひよこの会 に参加してきました

    こっからは個人的な感想

    今更ですけど、「他人に聞けないFlashの基礎的な何か」 ってかなりアバウトですよねw
    俺はFlash=ActionScript3.0な人間なので「他人に聞けないAS3の基礎的な何か」だとかなりやりやすいんですが、Flashって、ActionScriptのバージョンによってかなり違うし、ActionScript書かなくてもタイムラインで絵を動かすだけでFlash作れちゃう
    Flashの待受を作りたいという話も出てましたが、Flashの待受となるとFlashLiteだし、AS使わなくても作れるんですよね
    それはそれでひよこの会としては十分ありなんですが、ActionScriptを期待してた方はしょぼーんとなるかなーと・・・w
    逆も然りですね
    そこらへんを決めるためのミーティングでもあったんでしょうけど、曖昧なまま終わってしまって残念です
    他のひよこの会はどんな感じでやってるんでしょうか?

    なんかネガティブっぽいこと言っちゃいましたがひよこの会にはかなり期待してます!

    独学でやってる人は、同じ仲間がいるだけでかなり心強いと思います

    勉強会というよりまずはFlasherの輪を作るだけでもかなり違うはず。はず

    とりあえずみんなで情報を共有することが大事ですよね!

    ってことでひよこの会に参加する人は何かしらアウトプットしてね!w

    Blue Taste Theme created by Jabox