どうも!リョクちゃです。
今回は、前回記事にしたタイマーを使って、
ラーメンタイマーを作ってみようと思います。
ちなみに前回はこちら
目次
ラーメンタイマーの機能
今回作成するラーメンタイマーの機能としては、
以下を行えるものとします。
- 時間の設定ができる
1分、3分、5分、10分 - 時間を選んだら残り時間と記述されたボックスにSetされる
- ボタンを押したら選んだ時間からカウントダウンしていく
- 残り時間が0:00になったらメッセージボックスに”タイマー終了”と表示させる
Windowsフォームアプリケーションの作成
まずは、下のようなフォーム画面を作成します。
※ タイマーも配置しておきましょう。
Label2と表示されているLabelは、実際はテキストには何も入力しません。
ちなみに筆者の環境は、
- VisualStudio2019
- Windows 10 64bit
- .Net Framework 4.5.2
です。
コンボボックスに時刻を追加する
まず、画面をロードする際に、コンボボックスに時刻を追加していきます。
コンボボックスにアイテムを追加するには、
でできます。
また、画面ロードはWindowsフォームデザイナでFormを選択した後
ダブルクリックで自動生成されます。
ここまでのコードは下のようになります。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
Public Class Noodle_Timer ''' <summary> ''' 画面ロード時 ''' </summary> ''' <param name="sender"></param> ''' <param name="e"></param> Private Sub Noodle_Timer_Load(sender As Object, e As EventArgs) Handles MyBase.Load ' コンボボックスにアイテムを追加する Me.ComboBox1.Items.Add("1:00") Me.ComboBox1.Items.Add("3:00") Me.ComboBox1.Items.Add("5:00") Me.ComboBox1.Items.Add("10:00") End Sub End Class |
実行して確認してみましょう。
このように出れば、成功です。
タイマーが選択されたら残り時間に反映する
次に、タイマーを選択したら残り時間に反映できるようにしていきます。
これを行うには、コンボボックスのイベントを使います。
コードは下のようになります。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 |
Public Class Noodle_Timer ''' <summary> ''' 画面ロード時 ''' </summary> ''' <param name="sender"></param> ''' <param name="e"></param> Private Sub Noodle_Timer_Load(sender As Object, e As EventArgs) Handles MyBase.Load ' コンボボックスにアイテムを追加する Me.ComboBox1.Items.Add("1:00") Me.ComboBox1.Items.Add("3:00") Me.ComboBox1.Items.Add("5:00") Me.ComboBox1.Items.Add("10:00") End Sub ''' <summary> ''' コンボボックスのアイテムが選択されたら発生するイベント ''' </summary> ''' <param name="sender"></param> ''' <param name="e"></param> Private Sub ComboBox1_SelectedIndexChanged(sender As Object, e As EventArgs) Handles ComboBox1.SelectedIndexChanged ' 選択したタイマをLabelに表示する Me.Label3.Text = Me.ComboBox1.SelectedItem.ToString() End Sub End Class |
タイマーを選択して、表示がされるか確認してみましょう。
下図のようになれば、成功です。
ボタンが押されたらカウントダウンを始める
次にボタンを押したら選択したタイマからカウントダウンを始めるコードを書いていきます。
ボタンを押したらについては、ボタンイベントを使用します。
コードは下のようになります。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 |
Public Class Noodle_Timer ''' <summary> ''' 画面ロード時 ''' </summary> ''' <param name="sender"></param> ''' <param name="e"></param> Private Sub Noodle_Timer_Load(sender As Object, e As EventArgs) Handles MyBase.Load ' コンボボックスにアイテムを追加する Me.ComboBox1.Items.Add("1:00") Me.ComboBox1.Items.Add("3:00") Me.ComboBox1.Items.Add("5:00") Me.ComboBox1.Items.Add("10:00") End Sub ''' <summary> ''' コンボボックスのアイテムが選択されたら発生するイベント ''' </summary> ''' <param name="sender"></param> ''' <param name="e"></param> Private Sub ComboBox1_SelectedIndexChanged(sender As Object, e As EventArgs) Handles ComboBox1.SelectedIndexChanged ' 選択したタイマをLabelに表示する Me.Label3.Text = Me.ComboBox1.SelectedItem.ToString() End Sub ''' <summary> ''' ボタンが押されたら発生するイベント ''' </summary> ''' <param name="sender"></param> ''' <param name="e"></param> Private Sub Button1_Click(sender As Object, e As EventArgs) Handles Button1.Click End Sub End Class |
ボタンのイベント内にカウントダウンを始めるコードを書いていきます。
カウントダウンを始めるには、前回の記事で学んだタイマーをスタートさせます。
スタートさせる前には、タイマーの間隔を設定します。
今回は、1000ミリ秒で行います。
タイマーの間隔の設定は、
で設定ができます。
スタートさせるには、
コードは下のようになります。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 |
Public Class Noodle_Timer ''' <summary> ''' 画面ロード時 ''' </summary> ''' <param name="sender"></param> ''' <param name="e"></param> Private Sub Noodle_Timer_Load(sender As Object, e As EventArgs) Handles MyBase.Load ' コンボボックスにアイテムを追加する Me.ComboBox1.Items.Add("1:00") Me.ComboBox1.Items.Add("3:00") Me.ComboBox1.Items.Add("5:00") Me.ComboBox1.Items.Add("10:00") End Sub ''' <summary> ''' コンボボックスのアイテムが選択されたら発生するイベント ''' </summary> ''' <param name="sender"></param> ''' <param name="e"></param> Private Sub ComboBox1_SelectedIndexChanged(sender As Object, e As EventArgs) Handles ComboBox1.SelectedIndexChanged ' 選択したタイマをLabelに表示する Me.Label3.Text = Me.ComboBox1.SelectedItem.ToString() End Sub ''' <summary> ''' ボタンが押されたら発生するイベント ''' </summary> ''' <param name="sender"></param> ''' <param name="e"></param> Private Sub Button1_Click(sender As Object, e As EventArgs) Handles Button1.Click ' タイマーの間隔を1000ミリ秒に設定 Me.Timer1.Interval = 1000 ' タイマーをスタートさせる Me.Timer1.Start() End Sub End Class |
ここで、ボタンを押してタイマーをスタートさせてしまうと
たとえば、タイマが選ばれず残り時間が表示されていない場合にエラーとなってしまいます。
そこで、残り時間に表示がされているかどうかをチェックするコードを付け足します。
コードは下のようになります。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 |
Public Class Noodle_Timer ''' <summary> ''' 画面ロード時 ''' </summary> ''' <param name="sender"></param> ''' <param name="e"></param> Private Sub Noodle_Timer_Load(sender As Object, e As EventArgs) Handles MyBase.Load ' コンボボックスにアイテムを追加する Me.ComboBox1.Items.Add("1:00") Me.ComboBox1.Items.Add("3:00") Me.ComboBox1.Items.Add("5:00") Me.ComboBox1.Items.Add("10:00") End Sub ''' <summary> ''' コンボボックスのアイテムが選択されたら発生するイベント ''' </summary> ''' <param name="sender"></param> ''' <param name="e"></param> Private Sub ComboBox1_SelectedIndexChanged(sender As Object, e As EventArgs) Handles ComboBox1.SelectedIndexChanged ' 選択したタイマをLabelに表示する Me.Label3.Text = Me.ComboBox1.SelectedItem.ToString() End Sub ''' <summary> ''' ボタンが押されたら発生するイベント ''' </summary> ''' <param name="sender"></param> ''' <param name="e"></param> Private Sub Button1_Click(sender As Object, e As EventArgs) Handles Button1.Click ' 残り時間が表示されていれば、タイマーをスタート If Me.Label3.Text <> "" Then ' タイマーの間隔を1000ミリ秒に設定 Me.Timer1.Interval = 1000 ' タイマーをスタートさせる Me.Timer1.Start() End If End Sub End Class |
タイマーのイベントを書く
タイマーをスタートさせたら、任意間隔おきに発生するイベントを書きます。
これを書くことで、カウントダウンを行わせます。
任意間隔おきに発生するイベントは、
になります。
実際にコードは下のようになります。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 |
Public Class Noodle_Timer ' 現在経過時間を格納する変数 Private nowTime As Integer ''' <summary> ''' 画面ロード時 ''' </summary> ''' <param name="sender"></param> ''' <param name="e"></param> Private Sub Noodle_Timer_Load(sender As Object, e As EventArgs) Handles MyBase.Load ' コンボボックスにアイテムを追加する Me.ComboBox1.Items.Add("1:00") Me.ComboBox1.Items.Add("3:00") Me.ComboBox1.Items.Add("5:00") Me.ComboBox1.Items.Add("10:00") End Sub ''' <summary> ''' コンボボックスのアイテムが選択されたら発生するイベント ''' </summary> ''' <param name="sender"></param> ''' <param name="e"></param> Private Sub ComboBox1_SelectedIndexChanged(sender As Object, e As EventArgs) Handles ComboBox1.SelectedIndexChanged ' 選択したタイマをLabelに表示する Me.Label3.Text = Me.ComboBox1.SelectedItem.ToString() End Sub ''' <summary> ''' ボタンが押されたら発生するイベント ''' </summary> ''' <param name="sender"></param> ''' <param name="e"></param> Private Sub Button1_Click(sender As Object, e As EventArgs) Handles Button1.Click ' 残り時間が表示されていれば、タイマーをスタート If Me.Label3.Text <> "" Then ' タイマーの間隔を1000ミリ秒に設定 Me.Timer1.Interval = 1000 ' タイマーをスタートさせる Me.Timer1.Start() End If End Sub ''' <summary> ''' 指定間隔ごとに発生するイベント ''' </summary> ''' <param name="sender"></param> ''' <param name="e"></param> Private Sub Timer1_Tick(sender As Object, e As EventArgs) Handles Timer1.Tick End Sub End Class |
あとは、前回の記事で書いたカウントダウンのコードを当てはめていくだけです。
実際に書いたコードがこちら
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 |
Public Class Noodle_Timer ' 現在経過時間を格納する変数 Private nowTime As Integer ''' <summary> ''' 画面ロード時 ''' </summary> ''' <param name="sender"></param> ''' <param name="e"></param> Private Sub Noodle_Timer_Load(sender As Object, e As EventArgs) Handles MyBase.Load ' コンボボックスにアイテムを追加する Me.ComboBox1.Items.Add("1:00") Me.ComboBox1.Items.Add("3:00") Me.ComboBox1.Items.Add("5:00") Me.ComboBox1.Items.Add("10:00") End Sub ''' <summary> ''' コンボボックスのアイテムが選択されたら発生するイベント ''' </summary> ''' <param name="sender"></param> ''' <param name="e"></param> Private Sub ComboBox1_SelectedIndexChanged(sender As Object, e As EventArgs) Handles ComboBox1.SelectedIndexChanged ' 選択したタイマをLabelに表示する Me.Label3.Text = Me.ComboBox1.SelectedItem.ToString() End Sub ''' <summary> ''' ボタンが押されたら発生するイベント ''' </summary> ''' <param name="sender"></param> ''' <param name="e"></param> Private Sub Button1_Click(sender As Object, e As EventArgs) Handles Button1.Click ' 残り時間が表示されていれば、タイマーをスタート If Me.Label3.Text <> "" Then ' 1. 分と秒に分ける Dim aryTime As String() = Me.Label3.Text.Split(":"c) ' 2. 秒に換算する 分=60秒 nowTime = CInt(aryTime(0)) * 60 ' タイマーの間隔を1000ミリ秒に設定 Me.Timer1.Interval = 1000 ' タイマーをスタートさせる Me.Timer1.Start() End If End Sub ''' <summary> ''' 指定間隔ごとに発生するイベント ''' </summary> ''' <param name="sender"></param> ''' <param name="e"></param> Private Sub Timer1_Tick(sender As Object, e As EventArgs) Handles Timer1.Tick ' 選択したタイマ全て経過したら終了 If Me.Label3.Text = "0:00" Then ' タイマーを停止する Me.Timer1.Stop() Exit Sub End If ' 現在の秒数から1000ミリ秒経過したら-1とする nowTime -= 1 ' 変数nowTimeの値を分に換算する Dim resultMin As Integer = CInt(Math.Floor(nowTime / 60)) ' 分への換算(割り算) Dim resultSec As Integer = CInt(nowTime Mod 60) ' 秒への換算(あまり) ' ラベルに現在の経過時間を表示 Me.Label3.Text = CStr(resultMin) + ":" + CStr(resultSec).PadLeft(2, "0") End Sub End Class |
ここまでで時刻を選んで時刻をカウントダウンすることができました。
タイマー終了通知を書く
最後に、カウントダウンが終了したらメッセージボックスを表示するコードを書き足します。
メッセージボックスは、
で表示させることができます。
コードは下のようになります。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 |
Public Class Noodle_Timer ' 現在経過時間を格納する変数 Private nowTime As Integer ''' <summary> ''' 画面ロード時 ''' </summary> ''' <param name="sender"></param> ''' <param name="e"></param> Private Sub Noodle_Timer_Load(sender As Object, e As EventArgs) Handles MyBase.Load ' コンボボックスにアイテムを追加する Me.ComboBox1.Items.Add("1:00") Me.ComboBox1.Items.Add("3:00") Me.ComboBox1.Items.Add("5:00") Me.ComboBox1.Items.Add("10:00") End Sub ''' <summary> ''' コンボボックスのアイテムが選択されたら発生するイベント ''' </summary> ''' <param name="sender"></param> ''' <param name="e"></param> Private Sub ComboBox1_SelectedIndexChanged(sender As Object, e As EventArgs) Handles ComboBox1.SelectedIndexChanged ' 選択したタイマをLabelに表示する Me.Label3.Text = Me.ComboBox1.SelectedItem.ToString() End Sub ''' <summary> ''' ボタンが押されたら発生するイベント ''' </summary> ''' <param name="sender"></param> ''' <param name="e"></param> Private Sub Button1_Click(sender As Object, e As EventArgs) Handles Button1.Click ' 残り時間が表示されていれば、タイマーをスタート If Me.Label3.Text <> "" Then ' 1. 分と秒に分ける Dim aryTime As String() = Me.Label3.Text.Split(":"c) ' 2. 秒に換算する 分=60秒 nowTime = CInt(aryTime(0)) * 60 ' タイマーの間隔を1000ミリ秒に設定 Me.Timer1.Interval = 1000 ' タイマーをスタートさせる Me.Timer1.Start() End If End Sub ''' <summary> ''' 指定間隔ごとに発生するイベント ''' </summary> ''' <param name="sender"></param> ''' <param name="e"></param> Private Sub Timer1_Tick(sender As Object, e As EventArgs) Handles Timer1.Tick ' 選択したタイマ全て経過したら終了 If Me.Label3.Text = "0:00" Then ' タイマーを停止する Me.Timer1.Stop() ' メッセージボックスを表示する MessageBox.Show("タイマー終了") Exit Sub End If ' 現在の秒数から1000ミリ秒経過したら-1とする nowTime -= 1 ' 変数nowTimeの値を分に換算する Dim resultMin As Integer = CInt(Math.Floor(nowTime / 60)) ' 分への換算(割り算) Dim resultSec As Integer = CInt(nowTime Mod 60) ' 秒への換算(あまり) ' ラベルに現在の経過時間を表示 Me.Label3.Text = CStr(resultMin) + ":" + CStr(resultSec).PadLeft(2, "0") End Sub End Class |
これで一通りの機能を満たすことができました。
実行して、メッセージボックスが表示されるか確認してみましょう。
下図のように表示がされていれば成功です。
おわり
お疲れ様です。
今回は、前回の記事で紹介したタイマーやこれまで紹介した内容を使って
簡単なアプリケーションを作ってみました。
組み合わせることで色々なモノを作ることができるので、
色々試していただければなと思います。
ご覧いただきありがとうございます。
・こちらの書籍を参考にVB.Net勉強しています。