Starling+FeathersのScrollContainerを使う のソース :: NJF Wiki

• 差分^[1] を表示
• Starling+FeathersのScrollContainerを使う^[2] へ行く。

モバイルアプリでよくある、指でドラッグしてスクロールするUIはScrollContainerを使う。

まずは初期化。

 var container:ScrollContainer = new ScrollContainer();
 container.width = 300;
 container.height = 200;
 container.scrollBarDisplayMode = Scroller.SCROLL_BAR_DISPLAY_MODE_FIXED;
 container.verticalScrollPolicy = Scroller.SCROLL_POLICY_ON;
 container.verticalScrollBarFactory = function():ScrollBar
 {
 	var scrollBar:ScrollBar = new ScrollBar();
 	scrollBar.direction = ScrollBar.DIRECTION_VERTICAL;
 	scrollBar.trackLayoutMode = ScrollBar.TRACK_LAYOUT_MODE_SINGLE;
 	scrollBar.thumbFactory = function ():Button
 	{
 		var button:Button = new Button();
 		button.defaultSkin = new Quad(2, 50, 0x000000);
 		return button;
 	}
  
 	scrollBar.minimumTrackFactory = function ():Button
 	{
 		var button:Button = new Button();
 		button.defaultSkin = new Quad(2, 20, 0x999999);
 		return button;
 	}
 	return scrollBar;
 }
 addChild(container);

ここでverticalScrollBarFactoryとminimumTrackFactoryは右側に表示されるスクロールバーを矩形で定義している。
実際には自前の画像などを設定することが多い。

あとは内容をつけるだけ。スクロールバーは内容のサイズに合わせて自動で表示してくれる。

 container.addChild(yourImageOrSprite);

アイコンを並べたりするのも可能。

実際に使っているのがこちら。
http://njf.jp/?p=4238

• Starling+FeathersのScrollContainerを使う のバックアップソース(No. All)
  • 現: 2015-05-28 (木) 23:32:20 njf^[3]