Skip to content

GUI Layout

odashi edited this page Nov 15, 2026 · 1 revision

GUIの配置・入力・ホスト連携

操作ガイド · 描画の構成 · 技術資料

ロゴ右のバージョン表示はPR #109の変更を含みます。

左上ロゴのすぐ右にビルド時のバージョン文字列を右揃えで表示します。先頭をロゴの可視右端から6物理px空け、ベースラインをロゴの文字に揃えます。リリースビルドではタグ名(例: v0.1.0)、バージョン未指定のビルドではdevです。ビルド時の指定方法を参照してください。

外観と描画の構成は金属パネルGUIを参照してください。 選択リストとボタンは、移動量や押下時間にかかわらず、押した要素の内側で離すと確定します。リストの外側で押した場合とEscでは、選択を変えずに閉じます。操作の状態遷移も参照してください。

全118ノブの設定一覧

Integralの操作画面

選択状態 · ノブ操作中

Note・Amp・Filter・EQの見出しは、Osc1/2/3・Eff 1/2/3と同じ小さい薄字のスタイルです。Oscillator・Effectsの大見出しは置かず、全列を上部バーの下に配置します。

上部バーはVol → Pan → Limiter → Resetの順です。Limiterは黒いラバーボタンで、On時には上部の緑色の光バーが点灯します。押下中に移動・長押ししてもボタン内で離せば切り替わり、外側で離すとキャンセルします。LimiterとResetは同じ76.8×38.4pxで隣接させ、その右にピークメーターと発音数インジケーターを置きます。両メーターを304.8×38.4pxの共通LCD面へ収め、表示の高さを各10.8px、段間を7.2px、周囲の余白を4.8pxに揃えます。VolとPanは名前をノブの左に表示し、文字の右端とノブ・目盛りの左端を4.8px空けて揃えます。Vol/Panの操作領域とLimiterの間に24pxの間隔を取ります。上部バーは下の3列と揃え、1列目にIntegral、2列目にVol・Pan・Limiter・Reset、3列目に両インジケーターを収めます。Resetボタンは、音色パラメーター・サンプルレート・テンポを保ったまま、発音中ノート・エンベロープ・発振器位相・位相変調履歴・乱数列・全エフェクト/EQ/Limiterの履歴を初期化します。次のVoice割当は0へ戻ります。GUIはatomicで要求を渡し、次のVST3 process(0サンプルのフラッシュを含む)で初期化します。初期化時にメモリ確保や乱数のシード取得は行いません。

ホストのプラグイン画面に、淡い青灰色のヘアライン金属板を模した操作盤を表示します。全幅の上部にタイトルバーを配置し、Integralと、発音数を示す32枠の点灯インジケーターを表示します。 左のOscillatorセクションにOsc1/2/3を縦にまとめ、その右の422.4px幅の列にNote・Amp・カットオフAHDSRを統合したFilterを上から順に配置し、右端列に3スロットをまとめたEffectsパネルを配置します。EQは左2列の下に横長で配置します。Ampのタイトルは他のパネルと同じ左上位置に固定し、その下にA・H・D・S・R・Sensの6ノブを横一列に均等配置します。上下・行間は標準の9.6pxに揃えます。FilterはF・Res・Amt・Sensを同じ行に並べます。Waveformは各Oscの行見出し、Filterはタイトルの右にドロップダウンを置きます。各エフェクタスロットはタイトル・種類の選択欄・↑/↓の交換ボタンを同じ行に置き、交換ボタンは右端に配置しX座標を3スロットで揃えます。DistortionはClipper選択欄とGain・Mixを同じ行に配置します。Delayは左にStereo方式の選択欄、中央にTime・Fdbkの縦列、右端に共通位置のMixを配置します。内部選択欄は縦方向の中央に置きます。選択欄の直上にタイトルを中央揃えで表示します。Timeは32物理pxの移動で音価を1段階変更します。Timeの各段階に目盛りを表示し、操作中のオーバーレイに音価名を表示します。EQはLow・Mid・Highの順に7ノブを横一列で均等配置します。Osc1/2/3の間は水平線、EQのLow/Mid/Highの間は垂直線で区切り、いずれも上方からの照明に合わせた彫り込み線で表現します。Phase・Clipper・Stereoのタイトルは共通の描画処理で、選択欄の直上に中央揃え・同じ文字サイズ・同じ間隔で表示します。製品ロゴも金属面の彫り込みとして表示します。LCDは黒緑の表示面と薄い金属ベゼル、文字と下向き三角は明るい緑、ボタンは黒いラバーの丸面取りで表現します。 発音数は音量AHDSRのリリース中を含むVoice数です。ユニゾンやOsc1〜3の個数は加算しません。音声ブロック末尾にatomic値を更新し、GUIの既存タイマーで表示へ反映します。処理停止時は0に戻ります。 タイトルバーの発音数インジケータの上に、同じ幅の出力ピークメータを表示します。Master音量適用後の左右最大サンプルピークを−60〜+12 dBFSで表示します。0 dBFSまでの部分は明るい緑、0 dBFSを超えた部分は明るい赤とし、0 dBFSの境界線を示します。描画間のピークを保持し、未点灯部分は暗い緑、周囲は黒緑のガラス面とし、点灯部分に弱い発光を重ねます。表示は48 dB/秒で減衰します。

Osc1にはWaveform・Unison・Detune・Width・Vol、Osc2/3にはWaveform・Tune・Vol・Mod、Noteには共通Phase・Polyphony・Portamento・Pitch、上部バーにはVolume・Pan・Limiter・Resetを配置します。 ノブは行内を均等割りします。ノブ行は76.8px高、外周・グループ間・枠内の左右余白は9.6pxで統一します。左列はタイトルバー直下からOscillator、中央列はNote・Amp・Filterを縦に配置し、EQを左2列の最下段に配置します。Effectsもタイトルバーの下から配置します。見出しの下に残る高さは上余白・行間・下余白へ均等配分します。EffectsはOscillatorと共通の見出し・彫り込み境界で描画し、同じ高さの3スロットを水平の彫り込み線で分けます。Effectsでは全種類のMixを右端中央の同じ位置へ固定し、他のコントロールとの間を共通の縦の彫り込み線で区切ります。縦線の両側に9.6物理pxずつの余白を確保し、左側のコントロールは残りの領域を均等割りします。その他のノブは左側の最大3列・2段へ配置し、行ごとのノブ数に応じて均等割りします。Chorusは遅延設定とLFO設定、Compressorは圧縮特性と時間・補正ゲインを同じ行にまとめます。Reverbは左側のSize・Dec・Dampを等間隔に並べます。EffectsはEQと下端を揃えます。見出し行とドロップダウンは33.6px高です。 ノブは直径約48.6pxの銀面と黒い外周の二段構造です。銀面は旋盤加工の放射状反射と面取り、黒い外周は下方向の落ち影で立体感を示します。黒い針と緑色の発光弧で現在値を表示し、ノブ名と目盛りは濃い青黒で揃えます。下部の省略名A/H/D/S/R・Uni・Det・Poly・Vol・F・Res・Amtは影から離して配置します。 Waveform・Filter・Phase・EQ On/Off・エフェクト種類・Clipper・DelayのStereo方式はドロップダウンで選択します。リストは全選択肢が収まる高さとし、スクロールバーを表示しません。数値とDelayの音価はノブで操作します。機能を無効にする選択肢は「Off」に統一します。エフェクタ一覧はOffを先頭とし、各エフェクト名をアルファベット順に並べます。スロットがOffのときは種類選択と右端の交換ボタンを通常表示し、中央にロゴ、右側に0位置のMixと区切り線を表示し、見出しとともに画面背景へ50%で合成します。このMixは表示専用で、保存済みの値を変更しません。Filter・EQがOffのときは種類の選択リストを通常表示し、見出し・ノブ・ラベル・彫り込み線を画面背景と50%で合成します。Filter・EQのノブはOff中も編集でき、操作中の値は通常のオーバーレイで表示します。ノブの円弧と目盛りが設定位置を示し、Cutoff・Tune・Cutoff Amount・Pan・EQ Gainの円弧はゼロ、Reverb Sizeは100%を起点に伸びます。Volumeの円弧は無音を起点に伸びます。 ノブを左ボタンで押し、上へ動かすと増加、下へ動かすと減少します。1tickに必要な移動量は、Cutoff・Resonance・Cutoff Amount・各Volが2物理px、時間(A/H/D/R/Porta)・Tune・Distortion Gainが3物理px、その他が4物理pxです。Uniは32物理px、Polyは8物理pxです。各エフェクトのノブは専用の感度を持ち、KNOB_PIXELS_PER_TICKで定義します。1tick未満の移動量は次の操作へ持ち越します。吸着中は0〜80物理pxの内部位置を保持します。小さい値側から進入したら0、大きい値側から進入したら80、吸着点からドラッグを開始したら40に初期化します。増加方向で80へ到達すると大きい側、減少方向で0へ到達すると小さい側へ抜けます。進入直後に方向を戻すと、その側へすぐ抜けます。最大・最小値は通常動作です。吸着対象はCutoff・Tune・Cutoff Amountの1200 cent刻み、Master・Osc1/2/3のVolの6 dB刻み、Panの中央、EQ Low/Mid/High GainとCompressor Makeupの6 dB刻みです。上下どちらにも適用し、大きな移動でも途中の吸着値で必要な距離を消費します。 目盛り位置はsrc/editor.rsのknob_marksでノブごとに整数tickとして定義し、吸着も同じ定義を参照します。ガイド線を省き、目盛りだけを描きます。中立値と両端は同じ色の長い線で示し、目盛り位置の円周に沿った間隔を6物理px以上に保ちます。初期値だけを理由に強調しません。

ノブ 目盛りの値 内側の長い目盛
A / H / D / R / Porta 0 / 10 / 100 / 1000 / 10000 ms —
S 0 / 0.25 / 0.5 / 0.75 / 1 —
Uni 1〜7の各整数 —
Poly 1 / 8 / 16 / 24 / 32 —
Det / Width / Mix / Sens 0〜100、25刻み —
F / Amt / Tune 1200 cent(1 oct)刻み 0 cent
Pitch 0〜1200 cent、100 cent刻み —
Res Q = 0.5 / 1 / 2 / 5 / 10 —
Vol −∞と−54〜+12 dBの6 dB刻み 0 dB
Distortion Gain / Compressor Threshold 6 dB刻み —
EQ Low G / Mid G / High G −18〜+18 dBの6 dB刻み 0 dB
Pan −100 / −50 / 0 / 50 / 100 % 0 %
Mod 0 / 50 / 100 / 150 / 200 % —

周波数・秒・Qの目盛は1・2・5系列を基本とします。EQ Frequency、Reverb Damping、Phaser Center、EQ Mid Q、Reverb Decayでは、目盛と初期値を正確に選べる少数の整数tick対応点を定義し、その間を対数補間します。GUIは同じ対応表を双方向に使用します。全33規則の範囲・目盛・吸着・操作量と換算式・対応表を参照してください。

操作中はカーソルを隠して移動のたびに基準位置へ戻し、ノブの中央直上に「正式名称」「現在値」を中央揃えの2行で表示します。上側に収まらない上部のVol・Panではノブの中央直下へ表示します。オーバーレイは全パラメーター共通の268.8×72 pxとし、操作中のノブに重ならず、枠全体が画面内に収まるよう位置を補正します。 Unison・Polyphonyは整数、連続パラメーターは小数点以下最大3桁と単位を表示し、末尾の不要なゼロは省略します。 ボタン解放・Esc・フォーカス喪失・画面終了で調整を終了します。Escでも調整済みの値は保持します。 Windowsではノブ操作の開始・終了でキーボードフォーカスを変更せず、ホストの入力先を維持します。既存の16msタイマーでEsc・フォーカス変更・マウスキャプチャの解除を検出して操作を終了します。Linuxでは終了時にプラグインが保持しているフォーカスをホストの親へ戻します。 時間・音量などへの換算は整数tickから行い、各パラメーターの刻み幅は上記の仕様に従います。 選択肢・単位・整数tickの換算はsrc/parameters.rsで定義し、GUIとVST3 Controllerが共用します。 VST3の IPlugView を直接実装し、WindowsではHWND、LinuxではX11EmbedWindowIDへ埋め込みます。 Linuxではホストが IPlugFrame 経由で Linux::IRunLoop を提供する必要があります。Waylandへの直接埋め込みは未対応です。 サイズは1076×768物理ピクセルで固定です。タイトルバーは67.2px高、EQは左2列の下段に配置しています。標準フォントとセクション見出しは19.2pxです。上部の製品ロゴとOffスロットのロゴは、1pxの陰影を保つよう物理ピクセル等倍で表示します。 python3 scripts/check-abi.py --guiでは、実ウィンドウを撮影した通常画面・選択状態・操作中・発音中の画像をtarget/gui-panel.png、target/gui-choices.png、target/gui-overlay.png、target/gui-voices.pngへ保存します。 Windowsでは、描画中に再描画と編集配送タイマーを意図的に再入させ、描画の延期と、描画終了後の編集通知を検証します。 画面作成・描画・破棄と作成失敗時に、ホストのOpenGLコンテキストと描画先が復元されることも検証します。

描画にはegui 0.37.0、egui_glow 0.37.0、baseview 0.4.2のOpenGLバックエンドを使用します。 Windowsでは同じUIスレッドで使われるホストのOpenGLコンテキストと描画先を保存し、GUI処理後に復元します。 対応ドライバーがあれば内蔵GPU・外付けGPUを使います。音声処理はCPUで行います。 ソフトウェアOpenGLでも動作検証していますが、ソフトウェアドライバーはバンドルへ同梱しません。 描画環境を初期化できない場合は画面の取り付けに失敗し、ホストのパラメーター操作と音声処理は引き続き使用できます。

GUIの操作はUI専用の32件キューからホストのUIスレッドへ配送し、 IComponentHandler::beginEdit / performEdit / endEdit を順に通知します。 ノブはドラッグ全体で一つの編集とし、32件のうち1件を終了通知用に予約します。 値変更のキューが満杯なら途中の更新を破棄し、終了時に最終値を通知します。 カーソルの復帰はホストへの編集終了通知より先に行います。 DSPへの適用は従来どおりホストの変更キュー経由です。ホストからの値更新や状態復元は表示へ反映し、編集通知を送り返しません。 Windowsはbaseviewの子ウィンドウのタイマー、LinuxはVST3のIRunLoopから編集を配送します。 画面を閉じるとタイマーと描画資源を解放し、音声処理は継続します。

Clone this wiki locally