プリセットは3つをまとめて束ねたものだ。空のままにした項目はデフォルトに落ちる。
| 層 | 決めるもの | 変え方 |
|---|---|---|
Theme |
色、サイズ、文字の大きさ、そしてエンジンが描くものすべての形 — ボタンのパネル、入力欄、タブ、トグルの絵 | .tres を書くか、tools/make_theme.py で生成する |
GoSkin |
コードが描くものすべての形 — スティック、クイックスロットの面、コーチマークのリング、チップ、スケルトン、区切り線、セクション見出し | 継承して、気にするメソッドだけを上書きする |
GoIconSet |
名前で引くアイコン — デフォルトの84枚、あるいはその上に重ねる中世セットの彫刻風16枚。テクスチャパックでもアイコンフォントでもよく、呼び出すコードはどちらでも同じだ | セットを丸ごと渡すか、いくつかの名前だけ差し替える |
StyleBoxFlat が持つ角は丸だけだ —
半径を 0 にすれば直角になるが、その中間は存在しない。斜めに切り落とした角、1辺だけ太い縁、外へにじむ発光。
エンジンはそのどれも描かない。しかもスティックとコーチマークは _draw() の中で描かれており、
テーマはそこへ届かない。
選ぶ
GoUi.use_preset(GoThemePresets.SCIFI_DARK)この1行でテーマ・スキン・アイコンが入れ替わる。エディタからは
プロジェクト設定 → Gohud → Theme → Preset、設定リソースからは GoConfig.preset で指定する。
1つだけ自分のものを使う
GoUi.use_preset(GoThemePresets.SCIFI_DARK)
GoUi.config.icons = my_icons # アイコンだけ自前、ほかはプリセットのままtheme・skin・icons を明示的に設定すると、プリセットより優先される。
組み込みの14プリセット
| プリセット | パネル | スキン · アイコン |
|---|---|---|
default_dark · default_light | 段階的な影を持つ丸い StyleBoxFlat のパネル。主ボタンは押すと沈み、離すと持ち上がる | GoSkin · デフォルトアイコン84種 |
scifi_dark · scifi_light | ネオンの縁と発光を持つ面取りの GoStyleBoxCut パネル。フォーカス印は GoStyleBoxBracket | GoSkinSciFi — 六角形のスティック · デフォルトアイコン |
medieval_dark · medieval_light | 鍛造した GoStyleBoxMedieval の枠 — 鉄と革、あるいは羊皮紙 — にリベットと角飾りをメニューだけへ | GoSkinMedieval · デフォルトの上に彫刻風16種 |
material_light · material_dark 新登場 | アプリ画面向けの Material 3 Expressive — 48dp のタッチ領域に 40dp のピル型ボタン、28dp のダイアログ、塗りのカード、アウトラインの入力欄、Expressive のスライダー。アプリ部品(ナビゲーションバー・アプリバー・FAB・検索バー・チップ・進捗・日付選択)は M3 のコンポーネントトークンに従う | GoSkinMaterial · デフォルトのアイコン |
kids_light · kids_dark 新登場 | 子ども向け — おもちゃ箱：太い縁取りと、押すと沈むしっかりした段のあるキー、くぼんだ入力欄、泡のタブ、ゼリーのバー、部品ごとに違うクレヨンの色、キャンディのクイックスロット、ステッカーのバッジ、虹色のジョイスティックとクレヨン色のチャート。サイズとプロジェクトのフォントはそのまま。 | GoSkinKids · デフォルトのアイコン |
arcade_light · arcade_dark 新登場 | GoStyleBoxArcade が描くアーケード筐体：どのキーも上から下へのグラデーション、白い光沢、押すと沈む段で塗られて紺色のインクの輪郭に収まり、ラベルはインクで縁取った白い文字 — プライマリは緑、キーは青、危険は赤、小さなキーはラベンダー色。ボードは淡い内側を色の枠で囲んだ厚いもので、ウィンドウには金色のタイトルバナーと丸い赤の閉じるキー。 | GoSkinArcade · デフォルトのアイコン |
comic_light · comic_dark 新登場 | GoStyleBoxComic が描くマンガのコマ：どの面にも太いインクの輪郭とくっきりした影があり、面を押すと影が消える。インクで描いたトグル、チェックボックス、スライダーのつまみ、ウィンドウには黄色のタイトルキャプション。輪郭の太さ、影の大きさ、影を出すかどうかは GoConfig の設定だ。 | GoSkinComic · デフォルトのアイコン |
14種類を並べて
プリセット名だけを変えた同じギャラリー画面だ — ウィジェットのコードは1行も違わない。 どれも縦に持ったスマホ、390×844 だ。
default_dark
default_light
scifi_dark
scifi_light
medieval_dark
medieval_light
material_light
material_dark
kids_light
kids_dark
comic_light
comic_dark
arcade_light
arcade_dark中世 — 鉄、革、そして羊皮紙
medieval_dark は暗い鉄と革にアンティークゴールドを合わせる。medieval_light
は羊皮紙とインクを使う。どちらも GoSkinMedieval と既存のウィジェット、そして彫刻の描き込みを入れた
オリジナルアイコン16種を使う。ナビゲーション用のアイコンは元のセットに落ちる。
GoUi.use_preset(GoThemePresets.MEDIEVAL_DARK)
# または: GoUi.use_preset(GoThemePresets.MEDIEVAL_LIGHT)プリセットは UI を作る前に選ぶ。GoConfig.theme・skin・icons を
明示的に指定した場合は、そちらが優先されたままだ。
res://addons/gohud/examples/medieval/medieval.tscn を開いて F6 を押せば、動くキャラクターシート・
雑嚢・クエストジャーナルが見られる。ボタンでバリアントを切り替え、アイテムの詳細を開ける。
メニューの枠にはリベットと小さな角飾りがあり、常に見えている HUD は縁を静かに保つ。
体力・マナ・スタミナは赤・青・オリーブで塗る。Cinzel はタイトルとサブタイトルに限って使い、
本文はホスト側またはデフォルトのフォントのままだ。同梱フォントのライセンスは
assets/fonts/cinzel/OFL.txt にある。
彫刻セットが描き直すのは bag、book、box、coin、crown、
flag、heart、key、map、potion、shield、
star、sword、user で、さらに scroll と seal を足す。
それ以外の名前はデフォルトセットに落ちるので、close や settings はどのプリセットでも
同じ絵のままだ。Cinzel が持つのはラテン文字なので、各言語の見出しには shape.fonts から
専用のフォントを与える。
DPITexture としてインポートされること。実物のクイックスロットがスキンを使うこと。
複製したスキンのダイヤルを変えると、プリセットに触れずにスロットへ届くこと。そして戻したときに、
デフォルトと SF のジオメトリが復元されること。
自分だけの王国を作る
python3 addons/gohud/tools/new_theme.py kingdom --from medieval_dark
# themes/palettes/kingdom.json を編集してから:
python3 addons/gohud/tools/make_theme.py kingdom
godot --headless --path . --import
# GDScript では、ウィジェットを作る前に:
GoUi.use_preset(&"kingdom")JSON テーマは別の JSON テーマを継承できる。書かなかった値は親の設定をそのまま保ち、 循環する継承は拒否される。生成されたプリセットは親のアイコンセットを引き継ぐ。
| 設定 | 効果 |
|---|---|
shape.material | 0: 鉄 · 1: 革 · 2: 羊皮紙。表面の模様を決める。 |
shape.grain_alpha | 質感の不透明度。0 にすると無地の面になる。 |
shape.ornament_scale · shape.bevel_strength | メニューの角飾りの大きさと、ベベルのハイライトの強さ。 |
shape.fonts | title・subtitle・caption・body・button の役割を、アドオン内の res:// フォントファイルへ割り当てる。書かなかった役割は継承したフォントのままだ。 |
skin.dials | クイックスロットの角丸、リベットの表示、質感、ハイライト。ダイヤルの全一覧は下の表にある。 |
Material 3 — アプリ画面のための見た目 新登場
material_light と material_dark は Material 3 Expressive を gohud に持ち込む — M3 コンポーネントの
形・大きさ・文字組みを、すべての数値を公式の M3 トークンセット（material-web、
tokens/versions/latest）から読んで再現した。ゲームのメニューよりもアプリらしく見せたい画面に使う：
ショップ、受信箱、アカウントや設定のページ、ランキング、コンパニオンアプリ。
GoUi.use_preset(GoThemePresets.MATERIAL_LIGHT)
# または: GoUi.use_preset(GoThemePresets.MATERIAL_DARK)material_lightmaterial_dark
GoDialogs · material_light
GoDialogs · material_dark変わるもの
| 部分 | Material 3 では |
|---|---|
| ボタン | ピル型（角は完全な丸）。下地は高さ 40dp で 48dp のタッチ領域の中央に置かれるので、押せる範囲は狭まらない。compact ボタンの下地は 32dp。ラベルはウェイト 500 の Roboto だ。 |
| ダイアログとシート | 28dp の角（extra-large）、24dp の内側余白、24sp の見出し — GoDialogs、GoSurface、GoSheet、そしてその上に作られたすべてのポップアップ。 |
| カード | 12dp の角と 16dp の内側余白を持つ塗りのカード。 |
| 入力欄とスライダー | アウトラインのテキスト入力欄。背の高いハンドルを持つ Expressive のスライダー。 |
| チップとセグメント選択 | 8dp の角（small）。 |
| アプリ部品 | GoNavBar、GoAppBar、GoFab、GoSearchBar、チップ、GoProgress、GoDatePicker は M3 のコンポーネントトークンに従う。 |
| 文字 | タイトル、サブタイトル、キャプション、ボタンには同梱の Roboto を使う。本文はプロジェクトのフォントのままなので、韓国語・日本語・中国語・アラビア語もそのまま描ける。 |
| 不透明度 | すべてのパネルが不透明だ — M3 のサーフェスはベタ塗りだからだ。（デフォルト、SF、中世のパネルは不透明度80%なので、ゲームが透けて見える。） |
| スキン | GoSkinMaterial：ドロワーは M3 のモーダルサイドシート、コンソールの面は M3 のフローティングツールバーで、バナーは surface_container_low の上に載る。 |
tools/check_contrast.py は、この2つの見た目もほかのすべてと同じように測る。
Roboto は SIL Open Font License 1.1（assets/fonts/roboto/OFL.txt）で提供されており、Material
プリセットだけが使う。
キッズ — おもちゃ箱 新登場
kids_light（クリームとピーチの地にぶどう色のプライマリ）と kids_dark（ブルーベリーの地、
お日さま色のプライマリ、ミントのピル）は、子ども向けのゲームや学習アプリのために作った見た目だ — ぽってりして、明るくて、
ぷにぷにで、小さな指が思わず押したくなるもの。
GoUi.use_preset(&"kids_light")
# または: GoUi.use_preset(&"kids_dark")kids_lightkids_dark
GoDialogs · kids_light
GoDialogs · kids_dark変わるもの
| 部分 | キッズの見た目では |
|---|---|
| すべての面 | GoStyleBoxJelly が描くゼリーキャンディ：太い縁取り、押せるものすべての下にあるしっかりした段、上が明るく下が濃い本体、左上の白いつや。キー、リストの行、折りたたみの見出し、入力欄、バー、スライダー、パネルがみなこれをまとう。 |
| 押したとき | 段が消えて面がその位置へ沈み、続いてゼリーのようにぷにっとつぶれる — 一瞬横に広く平たくなり、弾むように戻る。gohud が作るすべてのボタンで動き、reduce_motion で止まる。 |
| 入力欄、タブ、バー | テキスト入力欄は同じゼリーを内側に返したもの — くぼんだ井戸だ。タブは泡、バーにはゼリーのつやがある。 |
| 色 | 部品の種類ごとに自分のクレヨンの色をまとう。ほかのすべての見た目と同じ生成器が選ぶので、コントラストの関門はすべて通ったままだ。 |
| ウィンドウ | ウィンドウのタイトルの後ろにお日さま色のリボン（夜はミント）— タイトルは1行に収まるよう15まで縮む — と、危険のクレヨン色に白い×を描いた丸いキャンディの閉じるボタン。 |
| スキンの部品 | GoSkinKids：クイックスロットはクールダウン中に沈むキャンディのブロック、バッジはステッカー、チップとナビゲーションのピルは小さなゼリー、アバターは丸いキャンディ、スティックは虹色、チャートはクレヨン、アラートと通知はしっかりした縁のステッカーメモだ。 |
| 不透明度 | パネル、カード、通知、ポップアップは不透明だ。 |
自分だけのおもちゃ箱を作る
python3 addons/gohud/tools/new_theme.py candy --from kids_light
# themes/palettes/candy.json を編集してから:
python3 addons/gohud/tools/make_theme.py candy
GoUi.use_preset(&"candy")コミック — 太いインク 新登場
comic_light（紙のようなクリーム色のページに白いパネル、コバルトのプライマリ）と comic_dark（夜のページに
スレート色のパネル、クリーム色の輪郭、黄色のプライマリ）は、どの面もマンガのコマのように描く — 太いインクの輪郭の後ろに
くっきりした影を落とす。
GoUi.use_preset(&"comic_light")
# または: GoUi.use_preset(&"comic_dark")comic_lightcomic_dark
GoDialogs · comic_light
GoDialogs · comic_dark変わるもの
| 部分 | コミックの見た目では |
|---|---|
| すべての面 | GoStyleBoxComic が描く：インク色の太い輪郭の中に表面の色を塗り、右下へくっきりした影を落とす。キー、リストの行、入力欄、タブ、バー、スライダー、パネル、ポップアップがみなこれをまとう。 |
| 押したとき | 影が消えて、面がその位置へ沈む。 |
| コントロール | トグル、チェックボックス、ラジオボタン、スライダーのつまみもインクで描かれ、それぞれに小さな影が付く。 |
| ウィンドウ | ウィンドウのタイトルの後ろに黄色のキャプションと、インクで描いた丸い閉じるボタン。 |
| スキンの部品 | GoSkinComic：クイックスロット、チップ、バッジ、アバター、通知、ナビゲーションバー、FAB、日付のセルがインクで描かれ、スティックのノブは影を落とし、チャートは太い原色を使う。 |
| 不透明度 | パネル、カード、通知、ポップアップは不透明だ。HUD カードは 92% 不透明。 |
インクと影の設定
GoConfig の3つの設定が、すべてのコミックの面を一度に変える。作り直すものは何もない — 値を入れたそばから画面が描き直される。
GoUi.config.comic_border_width = 2.0 # 輪郭 (dp) — 既定は 3
GoUi.config.comic_shadow_size = 6.0 # 影 (dp) — 既定は 4
GoUi.config.comic_shadow = false # どこにも影を出さないウィジェット1つだけなら、設定に関係なく独自の道を行ける：
GoStyle.comic_shadow(skip_button, false) # このボタンは平らに
GoStyle.comic_shadow(card, true, true) # このカードとその中身すべては影を保つ
GoStyle.comic_border(title, 5.0) # これだけ輪郭を太く
自分だけのコミックを作る
python3 addons/gohud/tools/new_theme.py inked --from comic_light
# themes/palettes/inked.json を編集してから:
python3 addons/gohud/tools/make_theme.py inked
GoUi.use_preset(&"inked")アーケード：塗られたキーと厚いボード 新登場
arcade_light（空色のページに白いボード）と arcade_dark（夜のページに紺色のボード）は、
どの画面もアーケード筐体のように仕立てる：どのキーも塗られている — 上が明るく下へいくほど深くなるグラデーション、
白い光沢のひと筋、押すと沈む段を紺色のインクの輪郭に収める — そしてどのボードも厚い。淡い内側を
色の枠が囲む。
GoUi.use_preset(&"arcade_light")
# または: GoUi.use_preset(&"arcade_dark")arcade_lightarcade_dark
GoDialogs · arcade_light
GoDialogs · arcade_dark変わるもの
| 部分 | アーケードの見た目では |
|---|---|
| キー | GoStyleBoxArcade が描く：グラデーションの本体、左上の角を回り込む白い光沢、より深い色の段、紺色のインクの輪郭。プライマリキーは緑、普通のキーと選ばれたタブは青、危険なキーはコーラル色と赤、小さなキーとほかのタブはラベンダー色だ。 |
| ラベル | 塗られたキーにはどれも、インクで縁取った白い文字。どの塗りも、そのラベルがグラデーションのどの高さでも読めるまで調整される — WCAG と同じく縁取りを文字の一部として数え、4.6:1 以上。 |
| 押したとき | 段が消え、キーがその位置へ沈んで、また跳ね返る。 |
| ボード | パネル、カード、HUD カード、ポップアップは厚い：自分の光沢と段を持つ色の枠（ウィンドウは 6dp、カードと HUD カードは 4、メニューと通知は 3）が、インクの線で縁取った淡い内側を囲む。これを収めるために内側余白が少し広がるので、文字が枠に触れることはない。 |
| 入力欄とバー | 入力欄とバーの溝はくぼんだ内側だ。バーの塗りは、その色の明るい塗り色で塗った光沢のあるチューブ。 |
| ウィンドウ | インクで縁取った白いタイトルを載せた金色のバナーと、白い×の入った丸い赤の閉じるキー。 |
| スキンの部品 | GoSkinArcade：クイックスロットとチップはキーキャップで、クールダウン中のスロットには金の縁が灯り、バッジは明るいプレート、アラートは自分の色の枠で囲まれ、選ばれたカードには金の縁が灯る。FAB は金色のキー、スティックは4つの矢印の付いた光沢のあるパッドだ。 |
| 不透明度 | パネル、カード、通知、ポップアップは不透明だ。HUD カードは 94% 不透明。 |
キー1つを自分の色で塗る
テーマはキーを種類ごとに塗る。キーごとに自分の色を持たせたいメニューは、1つずつ塗ればいい — ホバーの面は少し明るく、 押した面は少し深くなり、無効の面はくすんだままだ：
menu.add_child(GoStyle.arcade_paint(GoStyle.button("Resume", _resume, GoStyle.Tone.PRIMARY), Color("#4ACB3E")))
menu.add_child(GoStyle.arcade_paint(GoStyle.button("Shop", _shop), Color("#FF8A1E")))
GoStyle.arcade_paint(stage_card, Color("#E3343D"), true) # ボードの枠と、その中のすべてのキーarcade_paint() は何もしない。
自分だけのアーケードを作る
python3 addons/gohud/tools/new_theme.py cabinet --from arcade_light
# themes/palettes/cabinet.json を編集 — *_vivid の色が塗りの色だ — してから:
python3 addons/gohud/tools/make_theme.py cabinet
GoUi.use_preset(&"cabinet")