Siv3D こだわりのボタン

この記事は Siv3D Advent Calendar 2016 の記事 (12/13) です.

概要

Siv3D でのゲーム開発などで使う為にこだわりのボタンを作りました.

サンプル

実行結果


Siv3D Button

ソースコード

こだわりポイント

このボタンのこだわりポイントは次の通りです.

見た目と機能の分離

ボタンの見た目は別のクラスで実装するようになっています. 従って, 見た目を容易に変更したり, 画像に合わせた当たり判定を設定したりする事ができます.

イベント駆動

ボタン生成時に, ボタンクリック時に呼び出されるイベントハンドラを設定します. これにより, 1フレーム毎に状態チェックをしなくても, ボタンクリック時に自動的に処理が実行されます.

押し心地

マウスの状態に応じてボタンの状態が変化します. ボタンの状態に応じた描画処理が実行されるので, マウスカーソルを合わせた時にボタンを大きくしたり, ボタンを押下した時にボタンが沈んだり, ボタンを離上した時に元に戻ったりする事ができます. その結果, ボタンの押し心地が良くなります.

ボタンの状態遷移もこだわりました. ボタンのクリックが検出されるには

  1. MOUSE_OVER 状態
  2. PRESSED 状態
  3. RELEASED 状態

の3つの状態を経る必要があります. これにより, 間違って押してしまった場合でも指を離さずにカーソルをボタン領域外まで移動させる事でキャンセルする事ができます.

経緯

以下のゲームを作成する際に, ボタンは私が担当する事になりました.

jumpaku.hatenablog.com

そこで作成したボタンをもっと使い易くこだわったものが今回のボタンです. 詳しいソースコードGitHub で見る事ができます. github.com