Flex&Adobe AIR 勉強会(FxUG勉強会第153回@東京/Adobe MAX 2011 報告会)に参加してきた #fxug #maxjp

今回は「Adobe Max 2011」の新発表と
Adobe Maxのセッションの中から、 Flexテクノロジーのセッションを中心に紹介します。

2011年07月のFxUG 第146回@東京以来3ヶ月振りのFxUG参戦。今回は先日行われた『Adobe MAX 2011』に関する報告会も兼ねると言うことでQ久々に行って参りました。(直前までScrum Gathering Tokyo 2011:Day1に参加していたのは実は内緒。)


Adobe MAX 2011』開催に関する主なページはこちら。

そして主なレポートはこちら。


尚、今回は横田 聡 氏(TwitterID:@sato_shi)による司会進行で会が進められました。

Adobe MAX 2011 報告会 (19:05〜19:35 / 疑応答等 19:35〜19:45) レベル1

Adobe MAX 2011で発表があった新情報を中心に紹介予定。


  • Adobe MAX 2011報告会
    • 11/05:Follow Upやります。
    • 今日はMAXにいくとはどういう雰囲気なのか、を御紹介。なので今日はレベル0。
    • 日本から毎年何人も参加している。
    • 割と安い値段でツアーを提供している。
    • MAX アドバンテージツアーを楽しんできた。
    • MAX自体は10/1〜10/6で開催。
      • 最初の2日はプリカンファレンス、別の催し物があったり。
    • 基本真ん中3日間(月火水)を押さえる感じでツアー。
  • Max Tweetチーム
    • ツアー参加者全員。興味のある分野、得意な分野をつぶやく。
    • 彼等をフォローすることでタイムライン上につぶやきが流れる。
    • クイズイベントなどもやった。

写真を観ながら、イベントの流れなどに触れつつトーク

  • 体調管理重要。海外の場合は特に。
  • LAの天気は日本とそんな変わらず。
  • ago:美味しいお店でした(パスタ)
  • 夜のLAをハマ−で快走。(但し24人乗っていた)
  • MAXツアー:良い席に座れます。あとは翻訳レシーバーも付いてきます。
  • Adobe Cloudについて
    • 最終形では無いが、過程の段階
      • サービス
      • コミュニティ
      • アプリケーション

  • Business Catalyst
  • Fonts
  • Digital Publishing
  • 勉強会をやる場所がMAXでやってたりする
  • 色々なノベルティがもらえたり
  • CSS拡張パック
    • この辺詳細はAdobe MeetUPで触れるらしい。


  • 撃墜王ゲーム
    • 日本人がファイナリストに残ったらしい。
  • 質疑応答
    • MAXでどんなセッションが人気があったのか?
      • 難易度設定、ネタにもよる。同じ技術でも難易度によって異なる
      • Stage 3d系は熱かった。
      • Laboは全部埋まっていた。
      • flash 、今度からマルチスレッドになるとか・・・
      • 有名人セッションは名前出た途端埋まる

Discover the Unknown Flex 4.5 (19:45〜20:45 / 質疑応答等 20:45〜20:55) レベル3

AS3, MXML, Flash Builder、それぞれであまり知られていない機能について紹介します。
  • Maxのセッションにあった内容を紹介。
  • Advanced:難易度。中間処の3レベルです...
  • 自己紹介
  • 書籍紹介
    • Flex4プログラミングガイド
  • Agenda/Aource of…
    • AS3
    • MXML
    • Flash Builder
    • ※皆恐らくしならないであろうネタを紹介。
    • ※自分の知識との答え合わせなぞ。
Source of…
  • Short conditional statements
  • Short Constructors
    • var point:Point = new Point; / カッコが要らない。
  • Throwing objects
    • throw 数字 でcatch(数字)という形でナンバーを受け取れる
  • arguments class
    • 呼ばれた関数自身の参照が可能 / arguments.callee
  • || (論理和代入:logical or assigmnent)
  • Getting object class type
  • Label & continue
    • 『ラベル名:』で好きな名前が付けられる
      • ラベル間の制御 / continue ラベルでラベルに遷移
  • Label & break;
    • 上記と似たようなもの
  • with statement
    • 〜.の『ドット』を端折ることが出来る
  • global functions
    • パッケージ直に関数を定義
    • クラスファイルと同名でfunctionを定義可能
    • その際のクラス名定義は不要。
  • internal functions
    • function の中で function 書けるよ!
  • custom namespace
    • フレームワークを作る人には馴染み深いかも
    • 『ネームスペース::関数名』で使う事が可能。
  • proxy class
    • 処理が上書き出来る。便利クラス
MXML
  • ObjectProxy Class
    • warning: unable to bind property 'propName' / on class 'Object' (class is not an IEventDispatcher)
  • &
    • ライブラリタグ、デフィニションタグ
  • タグ
    • 影響を及ぼさない無害なタグ。メモを書きたい場合に使う
    • タグの一番上に書く。
  • states
    • 上記と同等の処理を行う。
  • state groups
  • IMXMLObject
  • FlexGlobals.topApplication
    • どこからでも参照可能
  • conditional compilation
  • keeping generated ActionScript(-keep)
Flash Builder
  • Ctrl + Space でコンテンツアシスト
  • metadata code comlletion(コンテンツアシスト)
  • 定義済みのステートを補完
  • Camel-case code hinting
    • ADG AdvancedDataGrid
  • Quick Assist 機能 cms/ctrl+1
  • quick outline Cmd/Ctrl+O
  • call ヒエラルキー

Performance-Tuning Mobile Flex Applications (20:55〜21:55 / 質疑応答等 21:55〜22:15) レベル5

Flex SDK チームメンバーによるセッションを、有川榮一 氏に発表していただきます。
モバイル用に最適化された新しいコンポーネント群( List系やitemRenderer系、ビュートランジション系)の 理解を深めていただき、
最高のパフォーマンスが発揮できるFlexモバイルアプリケーションの開発手法を紹介します。
  • 自己紹介
  • Flex Mobile / LV5 - 知ってる体で行きます。
  • Mobile theme
    • New Mobile Compoents
      • performance Optimized
      • Touch optimized
      • Support …
    • Flex 4.6
  • Performance Tuning
    • コンテナのネストは最低限に
    • 背景は描画しない
      • borderContainerは、モバイル向けに最適化されていない
        • かわりにGroupとRectで頑張る
        • VgroupやHgroupをネストするのであれば
        • GroupとConstraintLayoutを使う
    • スクロールするコンテンツは、2つのプロパティが設定出来ないか検討する
      • cacheAsBitMap
      • opaqueBackGround
    • cacheAsBitMapを使うときは注意
      • 親にcacheAsBitmapが設定されている時は設定しない
      • 変更が頻繁に行われる表示オブジェクトに対してcacheAsBitmapは極力避ける
    • opaqueBackGroundは常時使う。
      • 特にcacheAsBitmapを使う場合。
    • 外部コンテンツは、キャッシュとキューを
      • キャッシュ
        • 頻繁につかうでーたは再利用
      • キュー
        • 外部コンテンツの取得はキューに溜めて同時にリクエストしない
      • ContentCacheクラスを使う
        • デフォルトでキャッシュする
        • デフォルトでキューしない
        • クラス変数にする
  • CacheAsBitmap=trueを使う
  • 小さなアイコンに大きな画像を使わない
  • Gif/Jpegの代わりにpngを使う
  • Graphicelement
    • 動的な描画可能
      • 線や塗りを変更出来る
    • 軽量な非ビジュアルコンポーネントを利用する
  • FXG
    • 静的な描画にある
    • コンパイル時に最適化されたグラフィックになる
    • ファイルフォーマットはXML
  • Labelは軽量
  • RichTextはちょっと重い
  • RichEditableTextはかなり重い
  • StyleableTextField(4.5)
    • モバイルでも使える軽量コンポーネント
    • 選択を編集出来る
      • 必要なければ機能をオフにしておく
    • Labelで使われている
      • MXMLでは使えない
  • StyleableStateText(4.5)
    • StageTest
  • ItemRendererをMXMLで作るなら
    • 重いレンダラーにならないようにする
    • 重いコンポーネントは使わない
    • 外部コンテンツにはキャッシュとキュー
    • cacheAsBitmapを検討する
    • 背景が必要なければ、autoDrawBackground = false
    • フィルターやドロップシャドーは使わない
    • バインディングは極力(絶対)使わない

    • Groupのネストは気を付ける
    • モバイル向けに最適化されたものを利用する
    • モバイル向け最適化
      • テキストはstyleableTextFieldで表示
      • 軽量なレイアウト
      • コンテンツのキャッシュ管理
    • itemRenderFunctionは再利用する
  • Skin
    • モバイル最適化されたMobileSkinを継承して作る
    • 出来る限りActtionScriptで作る
    • 出来る限りシンプルにする。
    • グラフィックにはDPI毎にFXGを利用
    • テキストには、StyleableTextFIeldを利用
  • ViewをMXMLで作るなら
    • 出来る限り重いコンポーネントは使わない
    • 生成遅延する
    • imageの代わりにBitmapImageを使う
    • 外部コンテンツはキャッシュとキュー
    • BorderCOntainerの代わりにGroupを使う
    • コンテナは重ねない

    • 遅延
      • 必要になるまで生成しない
        • includeInやexcludeOutを利用
      • トランジションに割り込まない
        • creationCompleteに非同期やinvalidateを呼び出さない。
      • 代わりにviewActivateイベントを使う。
      • ビットマップのフィルターは使わない
      • 代わりにRectangleDropShadowを使う
      • Viewを破棄しないようにdestructionPolicy="never"に設定する
      • too early, too lateを意識して開発する
  • Application
    • 起動は出来る限りの処理で済ませる(極力処理しないように)
    • 最初のViewは軽量で済ませる
    • iOSを使う場合は、iOS標準のやり方でスプラッシュスクリーンを表示する

    • 基本遅延、基本キャッシュで!
    • でも境界線は?・・・マシンによるんじゃないですか
      • プロパティもあるらしい。
    • どこをキャッシュするか
  • AIR Native Extention
    • ネイティブライブラリを使ってAIRを拡張出来る仕組み
    • 対応プラットフォーム
  • ActionScriptの処理が重い
    • ネイティブスレッドを利用する
    • ネットワーク処理
    • 高いレイテンシが必要な場合
    • 処理時間が長い場合

参考:




という事で通常回よりも1時間長い3時間(19:00〜22:00)のFlex勉強会。内容盛り沢山でした。つかこの前にも勉強会(Scrum Gathering Tokyo Day1)に出ていたので体力的にはかなりピークでありました・・・(;o_ _)o

次回開催は2011/11/09(水)だそうです。来月頭に開催される『Adobe ADC MEETUP 03』も興味深いですね。