アンケートご協力のお願いgihyo.jpでは,2010年度に向けて豪華プレゼントが当たる読者属性アンケートを実施しております。ご協力ください。

gihyo.jp » DEVELOPER STAGE » 連載 » ActionScript 3.0で始めるオブジェクト指向スクリプティング » 第12回 マウスポインタとスクロールの連動

ActionScript 3.0で始めるオブジェクト指向スクリプティング

第12回 マウスポインタとスクロールの連動

前回は,MovieClipインスタンスを水平スクロールさせ,その移動方向をマウスポインタの位置に対応させた。今回はさらに,スクロールスピードも,マウスポインタの位置に連動させよう。

前回作成したスクリプト4(図1)に修正を加えていく(サンプルファイルは第11回「MovieClipをスクロールさせる―条件判定」の2ページ目からダウンロードできる)。

図1 インスタンスをマウスポインタの位置に応じて水平方スクロールさせるフレームアクション

図1 インスタンスをマウスポインタの位置に応じて水平方スクロールさせるフレームアクション

マウスポインタの中央からの水平位置にスピードを比例させる

まず,マウスポインタのステージ中央からの水平位置に,インスタンスがスクロールするスピードを比例させたい。その場合,ステージ中央とマウスポインタとの水平座標の差を取ればよい。その結果の数値は,マウスポインタの水平位置がステージの左側か右側かによって,正負の符号が変わる。そのため,前回のスクリプト4に加えられている,スクロール方向を判定するif条件の処理は,もはや要らなくなる。

したがって,水平スクロールするピクセル数nNewSpeedを決める処理は,元のスクリプト4を以下のように修正する。なお,修正の経過がわかるように,元のステートメントはコメント化して残した(※1)。また,ブロックコメント区切り記号を使うと,開始の演算子/*から終了の演算子*/まで,複数の行をまとめてコメントにすることができる。

// var nNewSpeed:Number;   // つぎのステートメントに変更
var nNewSpeed:Number = nStageCenter-stage.mouseX;
/* スクロール方向の判定は不要になる
if (stage.mouseX&nStageCenter) {
  nNewSpeed = nSpeed;
} else {
  nNewSpeed = -nSpeed;
}
*/

もっともスピードを,ステージ中央からのマウスポインタの水平位置に単純に比例させたのでは,少し問題がある。マウスポインタをステージ中央付近で動かしていればよいものの,ステージの端にポインタを移動すると1フレーム当たりの移動距離がステージ幅の約半分のピクセル数になってしまうからだ。2フレームでステージ外に飛出してしまったのでは,左右どちらに移動しているのかももはやわからない。

そこで,スピード制限が必要になる。最高速度は,毎フレーム±20ピクセルとしよう。つまり,ステージ中央とマウスポインタとの水平座標の差が±20を超えたら(20より大きいか,-20より小さかったら),移動ピクセル数を±20に設定し直すということだ。これは,if条件を使う処理の復習問題として丁度よいだろう。上述の修正で変数nSpeedが使われなくなったので,改めて最高速度の正の値20を納めることにする。

以上の修正を加えたMovieClipインスタンスのフレームアクションが,以下のスクリプト001である。[ムービープレビュー]で確かめると,マウスポインタの水平位置が中央から遠くなるほど,インスタンスのスクロールスピードが増す(図2)。

スクリプト1 マウスポインタの中央からの水平位置にスクロールスピードを比例させる

// MovieClip: スクロールさせるインスタンス
var nSpeed:Number = 20;
var nStageLeft:Number = 0;
var nStageRight:Number = stage.stageWidth;
var nStageWidth:Number = nStageRight-nStageLeft;
var nStageCenter:Number = (nStageRight+nStageLeft)/2;
var nSensitivity:Number = 0.2;
addEventListener(Event.ENTER_FRAME, xScroll);
function xScroll(eventObject:Event):void {
  var nNewSpeed:Number = (nStageCenter-stage.mouseX)*nSensitivity;
  if (nNewSpeed>nSpeed) {
    nNewSpeed = nSpeed;
  } else if (nNewSpeed<-nSpeed) {
    nNewSpeed = -nSpeed;
  }
  x += nNewSpeed;
  if (x>nStageRight) {
    x -= nStageWidth;
  } else if (x&nStageLeft) {
    x += nStageWidth;
  }
}

図2 インスタンスのスクロールスピードがマウスポインタの中央からの水平位置に比例する

図2 インスタンスのスクロールスピードがマウスポインタの中央からの水平位置に比例する

なお,上記スクリプト1には,新たに変数 nSensitivityが追加された。そして,ステージ中央とマウスポインタとの水平座標の差に,この値が掛合わされて,水平移動するピクセル数 nNewSpeedに代入されている。この変数nSensitivityは,マウスポインタの水平位置にスクロールスピードが比例する度合いを調整する係数だ。

この係数がない場合,スクロールするピクセル数そのものは,変数nSpeedを用いたif条件のステートメントによって±20の範囲内に抑えられている。しかし,移動ピクセル数を単純にステージ中央とマウスポインタとの水平座標の差に比例させれば,ポインタをステージ中央から左右各20ピクセル動かしただけで最高速度に達してしまう。

比例係数として変数nSensitivityの値0.2を掛け合わせることによって,ステージ中央からマウスポインタを左右100ピクセル(= 20/0.2)動かさないと,最高速度にはならなくなる。つまり,スピードの微調整がしやすくなるということだ。

※1)
スクリプトの記述は残しつつ,コメント化して無効にすることを「コメントアウト」という。

著者プロフィール

野中文雄(のなかふみお)

ソフトウェアトレーナー,テクニカルライター,オーサリングエンジニア。上智大学法学部卒,慶応義塾大学大学院経営管理研究科修士課程修了(MBA)。独立系パソコン販売会社で,総務・人事,企画,外資系企業担当営業などに携わる。その後,マルチメディアコンテンツ制作会社に転職。ソフトウェアトレーニング,コンテンツ制作などの業務を担当する。2001年11月に独立。Web制作者に向けた情報発信プロジェクトF-siteにも参加する。株式会社ロクナナ取締役(非常勤)。

URLhttp://www.FumioNonaka.com/

著書

  • ActionScript 3.0プロフェッショナルガイド

    ActionScript 3.0プロフェッショナルガイド(毎日コミュニケーションズ)

  • ActionScript 3.0辞典 [FlashPlayer 10/9対応]

    ActionScript 3.0辞典 [FlashPlayer 10/9対応](翔泳社)

コメント

コメントの記入

パスサポ

多数の情報処理技術者試験対策書籍の発行実績を誇る技術評論社がお届けする,資格試験合格サイト「めざせ! 情報処理試験 パスサポ」が開設されました。

ピックアップ

サクセスストーリーに続く,快適サーバー運用管理のヒント!

データの増大,煩雑な管理,システムダウン,セキュリティなど,迫りくる課題からシステム管理者の負担を軽くするポイントを解説します。

gihyo.jp インフラエンジニア情報局

ネットワークやITにかかわるあらゆる業種で必要とされるインフラエンジニアに向けた技術情報や心構え,その魅力について多角的に紹介。

テストエンジニア ステーション

いま,ITに関わるあらゆる開発業務で注目されつつあるテスト系エンジニアをターゲットにしたコンテンツサイトを展開します。

一行クイックアンケート

gihyo.jpで取り上げてほしいネタは?

※検索はページ右上の検索ボックスをご利用ください。

その他の連載

キーパーソンが見るWeb業界

本連載はWeb Site Expert/gihyo.jpとの連動企画です。阿部淳也, 長谷川敦士, 森田雄のお三方による,Web業界をテーマにした座談会です。

きたみりゅうじの聞かせて珍プレー

ソフトウェア開発の現場で体験したトホホな失敗,思わずうなる珍プレーをきたみりゅうじ氏が四コママンガで紹介。みなさんからの投稿もお待ちしてます!

ActionScript 3.0で始めるオブジェクト指向スクリプティング

野中文雄氏が,簡単なスクリプトは書いたことがあるという初級者を対象に,ActionScript 3.0の基本からクラス定義までを解説します。

まだ間に合う「ITパスポート」受験対策 原山先生の短期合格塾

この連載では,4月18日のITパスポート試験の受験に向けて,短い期間で効率良く受験対策を行う方法や,確実に得点するための裏ワザなどを伝授していきます。

Ubuntu Weekly Recipe

Ubuntuの強力なデスクトップ機能を活用するための,いろいろなレシピをお届けします。

C/C++プログラマのためのDTrace入門

よくカーネルのチューニングや解析で活用されるDTraceですが,実はユーザプログラムの開発においても非常に有用です。連載ではC/C++プログラマやテストに関わる方向けにDTraceの使い方を解説します。

Blogopolisから学ぶ計算幾何

計算幾何学は,図形に関するアルゴリズムを研究するコンピュータサイエンスの一分野です。本連載では,ビジュアルブログ検索エンジン「Blogopolis」で採用されている計算幾何のアプローチを例に取り上げながら,計算幾何の初歩を実践的に学習します。

検索エンジンはいかにして動くのか?

本連載では, 今や誰もが利用している検索エンジンの中身を,全体の仕組みやデータ構造,アルゴリズムから分散インデックスまで,最近の研究事例も交えて紹介します。

連載一覧

gihyo.jp

  • DEVELOPER STAGE
  • ADMINISTRATOR STAGE
  • WEB+DESIGN STAGE
  • LIFESTYLE STAGE
  • SCIENCE STAGE
  • NEWS & REPORT

書籍案内

  • 新刊書籍
  • 書籍ジャンル一覧
  • 書籍シリーズ一覧
  • 新刊ピックアップ
  • ロングセラー
  • 電脳会議

定期刊行物一覧

  • Software Design
  • WEB+DB PRESS
  • Web Site Expert
  • 組込みプレス