Adobe TVにFlex4(Gumbo)のLayoutに関するインタビューと、サンプルの説明があるビデオが公開されていました。
インタビューは、RyanさんがEvitimさんにFlex4のLayoutについて聞いています。EvitimさんはFlex 4 のLayout部分担当だそうです。
これまで(Flex3まで)はLayoutの指定がApplicationの属性でした。
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
Flex4では、Layoutの指定がクラスの指定になります。
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/halo">
<s:layout>
<s:VerticalLayout/>
</s:layout>
Flex4のSpark Componentsでは以下の5つが提供されています。
- Basic Layout
- Horizontal
- Vertical
- TileLayout
- ButtonBarHorizontalLayout
レイアウトを自分で作成するときには、spark.layouts.supportClasses.LayoutBase.as
を拡張して以下のメソッドをoverrideすればよいみたい。
- measure():void
- updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void
CutomLayoutを実装するとこんなLayoutもできます。
上記のカスタムレイアウト(WheelLayout)はFlex SDKのSVNにあります。
インタビューとCumtomLayoutのコードはこのビデオで見ることができます。
#Gumbo(Flex 4)の仕様に関するDocumentがいっぱい
Gumbo - Flex SDK - Confluence
http://opensource.adobe.com/wiki/display/flexsdk/Gumbo#Gumbo-DocumentsandSpecifications
#Sparkの Layoutに関するドキュメント
Spark Layout - Flex SDK - Confluence
http://opensource.adobe.com/wiki/display/flexsdk/Spark+Layout
Spark Basic Layout - Flex SDK - Confluence
http://opensource.adobe.com/wiki/display/flexsdk/Spark+Basic+Layout
Spark Horizontal and Vertical Layout - Flex SDK - Confluence
http://opensource.adobe.com/wiki/display/flexsdk/Spark+Horizontal+and+Vertical+Layout
Spark TileLayout - Flex SDK - Confluence
http://opensource.adobe.com/wiki/display/flexsdk/Spark+TileLayout
#Flex SDK TeamでLayout部分を担当しているevitimさんのblog
Easy Flex » FlowLayout - a Spark Custom Layout Example
http://evtimmy.com/?p=3
#Cynagy Systems Andrew TriceによるCircularLayout という、円を描くようなCustomレイアウトがコード付きで解説されています。
Flex 4 & Custom Layouts InsideRIA
http://www.insideria.com/2009/05/flex-4-custom-layouts.html
Adobe TVのビデオ中で使われているWheelLayoutについては以下にコードがあります。
http://opensource.adobe.com/svn/opensource/flex/sdk/trunk/development/eclipse/flex/flex4test/src/layouts/WheelLayout.as
#Adobe TVでevitimさんとryanさんのインタビュー&customLayout(WheelLayout)のサンプルについてのデモ
Flex 4 Layouts on Tech Talk with Ryan Stewart Ryan Stewart - Rich Internet Application Mountaineer
http://blog.digitalbackcountry.com/2009/05/flex-4-layouts-on-tech-talk-with-ryan-stewart/
#RyanさんによるEvtimさんのblog紹介
Evtim is Blogging All About Flex 4 Layouts Ryan Stewart - Rich Internet Application Mountaineer
http://blog.digitalbackcountry.com/2009/06/evtim-is-blogging-all-about-flex-4-layouts/
この記事に対するコメント