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

ゲーム中の得点のリアルタイム表示

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

ぜひご覧ください。

無料で視聴する すべての加入プランを見る
または
ゲームプレイ最中の得点を、リアルタイムに画面内に表示させる方法について、解説致します。
講師:
02:53

字幕

このレッスンではゲームプレイ最中の得点を リアルタイムに画面内に表示させる方法について 解説いたします まずはダウンロードしてきたこちらの Show real time score フォルダの中に入っている この js フォルダの中の この script.js ファイルを エディタで開いてください そしてこれがそのファイルを開いた状態です このファイルを使って今回のレッスンの 解説を進めていきたいと思います それでは早速レッスンを始めていきましょう まずは前回までのレッスンのおさらいです 前回までのレッスンでクリックした もぐらが良いもぐらか悪いもぐらかに応じて それぞれ得点の減算処理そして 加算処理を行ってきましたね 今回はその得点を リアルタイムにプレイ中の画面に 表示させる方法についてみていきたいと思います 今回注目していただきたいのは こちらの部分となります それでは具体的にどのように実装していくか 見ていきたいと思います まず $.currentScore としています これは currentScore というクラスをもった html タグという意味ですね その .text その中身のテキストを このテキストの後の括弧の中に こちらの currentScore の値に 変更しろという意味になります この currentScore というのはプレイ中の得点を 保持するための変数でしたね この currentScore の値を もぐらがクリックされるたびに こちらのクラス currentScore をもった htmlのタグの中に 記載するといった意味になります このようにすることで リアルタイムに現在の得点を プレイ中の画面の中に表示させることが可能です それではこの状態で index.html ファイルを ブラウザで開いて その動作を確認してみたいと思います index.html ファイルはダウンロードしてきた ファイルの中に含まれています それはブラウザで開いてみましょう そしてこれが index.htmlファイルを ブラウザで開いた状態です ではこちらのゲームスタートボタンを クリックしてみます そして顔を出してくるもぐらを クリックしてみます するとこのように画面上部の得点 スコアの部分ですね この部分が加算されて表示されているのが 分かるかと思います このようにプレイ画面の中でリアルタイムに 得点を表示することができるようになりました このように動作すれはきちんとプログラムの 実装が完了できているといった形になります 以上でレッスンは終了です 今回はゲームプレイ最中の得点をリアルタイムに 画面内に表示させる方法について 解説いたしました 以降のレッスンではゲーム終了時に 最終の得点結果を画面内に表示させる 方法について解説いたしますので そちらもあわせてご覧ください

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

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

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

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

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

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