JavaScriptとPhoneGap Buildで作るスマートフォンゲームアプリ

2種類の「もぐら」の表示初期化

全333コースを10日間無料で

ぜひご覧ください。

無料で視聴する すべての加入プランを見る
または
良いもぐら、悪いもぐらの2種類の「もぐら」をランダムに表示する前に、まずは初期化をして、おかしな挙動になるのを防ぐ方法について解説致します。
講師:
03:36

字幕

このレッスンでは いいもぐら 悪いもぐら 2種類のもぐらをランダムに表示する前に まずは初期化して おかしな挙動になるのを 防ぐ方法について解説いたします まずは ダウンロードしてきた こちらの initialize_ mogura_type というフォルダの 中に入っている js フォルダの中の script.js ファイルを エディタを開いてください そして これがファイルを開いた状態です このファイルを使って今回のレッスンの 解説を進めていきたいと思います それでは早速レッスンを始めていきましょう 今回 注目して頂きたいのは このファイルの中のこの部分となります まずは 前回までのレッスンで こちらの showMogura という ユーザー定義関数を作成しましたね 今回はこの showMogura という 関数の中に 実際に処理を加えていきます まずゲーム中に もぐらを表示させる際には いいもぐら 悪いもぐら 2種類のタイプを ランダムで表示させたいと思います ただ そうするためには そのもぐらを表示する前に 一度どちらのもぐらも 消しておくという形で いわゆる初期化を行っておくと 後々実際にもぐらをランダムで 表示させる時におかしな 不具合のある挙動になることを 防ぐことができます 今回はその初期化の方法についてです ここで実装していることは いたってシンプルです 要するに両方のもぐらに対して まずは画像を非表示にする といった処理を行っています では 順番に見ていきます まずこちらですね $(moguraId) そして find そして find の括弧の中には .mole そしてその直下に ある div タグ そしてその後に hide ( ); としていますね これは両方のもぐらの画像を含んでいる こちらの div タグ その div タグはというと .mole 要するに mole という class を持った HTML タグの直下にある div タグという意味になります その div タグを hide 非表示にしろという形にしています そしてこの find の前にある こちらの moguraId ですが これはこちらの showMogura の 引数となる値です ここに3体いる中の どのもぐらかを 指定する内容を入れ込みます ここでは そのもぐらを構成しているー div タグについているIDを 代入してくるような形を想定しています こうする事で 例えば 一番左にいるもぐらの中に 表示されている画像枠を 非表示にするといった意味になります そして こちらの次の文は― さらに その中にあるもぐらの 画像自体を非表示にしています こうすることによって いいもぐらも 悪いもぐらも 両方とも非表示になっている状況を 作ることができます このように実装した後で 具体的にいいもぐら 悪いもぐら どちらを表示させるかというプログラムを この後に記述していきます その具体的な実装方法については 以降のレッスンで 順次取り上げていきますので そちらも参考にしてみてください 以上でレッスンは終了です 今回は いいもぐら 悪いもぐら 2種類のもぐらをランダムに表示する前に まずは初期化をして おかしな挙動になることを 防ぐ方法について解説いたしました 以降のレッスンでは2種類のもぐらを ランダムに表示させる方法について 解説していきますので そちらもあわせてご覧ください

JavaScriptとPhoneGap Buildで作るスマートフォンゲームアプリ

このコースでは、JavaScriptとPhoneGap Buildを使ってスマートフォン向けのもぐらたたきゲームのアプリを作成する方法について解説します。Phonegap BuildやjQueryについて紹介したのち、HTMLやCSSでのコーディングの方法、ゲーム内でのアニメーションの実装や条件分岐の方法などについて学んでいきます。

2時間27分 (43 ビデオ)
現在、カスタマーレビューはありません…
 
ソフトウェア・トピック
価格: 2,990
発売日:2015年05月12日

このコースは、「オンデマンド」でご利用可能であり、ダウンロードすることもオンラインで見ることもできます。

ダウンロードすると、オフラインでコースを使用し、豊富なインターフェースをフルに活用できます。複数のデバイスを使用したり、 一度に全コースをダウンロードしたくない場合は、アカントにログインして、ストリーミング・ビデオとしてコースのレッスンを視聴してください。

ビデオトレーニングをお楽しみいただけますように! お問い合わせは、cs-jp@lynda.com宛までご連絡ください。