ActionScript Beginners

016[スライダー]

2009/01/10

久しぶりの更新です。

前回の「オブジェクトをドラッグする」の応用。
ミュージックプレイヤーなどでよく見かける、スライダーの作り方をやってみます。

前回と同様にstartDrag()とstopDrag()を使用するわけですが、今回はスライドする範囲があるというところが違います。

まずはレシピ

on(press){　//マウスボタンを押した時
	this.startDrag(false,_root.hani._x,this._y,_root.hani._x+_root.track._width,this._y);　//ドラッグ開始
}
on(release, releaseOutside){　////マウスのボタンを離す、離して領域外に出た時

	this.stopDrag();　//ドラッグ終了
}

スライドする範囲の制限は色々な方法があり、また用途によって使い分けていかなければなりませんが、今回はスライドする範囲を視覚的に見せている白い横長のバーを基準にスクリプトを書いてみました。

手順は、
１、スライドする範囲を指定する横長のバー（今後トラックと呼びます）、実際にスライドするスライダーをステージ上に描きます。
２、どちらもMCシンボルに変換します。
３、トラックには「hani」とインスタンス名をつけておきます。
４、上記のアクションスクリプトをスライダーにMCアクションとして記述します。
以上です。

**解説**
2行目のstartDragの部分。
falseはマウスが押された時の状態でドラッグが始まります。逆にtrueにするとオブジェクトの中心にマウスが固定されてドラッグが始まります。
次に「_root.hani._x,this._y,_root.hani._x+_root.track._width,this._y」はインスタンス名haniの横幅を取得し、それを移動範囲にしています。
もう少し噛み砕くと
startDrag(false,ドラッグ範囲のX座標（左端）,Y座標（左端）,ドラッグ範囲X座標（右端）,Y座標（右端）)と指定してあげれば良いということです。
もちろん座標で指定しても可能です。

startDrag(false,10,0,200,0);

とするとOKです。

座標ではなくトラックで範囲を指定する利点は、スライドする範囲をカンタンに変更できたり、トラックを配置する時に座標とトラックの位置を合わせつける手間を省くところにあります。

と言うわけで、次回からはちょっと形あるものを創ってみたいと思います。お楽しみに。