はじめてのiOSアプリ開発

タイマーを使ってカウントダウンを実装しよう(その3)

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

ぜひご覧ください。

無料で視聴する すべての加入プランを見る
または
タイマーを使って10秒のカウントダウンをする、カウントダウンタイマーの基本機能を実装しましょう。
講師:
09:11

字幕

それではこのレッスンでは タイマーを使ってカウントダウンをしている このアプリケーションに対して ユーザに分かりやすいように 残り時間を表示していくというところを 実装したいと思います 現在はアプリケーションが起動したときに 「 viewDidLoad 」が呼ばれたところで 現在の時刻を確認して そして現在時刻を基に 10 秒後に 「 targetDate 」をセットして そしてその「 targetDate 」を基に カウントダウンを行う カウントダウンメソッドを タイマーを使って 1秒ごとに呼び出すという形になっています 現在はまだ画面の見た目を表示する部分の 「 timeLabel 」を使っていませんので 今回はこの「 timeLabel 」に 残り時間を表示していきたいと思います 残り時間を今 この「 doCountDown 」の中で この「 interval 」という変数に取得しています 「 interval 」という変数に取得してきた 残り時間を次に― 秒数に直してやります 現在は「 interval 」というものは 小数点付きの秒数になっているんですけれども ユーザには小数点以下で あと 何点何何何秒残っていますよと 細かく伝えても しょうがありませんので ここでは まず最初に残り何秒かということを 取得するために int 型で「 second 」 「 sec 」という変数を用意してやりましょう そしてこの「 sec 」の中に「 interval 」の― この秒数の中に入っている小数点以下の部分を 一旦切り落としてやりたいと思います 切り落とすためには このように丸括弧を使って― (int) と書いたこのキャストと呼ばれるものを このフロート型の interval の頭につけることで 小数点以下を切り落とすことができます さらに 現在 秒で 来ているものの中には 例えば2分とか3分とか 1分以上のものになると 120 秒 とか 180 秒といった ちょっと大きめの秒数が やってくる様になっていますので さらにここで分を計算してやります 分は現在の秒数に対して この秒数を 60 で割り算してやると出すことができます 実際に見てみましょうか 例えば 現在 残りが 121 秒でした ということになると これを 60 で割り算をしてやると 小数点以下は出てきませんから 2が出てきます 残りが 121 秒でも 122 秒でも 2というふうに出てきます ですので これで分数が 正確に計算できているので 今度は秒数から分のぶんを引いてやります 「 min 」に 60 を掛けてやって この分を秒換算すると― 何秒たったかということを― これ「 sec 」から引いてやるんですね 「 - = 」と書いて―そうすると初め 例えば 122 秒あったものに対して コメントを書いてみましょうか 122 秒あったとすると これが分に直されることで 60 で割った結果として 分は2になります そして ここでこの 122 という数字から 2分 ×60 秒が引かれるので 残りが2秒という計算になります このようにして 分数と秒数をしっかりと 計算することができるようになっています ではあとは この分数と秒数をラベルの上に きれいに表示してやればいいだけですので 括弧を書いて 「 self 」の「 timeLabel 」に対して 「 setText 」にしてやります このように2つ以上の変数を きれいに画面に表示してやるためには 「 NSString 」というクラスの 「 stringWithFormat 」という メソッドを使ってやるのが 一番きれいにテキストを 作ってやる方法になります という事でここのフォーマットとして まず分を表示するところを作ります 「 %d 」そして「 : 」 そして後ろの方の秒を表示するところは 1秒とか2秒とか1桁台のところは 2桁で表示されるように― 0をつめて表示してくださいねということで 2桁の0になるように 表示してくださいというように このように「 %02d 」と 書いてやると指定できます そしてここに「 min 」と「 sec 」 それぞれを入れてくださいねと 指定することによって これで画面上に分と秒の時間を 分かりやすく指定できるようになっています では一度アプリケーションを実行して 結果を確かめておきましょう アプリを起動します そうすると このようにカウントダウンが しっかり行われて 3 2 1 というふうに カウントダウンが分かりやすく 表示されるようになったのが分かると思います ただし ちょっと問題が今発生していますけど このようにマイナスになっても どんどんカウントダウンをし続けていますので タイマーを止めるという事を しないといけません ですので ここで interval が0よりも小さくなったと すなわち カウントダウンが終わったと 0以下の方に念のため― interval が 0.0 ちょうどになることは まずないのですけれども 一応 ちょうどになった万が一のことを考えて タイムが来たというときに タイマーを止めてやります タイマーを止めるためには 何をすればいいかというと 上でこのタイマーを作った時に timer 変数がありますから この timer 変数に対して 「 invalidate 」これは無効化するという 意味あいの英語ですけれども このようにしてタイマーを 無効化してやることによって タイマーのカウントダウンが停止します ということでこれでもう一度 アプリケーションを実行してみましょう そうするとアプリケーションが 起動してから 10 秒間― 7 6 5 というふうに カウントダウンをしていって そして最後0になったところで カウントダウンが 終了するという事が分かります ここであとひとつだけ 修正しておきたいのが アプリケーションが起動したとき その直後の動作です アプリケーションが 起動した直後に注目してください 起動した直後 99:99 というのが そのまままだ出続けています このラベルの最初の状態ですね 出ています これはタイマーを使うときに 注意して頂きたいんですけども アプリケーションを起動したときに タイマーを作成していますが このタイマーというのは 1秒後にならないと呼ばれないので アプリケーション起動直後には doCountDown はまだ呼ばれていないんですね ですので 現在の時間と差分を計算して timeLabel をセットするという doCountDown が まだ呼ばれていない状態になるので 一瞬なんですけど 99:99 というデフォルトの timeLabel の表示が見えてしまいます これではちょっと格好悪いので強制的に 「 self doCountDown 」として この CountDown メソッドを無理やり 呼び出してやりたいと思います タイマーを作った直後 あるいはタイマーを作る直前でも構いません どちらかのタイミングでこうやって doCountDown を呼び出してやると― 実行してみますね 起動した直後に カウントダウンを開始している形になります ということで 6 5 4 3 2 1 0 というふうに カウントダウンの機能が見事に 実装できたのが分かると思います このレッスンでは タイマーを使ってカウントダウンをするときに ラベル上に残り時間をわかりやすく 表示するという部分を実装しました

はじめてのiOSアプリ開発

このコースではXcodeを使ったiOS用アプリの開発に必要な基礎知識を学びます。Xcodeの基本的な使い方から本格的なゲーム制作のためのSprite Kitを用いた制作方法まで、カウントダウンタイマーやスピード暗算ゲームなど3つの簡単なiOS用アプリを作りながら説明します。このコースを見れば、本当に必要なアプリ開発の知識を着実に身に付けられるでしょう!

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

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

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

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