[ CG実習 >  CG実習 課題(2021) >  10進カウンタ ]

[課題02]: 10進カウンタ

課題

次の図で示すような7本のセグメントからなる10進カウンタ(1桁)のプログラムを作成し, そのプログラムを提出して下さい. カウンタのデザインは自由です. プログラムでは,キーあるいはマウスによって,カウントアップとカウントダウンができるようにして下さい. ただし,9の次は0,0の前は9とします(10を法とするカウンタとするわけです). なお,余裕がある場合には,2桁以上のカウンタを作成してみて下さい.
7セグメントカウンタ

上にも書いた通り,カウンタのデザインは自由です. セグメントの形状は必ずしも上図のように6角形である必要はありません. また点灯していないセグメントは,点灯しているセグメントと区別できるように描画してもよいですし,全く描画しなくても構いません.

課題の進め方

課題のプログラムはすべてを完成させてから実行しようとせず,大枠を作ってから細部を仕上げていくようにするとよいと思います. まずは,次のような枠組みから始めるとよいでしょう.以下のプログラムは次のリンクからダウンロードできます.

ファイルをダウンロードするにはリンクを右クリックして「Save Link as」を選んで下さい.ファイル名は必要に応じて変更して下さい. なおダウンロード先は「Home」としてください.


require "opengl"
require "glu"
require "glut"

WSIZE=600

### 描画コールバック ########
display = Proc.new {
  GL.Clear(GL::COLOR_BUFFER_BIT) # 画面のクリア

  # 描画する内容を記述する

  GL.Flush()
}

# キーかマウスを利用してインタラクティブな処理を行うようにします
# (カウンタの増減処理とそれにともなう表示の更新を行います)

### キーボード入力コールバック ########
keyboard = Proc.new { |key,x,y|

  # キーを押したときの動作を記述する
  # 最初からプログラムを終了させるような仕組みだけは入れておいて,
  # そのあと徐々に機能を追加していくとよいでしょう
  if key == 'q'
    exit 0
  end
}

#### マウス入力コールバック ########
mouse = Proc.new { |button,state,x,y|

  # マウスボタンを押したとき,離したときの動作を記述する

}

##############################################
# main
##############################################
GLUT.Init()
GLUT.InitWindowSize(WSIZE,WSIZE) # ウインドウサイズ (適切に設定すること)
GLUT.CreateWindow("Title")       # ウインドウタイトル (適切に設定すること)
GLUT.DisplayFunc(display)        # 描画コールバックの登録
GLUT.KeyboardFunc(keyboard)      # キーボード入力コールバックの登録
GLUT.MouseFunc(mouse)            # マウス入力コールバックの登録
GL.ClearColor(0.4,0.4,1.0,1.0)   # 背景色の設定 (適切に設定すること)
GLUT.MainLoop()


サンプルプログラム

信号機のサンプルプログラム(traffic_signal.rb)を用意しています.ダウンロードすれば実行できます.

$ ruby traffic_signal.rb

課題のプログラムでは,カウンタの状態(現在の値)をキーあるいはマウスで変更して,それに応じてカウンタの表示を変えることになります. このサンプルプログラム(traffic_signal.rb)と同じような処理で実現可能であることが容易に予想できるでしょう.

もう一つサンプルを示します.緑色の円盤をキー入力で動かすようになっています. if式の基本的な使い方とバリエーションを示します.

$ ruby mdisk.rb

セグメントの表示

簡単に横向きあるいは縦向きのセグメントを表示するにはGL.Rectを利用するとよいでしょう. GL.Rectで矩形を一つ描けます(GL.Begin...GL.Endで囲う必要はありません). GL.Rectをうまく組み合わせることで,カウンタ全体を構成することができます.



  # 左上角(x0,y0),右下角(x1,y1)の矩形を描く
  # (x0,y0,x1,y1の値は定義済と仮定する)
  GL.Rect(x0,y0,x1,y1)


GL.Rectの具体的な使い方についてはサンプルプログラム(traffic_signal.rb)を参照して下さい.

もちろんGL.Rect以外の方法でセグメントを描いても構いません. 適当なメソッドを定義してセグメントを描くこともできるでしょう. メソッドについては今後授業で取り上げる予定です. なお参考までに次にメソッドを使ったプログラムの例を示します(このサンプル自体はわざわざメソッドを使わなくてもGL.Rectでも書けます).

基本事項の確認について

ウインドウ上に描画される座標の範囲,色の指定方法, あるいはファイルのダウンロードの方法など,課題に取り組むために必要で, このページで説明していないことについては,これまでの課題のページで確認するようにして下さい.

キーの指定

キー入力イベントではキーの種類を指定して,それぞれに応じた処理を記述します. キーの種類は次のように指定します.

特別なキーの扱い

カーソルキー[↓][↑]やファンクションキー[F1]...[F12],ホームキー[Home]などの通常の文字以外のキー入力はキーボードコールバック(KeyboardFunc)では扱えません(asciiのマニュアルには記載がありません). それらをインタラクションに利用するには,特殊キー用のコールバックを別途作成して,それを「SpecialFunc」として登録します.

マウスボタンの種類と状態の指定

マウスボタンイベントでコールバックに通知されるボタンの種類と状態は次のように表記できます.

左ボタンGLUT::LEFT_BUTTON
右ボタンGLUT::RIGHT_BUTTON
中ボタンGLUT::MIDDLE_BUTTON
押されているGLUT::DOWN
押されてないGLUT::UP

サンプルプログラムも参照してください.

色表

色指定のサンプルを示した表を準備しました.

[ CG実習 >  CG実習 課題(2021) >  10進カウンタ ]