この本を見ながら進めてる↓
前回⇒「【Swift奮闘記ep36】電卓アプリを作ってみた(UIKitフレームワーク、UIStackView)」
前回の電卓アプリの次に作るのはタイマーアプリだ。
どちらも最近のスマホには初期状態から必ず入っているといっていいほど定番アプリだ。
今回作るタイマーアプリは10秒、3分、5分の中から時間を選び、その時間が経過したらアラームが鳴るようにする。
バックグラウンドでも機能するようにするとアプリ制作が複雑になるので、フォアグラウンドのみの動作を考えていく。
ビューの設置
今回設置するビューは「10秒」、「3分」、「5分」の3つのタイマー(ボタン)を設定する。
そしてそれを表示する「ラベル」も設置。
計4つのビューを設置して、それらを関連付けるコードを書いてアプリの完成となる。
ビューのレイアウト
またもUIStackViewが出てきたが、これはもうお手の物。
さらにそのレイアウトを設定。
等間隔に設置したり、位置を指定したり、横幅をコンテナいっぱいにしたり。
忘れそうなのでメモっておくが、
Commandキーを押しながらUIStackViewをクリックするとちゃんと選択できる
ってこと!
アウトレットとアクションの接続
そして例の如く、ラベルとボタンをアウトレットとアクションで接続していく。
今回時間設定のボタン3つはそれぞれ分けて接続する。
今回の流れについて
今回のアプリの仕組み(大きな流れ)は以下の通り。
- ボタンが押される(10秒ボタンが押されたとしよう)
- tenSecondButtonTapped(_:)メソッドの呼び出し
- Timerクラスでタイマー開始
- さらにupdate()メソッドを1秒おきに呼び出して、秒数を1ずつ減らし画面の更新を行う。
- もし10秒経過した場合はTimerクラスによって更新を止める処理をする
プロパティについて
今回使うプロパティだが、timerプロパティにTimerインスタンスを代入してcurrentSecondsプロパティに残り時間(秒)を代入することとする。
timerプロパティに代入するTimerインスタンスだが、タイマー開始と同時にインスタンスが作られるので、タイマー開始するまではtimerは空の状態だ。だからオプショナル型で定義する。
タイマー開始について
「10秒」、「3分」、「5分」、どのボタンが押された時もタイマーを開始するように一個のメソッドを定義する。
startと言うメソッドで引数に秒数を入力して実行されるものだ。
引数の秒は残り時間を表すcurrentSecondsに代入され、ラベルに”残り××秒”と表示されるわけだ。
そしてタイマー開始のためのメソッドとしてTimerクラスのscheduledTimerメソッドというのが用意されている。
引数がいくつかあるが、それぞれ重要な意味を持っている。
例えばtimeIntervalはどのくらいの間隔で処理が実行されていくか、今回は1.0秒間隔に設定する。
次にtargetはどうするか、これはビューコントローラにするのでself。
selectorについてはタイマー完了したら何のメソッドを呼び出すか指示を出すところだ。update()を呼び出す設定にしておく。
userInfoはタイマーに任意の情報を渡せるが、今回は渡さないのでnil。
最後にrepeatsは繰り返すかどうか、今回は繰り返すのでtrueとBool型で返す。
こんな感じで出来上がったstartメソッドをそれぞれのボタンが押された時に発動するように設定する。
start(seconds: 10)とかstart(seconds: 180)とかstart(seconds: 300)とか。
音を鳴らす
タイマーの残り時間が無くなったら音を鳴らす設定をする。
そのためにupdateメソッドを実装するのだが、まずは残り時間(currentSeconds)を1ずつ減らす記述。
次にメソッド外でAudioToolboxフレームワークを設定した後、updateメソッドの中に残り時間が0になったらタイマーを止めて音を鳴らすように処理を記述する。
Timerクラスのinvalidateメソッドでタイマーを止め、soundIdでID番号を指定して音の種類を決める。
さらにAudioServicesPlayAlertSound関数で音を鳴らす。
さあ実行してみよう
今回はエラーも出ず一発で成功。
良かった。
やっぱうまくいったら気持ちいい。
再生する効果音を変えてみたり秒数を変えてみたりして遊んでみたが、すぐ飽きたので次のアプリづくりに進もう。
コメント