カスタム スクロールバーUI

はじめまして！ matsumura です。海賊王をめざす男です。

福島の田舎から鎌倉にやってきた（遅すぎた）ニューカマー。福島のみんな元気ー。
カヤックに入る前は、一年のうち数ヶ月を海洋冒険ロマンに費やしていました。
沈没船に潜って財宝を探したり、海王類最大種のザトウクジラと泳いだり、
そんなわけであだなは冒険王。

地方でこの _level0 をみているひともたくさんいると思います。
私も数ヶ月前はそうでした。すごいなー、わくわくするなー
いつか自分もいっしょになにかつくりたい！
そして今、晴れてカヤックという船に乗船許可がでました。うおー。
悶々としていた自分にこのようなチャンスが与えられて感謝しています。

本題

今回は、自作のスクロールバー コンポーネントをご紹介します。

Flash コンテンツをつくっていて、「ここスクロールしたい」ということがあります。
でも標準のコンポーネントはなんだかもっさりしてる。
そこで簡単に編集できる カスタム スクロールバー コンポーネントをつくってみました。

デモ

スクロールのエリアと、スクロールするターゲットを指定することで簡単にスクロール機能が実装できます。

scrollbar：スクロールバー
masker：エリア（マスク）
target：ターゲット

使い方

scrollbar.masker = マスクMc;
scrollbar.target = ターゲットMc;

コンテンツを切り替えるメニューボタンがあるとします。
コンテンツ（ターゲットMc）が切り替わるタイミングで、scrollbar に target を再指定することで、
スクロールバーは新たに再指定されたコンテンツに対してスクロールを開始します。

scrollbar.target = ターゲットMc;

事前の mask 化は必要ありません。自動で mask 化されます。
また、ターゲットMc の位置など初期化することもできます。

scrollbar.format();

特徴

・fla ファイルのパーツを編集することでスキンが作成できる。
・ターゲットMc が、マスクMc よりも小さいときは、スクロールバーは表示されません。

Tweener を利用してますが、使用しないで自分でスクロール速度をコントロールしてもOKです。
フル Flash サイトを制作するときには、自動スクロールは標準でつけておきたい機能です。
ちなみに今回は縦スクロールにのみ対応しています。

scrollbar の up down ボタンを押されたときに色を変えたり、スクロール方向の track の色を変えたりするとなおいいかもしれません。

ダウンロード

サンプルはこちらからダウンロードしてお使いください。
注意）Tweener を利用してます。＞別途ダウンロードください。