Ad

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

まずは初期化。

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);

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

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

container.addChild(yourImageOrSprite);

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

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


Front page   Edit Freeze Diff Backup Upload Copy Rename ReloadPrint View   New Page Page list Search Recent changes   Help   RSS of recent changes (RSS 1.0) RSS of recent changes (RSS 2.0) RSS of recent changes (RSS Atom) Powered by xpWiki
Counter: 1031, today: 1, yesterday: 0
Princeps date: 2015-05-28 (Thu) 15:32:20
Last-modified: 2015-05-28 (Thu) 15:32:20 (JST) (1543d) by njf
広告

ログイン

ユーザー名:


パスワード:





パスワード紛失


NJF