Knowledge base func

Tag: flex4

Flex4のスクロールコンポーネント

by on 10月.12, 2010, under Flex

Share on TwitterSave on Delicious

s:BorderContainerもしくはs:Groupが
mx:Canvasコンテナの変わりになるらしいのだが使え無さ過ぎて困っている。

s:BorderContainerの特長は背景や枠線のような設定ができるがs:Groupにはこれができない。
逆にs:layoutを使うにはs:BorderContainerをそのまま使うことができず、s:Groupでラップしてあげなければならない。
ネストが深くなりすぎてこれだけで嫌な感じである。

 <s:BorderContainer
  backgroundColor="0x00ff00" cornerRadius="6"
  borderStyle="solid" borderWeight="2"
  height="34" width="100%"
  left="2" right="2" top="0">
  <s:Group height="34" width="100%">
   <s:layout>
    <s:HorizontalLayout
     gap="10"
     paddingLeft="5"
     horizontalAlign = "left"
     verticalAlign = "middle"
     />
   </s:layout>
   <s:Button label="Button 1"/>
   <s:Button label="Button 2"/>
   <s:Button label="Button 3"/>
  </s:Group>
 </s:BorderContainer>

今、困っているのがs:Scrollerの扱いの問題だ。
かつてのmx:CanvasコンテナはverticalScrollPolicy=”on”としてやれば、済んだのだが、Flex4ではそのようには挙動しない。
s:BorderContainerをs:Scrollerで囲うことはできない。
その為、一回s:Groupで囲う必要がある。
しかもs:Groupはスクロールが効かないので、さらにs:BorderContainerに配置してあげなければならない。
これだけでもバカらしいのに、一番最下層のcvs_tagコンテナにコード上からUIComponentとかを足してあげて、描画をすると、なんと!!
はみ出て表示されます…。
スクロールバーとして意味がねぇ…。
右下、左下にはみ出る。

 <s:BorderContainer
  backgroundColor="red" cornerRadius="10"
  borderStyle="solid" borderWeight="1"
  left="20" right="20" top="40" bottom="350"
  >
  <s:Scroller width="150" height="150"
  verticalScrollPolicy="on" horizontalScrollPolicy="on">
   <s:Group height="300" width="300"
   >
    <s:BorderContainer
     backgroundColor="0x0000ff" cornerRadius="10"
     borderStyle="solid" borderWeight="1"
     height="800" width="800"
     id="cvs_tag"
     >
    </s:BorderContainer>
   </s:Group>
  </s:Scroller>
 </s:BorderContainer>

ほんとどうなっているんだろう。
これを回避してやるには、一層上のs:Groupをwidth=”100%” height=”100%”にしてやるか、heightなどを削る必要がある。
s:Scrollerはs:Groupにしか効かないが、s:Groupはレイアウト属性を持たないので、凄くまわりくどいうえに注意が必要。またラップしているcornerRadiusは外側には効かない。意味ないね…。
BorderContainerにverticalScrollPolicyが効くようになっていればいいだけなのに、なんと使えないことか。
flex4はflex3で書いていた書き方やコーディング方法がまったく使えない。
別の言語だと思ってつきあったほうがいいぐらいだが、かといってflex3の悶絶するような構成がクリアになったかといえば、そうなっていない。
どこらへんが洗練されたかは今のところわからないので、ここまで。

余談だけど、FlashDevelopでflex4のairの吐き方がなんかできないので諦めた。
なんかやろうとしたやりかたの延長では回避できない匂いがしたのさ。
flex3だとあんなに簡単だったのにねー。
もうちょっとFlex4のやり方でアプリ書いてからまたAirやってみます。

Leave a Comment : more...

Looking for something?

Use the form below to search the site:

Still not finding what you're looking for? Drop a comment on a post or contact us so we can take care of it!