【コラム】

日本語で10行プログラミング

84 時間電卓を作る

 

84/90

こんにちは。クジラ飛行机です。今回は時間電卓を作ってみたいと思います。時間の計算は、Excelを使って行うこともできますが、電卓感覚で使えるツールがあるといいなぁと思って10行プログラミングで作ることにします。

アイデア・仕様を考えよう

今回作るのは、時間電卓です。時間電卓は、特に今必要というので作るのではなくて、あったら便利そうだという気持ちから作ることにしました。そこで、時間電卓が、どんな場面で活躍しそうかということを、想像してみたいと思います。

まず、初めに思いついたのは、イベントなど催し物の時間配分を計算するのに、ちょっとした時間電卓があると便利だと思いました。また、最近ではiPodなどのMP3プレイヤーがあるのであまりやりませんが、CDの収録曲の時間を足して、何分のカセットテープを買えば良いか計算する時も、便利かなと思います。

こうした場面で使えることを想定して、以下の特徴を持つ時間電卓を作ろうと思います、

  • 機能が少なくシンプル
  • 数値を順に入力していくと、合計時間が表示される
  • 10行のプログラムで完成する

ですので、画面のデザインも至極シンプルなものが望ましくなります。操作に必要な部品を考えてみましょう。

必要となる部品

入力エディタ 時間を入力するためのエディタ
登録ボタン 入力した時間を登録するためのボタン
合計ラベル 合計した時間を表示するための
リセットボタン 合計時間を0に戻すためのボタン

必要な技術は? - 時間の計算について

時間の計算に使う命令はただ1つです。それは「時間加算」という命令です。この命令は、「(時間1)に(時間2)を時間加算」のように使います。計算した結果は、特別な変数「それ」に代入されます。

簡単に使ってみると以下のようになります。これは、1時30分10秒に、30分を足す例です。

「01:30:10」に「00:30:00」を時間加算。
それを表示。

実行すると「02:00:10」と計算結果が表示されます。とても簡単に時間の足し算が行えます。

しかし、この命令を使う上で気をつけないといけないことがあります。それは、時計を基本にして作られた命令だということです。ですので、24時間超の計算ができません。たとえば、「23:00:00」に「02:00:00」を足すと、結果が「01:00:00」と次の日の1時を指すので、足したのに小さな数字になってしまいます。

もし、24時間以上の計算を行いたい場合は、以下のように時間を計算する関数を作っておくと便利です。

# ファイル名:時間関数.nako
●時間加算処理(AにBを)
  Aを「:」で区切ってAに代入。
  AH = A[0]
  AM = A[1]
  AS = A[2]
  Bを「:」で区切ってBに代入。
  BH = B[0]
  BM = B[1]
  BS = B[2]
  # 計算
  CS = AS + BS
  繰上 = INT(CS / 60)
  CS = CS % 60
  CM = AM + BM + 繰上
  繰上 = INT(CM / 60)
  CM = CM % 60
  CH = AH + BH + 繰上
  それは「{CH}:{CM}:{CS}」

このプログラムでやっていることは、時間を、「時:分:秒」と3つの要素に区切り、それぞれの要素を足し、繰り上がりがあれば、繰り上がった分を加えるという処理です。

この上のプログラムを、「時間関数.nako」という名前で保存しておきます。そして、これを取り込んで利用するプログラムは以下のようになります。

# 利用例
!「時間関数.nako」を取り込む。
「00:30:00」に「0:40:00」を時間加算処理。
それを表示。# -- 1:10:0
「00:59:59」に「00:00:02」を時間加算処理。
それを表示。# -- 1:0:1
「23:59:59」に「00:00:02」を時間加算処理。
それを表示。# -- 24:0:1

時間の加算処理がうまく実行されていることを確認してみてください。

画面のレイアウトについて

なでしこで、ボタンやエディタを使うのは、とても簡単にできるようになっています。画面にボタンを配置したい時は、以下のように「OKボタンとはボタン。」のように、「(部品の名前)とは(部品の種類)」の書式で書けば良いのです。

部品の種類には、「ボタン」「エディタ」(1行入力用)「メモ」(複数行入力用)「リスト」「グリッド」など、いろいろなものがあります。なでしこエディタの左側にあるGUIタブを開くと、どんな部品があるのか確認できます。

なでしこで使える部品

では、時間電卓に使う部品をいくつか配置してみます。これで、エディタとボタンが画面に表示されます。

入力エディタとはエディタ。
加算ボタンとはボタン。

エディタとボタンを配置

次に、ボタンを押したとき、エディタの内容を表示するプログラムを作ってみます。このためには、部品がどう動くのか(イベント)を、プログラムする必要があります。例えば、ボタン部品では、「クリックした時」どうするのかを指定できます。

入力エディタとはエディタ。
入力エディタは「12:34:56」
加算ボタンとはボタン。
加算ボタンをクリックした時は~
  入力エディタを表示。

これで、ボタンを押したときに、画面に入力エディタに入力された内容が表示されるようになります。

10行プログラム ~ 時間電卓

さて、それでは、プログラムを作っていきましょう。いつものように実際のプログラムを作る前に手順をまとめてみましょう。

  1. 合計を表示するラベルや、入力用のエディタなど部品を作る
  2. 部品に応じた動作(イベント)を以下のように定義する

ボタンをクリックした時

  • 入力された時間を元に時間を加算
  • 加算した結果をラベルに表示する
  • 入力エディタを空に戻す

リセットボタンをクリックした時

  • ラベルを0に戻す。
  • 入力エディタを空に戻す

この手順通りに、なでしこで時間電卓を作ってみると、以下のようになります。

※プログラムを入力するときは、字下げ(インデント)を崩さないように注意してください。なでしこでは、字下げにも意味があるからです。
# 部品の作成
合計ラベルとはラベル。#1
入力エディタとはエディタ。#2
加算ボタンとはボタン。#3
リセットボタンとはボタン。#4
# イベントの設定
加算ボタンをクリックした時は~ #5
  合計ラベル=合計ラベルに入力エディタを時間加算したもの。#6
  入力エディタは空。入力エディタに注目。#7
リセットボタンをクリックした時は~#8
  合計ラベルは「00:00:00」。入力エディタは「」。#9
# リセットを実行
リセットボタンのクリックした時。#10

時間電卓を実行してみたところ

1行目~4行目では各種の部品を作成しています。

5行目~7行目では加算ボタンをクリックした時のイベントを、8行目~9行目ではリセットボタンをクリックした時のイベントを定義しています。

使い方ですが、時間を入力するときは、「時間:分:秒」の形式で時間を入力し、加算ボタンをクリックします。すると、次々と合計時間が表示されます。リセットしたい時は、リセットボタンを押します。

改造のヒント

今回のプログラムを実際に使ってみると、いくつか不便な点に気づくでしょう。

特に、時間の数値を入力する時に、テンキーを使うのが一般的だと思うのですが、時間を入力するたびにマウスに持ち替えて、加算ボタンを押すのは面倒です。そこで、入力エディタでEnterが押されたら、加算ボタンを押したのと同じ動作を行うように改造してみます。

そのためには、入力エディタの「キー押した時」という動作を定義すれば良いのです。10行プログラムの最後に以下の行を追加してください。

入力エディタをキー押した時は
  もし、入力エディタの押された仮想キー=13ならば
    加算ボタンのクリックした時。

これは、エディタでキーを押した時に、Enterキー(キー番号13)だったなら、「加算ボタンのクリックした時」を実行するように指定しています。

次の改善ですが、時間を入力する時に、「時:分:秒」とコロン「:」で区切らないといけない点は不便です。なぜなら、テンキーには、「:」がついてないからです。

そこで、「:」の代わりに「.」で区切っても時間を認識するように改造してみます。このためには、加算ボタンをクリックした時のイベントに、「.」を「:」に置換する命令をいれて、以下のように書き換えます。

加算ボタンをクリックした時は~
  入力エディタ=入力エディタの「.」を「:」に置換したもの。
  合計ラベル=合計ラベルに入力エディタを時間加算したもの。
  入力エディタは空。入力エディタに注目。

そして、前節で「時間加算処理」という関数を作って、24時間以上の計算できるようにしましたが、結局、10行プログラムの中では標準命令の「時間加算」を使いました。

これを、「時間加算処理」に対応させるには、以下の2箇所を修正します。1つ目に、関数ファイルを取り込むために、1行目に「取り込む」命令を追加します。

!「時間関数.nako」を取り込む。

それから、6行目にある「時間加算」命令を、「時間加算処理」に書き換えます。これで、だいぶ理想の時間電卓に近づきました。

他にも、アイデア次第でより便利に改造することができると思いますので、ぜひ皆さん自身のアイデアを加えて、使いやすく改造してみください。

84/90

インデックス

連載目次
第90回 10行プログラミング最終回~10行プログラミングを振り返って
第89回 フォルダ一括圧縮
第88回 テキストエディタに貼り付けたExcelの表を見やすく整形する
第87回 一発加算電卓
第86回 ブログにHTMLソースを貼れるよう変換する
第85回 カード式メモ帳
第84回 時間電卓を作る
第83回 アスキーアート地図エディタ
第82回 縦書き風テキスト作成ツール
第81回 Excelシートの比較を行う
第80回 ノルマ計算機
第79回 高速バックアップ
第78回 単語帳に読み上げ機能をつける
第77回 ホームページのバックアップツール
第76回 英単語帳を作成する(その2)
第75回 英単語帳を作成する(その1)
第74回 メモリカード挿入でデータをコピーするツール
第73回 モールス信号ソフトの作成
第72回 フォトCDランチャーを作る
第71回 残暑見舞い作成ツールを作る
第70回 画面キャプチャプログラムを作る
第69回 様々なルールに対応するビンゴシートのプログラムを作る
第68回 ビンゴカードを作る
第67回 ビンゴマシンを作る
第66回 パスワードマネージャの作成
第65回 アンドゥ機能をつける
第64回 テキストの比較ツール~FCフロントエンド
第63回 システム情報クリップ
第62回 飲み会電卓を作る
第61回 バイナリエディタの作成
第60回 メールフッタ作成ツール(その2)
第59回 メールフッタ作成ツール(その1)
第58回 プロセス監視ツールを作成する
第57回 TODOメモを作る
第56回 携帯電話をテキストリーダーに使う(2)
第55回 携帯電話をテキストリーダーに使う(1)
第54回 「オープンソースカンファレンス2006 Tokyo/Spring」に参加しました
第53回 10行でチャットソフトを作る(2)
第52回 10行でチャットソフトを作る(1)
第51回 プレゼンタイマーを作る
第50回 カラーピッカーを作る
第49回 簡単な暗号作成プログラム
第48回 お手軽データベース「SQLite」を使う
第47回 CUI(コマンドライン)環境を拡張する
第46回 デスクトップ画像を記録するプログラム
第45回 市外局番で住所を調べる検索プログラム
第44回 コマンドライン型ランチャーを作る
第43回 文字数カウンタを作る
第42回 日本語でバッチ処理
第41回 イベントドリブンと電光掲示板
第40回 なでしこでWindowsの「送る」メニューを使いやすくする
第39回 同人音楽即売会M3に参加して思ったこと
第38回 画像のサムネイル作成
第37回 なでしことExcelで行事予定カレンダーを作ろう
第36回 なでしことExcelで月間カレンダーを作ろう!
第35回 なでしことExcelで年間カレンダーを作ろう
第34回 急な電話にも安心、意外と便利な「手書きメモ」
第33回 携帯電話のアドレスデータを取り出す
第32回 記念日カウンターを作る
第31回 顔文字入力支援ソフト
第30回 アスキーアートのためのエディタ
第29回 HTTPサーバーを作る
第28回 手紙のあいさつ文を作成するプログラム
第27回 ギターコードの構成音を表示
第26回 音楽の再生スピードを変える
第25回 ミニスライドショーを作る
第24回 撮影日で写真を振り分け
第23回 PSP用テキスト画像の作成
第22回 金種計算
第21回 パスワードを自動生成
第20回 携帯メールでWEBを更新する
第19回 時間の使い方を反省するプログラム
第18回 ウェブを画像でキャプチャ
第17回 ラーメンタイマーを作る
第16回 画像のトリミングツール
第15回 ごみの分別カレンダー
第14回 デスクトップ検索ツール
第13回 フォント見本帳
第12回 セピア調の画像ビューワー
第11回 健康チェック
第10回 10行で壁紙にらくがきする
第9回 WEBサイトの更新チェッカー
第8回 WEBページのリンク切れをチェック その2
第7回 WEBページのリンク切れをチェック
第6回 音楽ファイルの整理 - メディアタグから自動フォルダ分類
第5回 請求書の自動作成・印刷~Word連携技
第4回 重要データのバックアップ術
第3回 10行ニュースリーダーを作ろう!
第2回 なでしことは その2
第1回 なでしことは? その1

もっと見る

人気記事

一覧

イチオシ記事

新着記事