A 回答 (1件)
- 最新から表示
- 回答順に表示
No.1
- 回答日時:
_root の _x と _y プロパティを書き換えるとムービー全体が移動します。
ただし、スクロールバーやボタンも _root の子であるために同時に移動してしまいます。
そこで、ムービー全体を移動した後で、スクロールバーとボタンの座標を_root が移動した分だけ元に戻すようにします。
画面全体が移動してもスクロールバーとボタンだけは常に同じ位置に留まり続けるので、ムービー全体がスクロールしたように見えるかと思います。
作る前にレイアウトをきっちり決めてください。
スクロール対象は1番下に透明な四角形(もしくは背景用の画像など)を敷いてこの上に文字や画像を並べると、大きさを考えやすくなります。
ステージの一部をボタンを表示する領域にします。
このボタンは、ムービークリップの中に入れ子にします。
親であるムービークリップは先のコンテンツと同じ要領で、1番下に背景を敷いてその上のレイヤーにボタンを配置します。
ステージに配置した時に、この背景は余白としての役割を果たします。
スクロール対象の上にムービークリップの背景部分が上書きされて表示されるので、ボタンの表示部分とスクロールする部分が違う部品になっているように見えるというわけです。
-------------------------------------------------------------------
とりあえず、以下のレイアウトの作例を考えます。
スクロールは縦方向とします。
・ステージの大きさは幅×高さ = 200 px × 150 px
・コンテンツ表示領域は高さが 100 px ( Y = 0 ~ 99 )、残りはボタンを常時表示しておくためのスペース
・スクロール対象であるコンテンツは高さが 500 px(表示領域の5枚分のサイズ)
今回の作例では重ね順が大切です。
重ね順はレイヤーの順序を利用して決めます。
ムービーのレイヤーは次のような構成にします。
この重ね順は編集時のレイヤーの順序と同じです。
アクション :スクリプトを書きます。
スクロールバー: UIScrollBar コンポーネントのインスタンスを置きます。
ボタン表示領域:ボタンのムービークリップ(ボタン+余白)を置きます。
コンテンツ :スクロールさせるテキストや絵などを置きます。
背 景 :スクロール対象の大きさを固定させるための背景です。
まず、”背景”レイヤーに 200 px × 500 px の、線のない四角形を描画します。幅は特に関係ありませんから、表示領域と同じサイズにしなくても結構です。
これより上のレイヤーに文字や絵などを描画してください。
”コンテンツ”と”ボタン表示領域”レイヤーの間であれば、レイヤーを分けて置いても構いません。
次に、UIScrollBar コンポーネントのインスタンスをステージ右上に配置します。配置するレイヤーは”スクロールバー”です。
「プロパティ」パネルのH:の項目に数値を入力し、表示領域の高さ(この例では 100 px )に合わせてください。
スクロールバーもスクリプトで制御するので、インスタンス名が必要です。仮に” sc_bar ”とします。
ムービークリップシンボルを1つ、新規に作成します。
シンボルの1番下のレイヤーに 200 px × 50 px の塗りだけの四角形を描画し、これより上のレイヤーにボタンのインスタンスを配置してください。
このボタンにインスタンス名を付けてください。仮に” btn ”とします。
できたムービークリップのインスタンスを、”ボタン表示領域”レイヤーの、ステージの下端( X = 0 、Y = 100 の地点)に配置します。
これにもインスタンス名を付けてください。仮に” btn_area ”とします。
以上で準備は完了です。
次はスクリプトを書きます。
**************************************
スクリプトは全て、メインのタイムラインに書きます。
(↓各行頭に全角のスペースが入っています。コピーする際はご注意ください)
/////////////////////////////////////////////////////
//初期設定
/////////////////////////////////////////////////////
//表示領域とスクロール対象の高さ
area_h = 100;
object_h = 500;
//1ページあたりの表示量と、スクロールバーが返す最大値
page_h = area_h;
sc_max = object_h - area_h;
//もとの画面位置とスクロール量を記憶する変数
org_y = 0;
scroll_y = 0;
/////////////////////////////////////////////////////
//スクロールバーの設定とスクロール処理
/////////////////////////////////////////////////////
//スクロールバーが返す値を設定
sc_bar.setScrollProperties( page_h , 0 , sc_max );
//スクロールバーが動いた時の処理
sc_listener = new Object();
sc_listener.scroll = function( info:Object )
{
var sc_obj;
//スクロールバーの参照を格納
sc_obj = info.target;
//スクロール前のムービー全体の位置を保存しておく
org_y = _root._y;
//スライダの位置に応じて、画面全体を縦に移動
_root._y = -sc_obj.scrollPosition;
//画面が移動した分だけ、
//スクロールバー自身とボタン表示領域の位置を戻す
scroll_y = org_y - _root._y;
sc_obj._y += scroll_y;
btn_area._y += scroll_y;
//スライダが一番下に来ていたらボタンを有効にする
if( sc_obj.scrollPosition >= sc_max )
{
btn_area.btn.enabled = true;
btn_area.btn._alpha = 100;
}
//それ以外の時は無効にしておく
else
{
btn_area.btn.enabled = false;
btn_area.btn._alpha = 30;
}
};
//リスナーオブジェクトを登録
sc_bar.addEventListener( "scroll" , sc_listener );
/////////////////////////////////////////////////////
//ボタンの初期設定
/////////////////////////////////////////////////////
//ボタンを無効(無効の間は薄表示)にしておく
btn_area.btn.enabled = false;
btn_area.btn._alpha = 30;
//ボタンが押された時の処理
btn_area.btn.onRelease = function()
{
/*ここに、ボタンがクリックされた時の処理を書く*/
};
マスクを使っていないため「ムービープレビュー」では画面からはみ出す部分が見えてしまい、分かりにくいかもしれません。
「パブリッシュ」で HTML ファイルに配置してブラウザで再生するか、スタンドアロンプレイヤーで確認してみてください。
**************************************
スクロールバーの原理は、スライダが動いた方向と逆の向きにスクロール対象を動かすというものです。
UIScrollBar では、スライダの位置に応じたある値を取得できる仕組みになっています。
この値そのものに特定の意味はありません。
何の意味を持たせるかは自由です。
例えば、テキストフィールドと関連付けた時に返してくる値はテキストフィールドの行で、範囲は 1 ~ maxscroll です。
テキストフィールドに関連付けると、返す値の範囲はテキストフィールドの大きさやフォントサイズ・行数などから自動的に設定されます。
スライダを操作すると、スクロールバーはスライダの座標から返す値を割り出します。そして、関連付けられているテキストフィールドの scroll プロパティを書き換え、該当する箇所を変更しています。
スクロールバーが返す値の範囲は setScrollProperties というメソッドで設定できます。
今回はスクロールバーで動かす対象がテキストフィールドではないため、値の範囲を自分で定義しなければなりません。
スクロールバーからどんな値を受け取り、それをどのようにスクロール処理に反映するかが、腕の見せ所なのです。
setScrollProperties の引数は3つです。
・第1引数
1ページあたりの表示量。主にスライダの大きさに影響を与えます。
・第2引数
スクロールバーが返す最小値。 0 未満にはできません。通常は 0 です。
・第3引数
スクロールバーが返す最大値。縦のスクロールバーの場合は、スライダが下端にある時の値です。
今回は、スクロールバーから返される値を直接スクロール処理に反映できるように値を決めます。
スライダが上端にある時、スクロール対象はステージの上端( Y = 0 )にあればいいので、第2引数は 0 にします。
ちょっと頭を使うのが第3引数です。
この値は、スクロール対象と表示領域の大きさから決めます。
スライダが下端にある時は、スクロール対象の下端が、表示領域の大きさの分だけ表示されるということです。
スクロールバーから返される数値をもとにこの位置を割り出せるように、最大値を決めます。
文字だけでは分かりにくいかと思いますので、図に描いて考えてみてください。
スクロールバーが返す値を決めたら、あとは、スライダが動くたびにスライダの位置に応じた値を見て、それとは逆の方向にスクロール対象を移動させるだけです。
今回はムービー全体を縦スクロールということで、_root の _y 座標を書き換えます。
スライダが動いたかどうかは、UIScrollBar コンポーネント(を制御しているクラス)が持っている scroll というイベントを利用して検出します。
スクロールバーが返す値は、scrollPosition プロパティに入っています。
スライダが下端にあるかどうかは、scrollPosition の値が setScrollProperties の第3引数に設定した値に達しているかどうかで判断できます。
冒頭にも書きましたように、スクロールバーもボタンも _root の子であるために、_root ごと動かすとこの2つも同時に動いていってしまいます。
そこで、まず、_root を移動する前に _y の値を保存しておきます。
移動後の座標と保存しておいた座標の差だけスクロールバーとボタンがズレてしまったということですから、この2つをその移動量だけ改めて移動して位置を戻します。
最後に、ボタンはムービークリップシンボルの中の入れ子になっていますので、ターゲットパスにご注意ください。
-------------------------------------------------------------------
・・・とまあ、力技ではありますけれど、一応、ムービー全体をスクロールバーで動かすことは可能です。
ですが、一般的には、スクロール対象をムービークリップとして作り、マスクを利用して一部分だけを表示しながら移動させる方法をとります。
スクロール対象のムービークリップだけが移動するのであれば、移動した分だけスクロールバーとボタンを戻すといった余計な手間をかける必要もなくなります。
Flash のムービークリップやステージは無限に大きくできるわけではありません。
また、静止テキストが多すぎると処理が重くなったり、字が重なって表示されることがあります。
スクロールバーでスクロールさせる対象の大きさはほどほどにしましょう。
長くなってすみませんでした。
不明な点がありましたら補足してください。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- Photoshop(フォトショップ) 【Photoshop】画像拡大時に急激に画面外まで拡大してしまうのを制御したい 1 2023/08/25 03:04
- その他(IT・Webサービス) このサイトのスクロール逆じゃないですか? 1 2022/10/05 20:48
- gooブログ 記事の下にスクロールバーが表示される 2 2022/08/19 20:42
- その他(プログラミング・Web制作) マウスオーバー→ホイール回転でスクロールできない 2 2022/10/31 10:06
- HTML・CSS トリミングで表示した画像をクリックで元どおりにしたい 3 2022/12/16 18:49
- マウス・キーボード HEIYO Surfaceぺんの使用方法を教えてください 2 2023/04/09 10:40
- アプリ Edgeを操作するアプリについて 4 2023/05/11 22:48
- iPhone(アイフォーン) iphoneで撮影した写真、動画を連番のファイル名で保存したい。 1 2022/04/28 02:12
- Android(アンドロイド) AQUOS ZEROの使い方教えて下さい 2 2022/03/27 17:21
- YouTube YouTube動画スクロール対策 あるユーチューバーの動画を最初の動画から見ているのですが1番下まで 1 2022/10/02 15:56
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
画面全体にスクロールバーをつ...
-
flashでボタンを押したら違うサ...
-
VBAで改行の入ったデータの正規...
-
python ボタンを押すと複数の関...
-
VBScriptでMsgBoxのYesNoボック...
-
別のアプリケーションのテキス...
-
DataTableの件数を取得したい
-
【VB.NET】別Formのボタンが押...
-
VBSでMid関数を使ったらエラー...
-
VB.NETで数十行のプログラムを...
-
IP Address 入力フォームについて
-
C# chart controlの透過について
-
物体の衝突判定について教えて...
-
VBAユーザーホームテキストボッ...
-
photoshopで書いた四角の枠の中...
-
'2465'指定した式で参照してい...
-
VB6.0 でメニューを作りたいん...
-
エディットボックス内での追記
-
テキストボックスの中身をリセ...
-
static関数がmapファイルに載ら...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
ボタンの上にカーソルを置いた...
-
記述の無いアクションが動く??
-
PHPでボタンをクリックすると変...
-
ボタンインスタンスにスクリプ...
-
ボタンアクション flash アク...
-
ムービークリップの中にボタン...
-
arduino プログラムについて
-
FLASHで画面の最大化と100%表示...
-
ボタンのカウント数でムービー...
-
ボタンの上に重なっているMCを...
-
メニューの単語が落ちてきてバ...
-
外部SWF読み込み後の座標指定
-
Flashでボタンをクリックすると...
-
「ボタンロールオーバー時のイ...
-
虫眼鏡拡大ムービーの中にボタ...
-
ムービークリップの中のボタン...
-
adobe frash CS5.5について
-
FlashからPHPへの変数の渡し方...
-
的当てゲーム
-
移動位置が狂ってしまう
おすすめ情報