初級者のSleipnirスキン作成(完全攻略編・controlsの章・其之6)
Controlsの6回目です。
Controlsの解説予定
- ツールバー
- ステータスバー
- タブ、エクスプローラバー
- Dock、Panel
- メニュー項目、マネージャ、情報バー
- タイトルバー、フレームスキン(当ページ)
- アドレスバー、検索バー、分類不明、書き漏らし
タイトルバー部、フレームスキン部
タイトルおよびフレーム部分を彩るスキンです。
ほとんどの項目を設定しないとスキンが適用されないので、注意が必要です。
タイトルバー::背景(TitleBarSkin) ― caption.xxx
サイズは特に決まっていません。
タイトルバー部の主要部分です。
タイトルバー::スキンの描画方法(TitleBarSkinType)
tile/strechを選択できます。
タイトルバー::閉じるボタン(TitleBarCloseButtonSkin) ― sys_cls.xxx
Sleipnirを閉じるボタンです。
サイズは決まってませんが、左から通常、ホバー、押下、非アクティブ、無効を作ってください。
タイトルバー::元に戻すボタン(TitleBarRestoreButtonSkin) ― sys_res.xxx
Sleipnirのウィンドウサイズをウィンドウ状に戻すボタンで、最大化状態で表示されます。
ウィンドウの状態で最大化ボタンと元に戻すボタンが入れ替わります。
サイズは決まってませんが、左から通常、ホバー、押下、非アクティブ、無効を作ってください。
※デザインの関係上"タイトルバー::最大化ボタン(TitleBarMaximizeButtonSkin)"とは同じサイズで作りましょう。
タイトルバー::最大化ボタン(TitleBarMaximizeButtonSkin) ― sys_max.xxx
Sleipnirのウィンドウサイズを最大化するボタンで、ウィンドウ状態で表示されます。
ウィンドウの状態で最大化ボタンと元に戻すボタンが入れ替わります。
サイズは決まってませんが、左から通常、ホバー、押下、非アクティブ、無効を作ってください。
※デザインの関係上"タイトルバー::元に戻すボタン(TitleBarRestoreButtonSkin)"とは同じサイズで作りましょう。
タイトルバー::最小化ボタン(TitleBarMinimizeButtonSkin) ― sys_min.xxx
Sleipnirのウィンドウを最小化するボタンです。
サイズは決まってませんが、左から通常、ホバー、押下、非アクティブ、無効を作ってください。
タイトルバー::閉じるボタンの描画開始横位置(右側からのオフセット)(TitleBarCloseButtonX)
閉じるボタンのX軸側の位置を数値で指定します。一般的には負の値を指定してください。
※skin_ini_editorでは"-(マイナス記号)"が指定できないので、テキストエディタで編集してください。
※この項目は指定せずともフレームスキンが反映されますが、ボタンが表示されなくなるので基本的には設定しましょう。
タイトルバー::閉じるボタンの描画開始縦位置(上側からのオフセット)(TitleBarCloseButtonY)
閉じるボタンのY軸側の位置を数値で指定します。
※この項目は指定せずともフレームスキンが反映されますが、ボタンが表示されなくなるので基本的には設定しましょう。
タイトルバー::最大化・元に戻すボタンの描画開始横位置(右側からのオフセット)(TitleBarMaximizeRestoreButtonX)
最大化・元に戻すボタンのX軸側の位置を数値で指定します。一般的には負の値を指定してください。
※skin_ini_editorでは"-(マイナス記号)"が指定できないので、テキストエディタで編集してください。
※この項目は指定せずともフレームスキンが反映されますが、ボタンが表示されなくなるので基本的には設定しましょう。
タイトルバー::最大化・元に戻すボタンの描画開始縦位置(上側からのオフセット)(TitleBarMaximizeRestoreButtonY)
最大化・元に戻すボタンのY軸側の位置を数値で指定します。
※この項目は指定せずともフレームスキンが反映されますが、ボタンが表示されなくなるので基本的には設定しましょう。
タイトルバー::最小化ボタンの描画開始横位置(右側からのオフセット)(TitleBarMinimizeButtonX)
最小化ボタンのX軸側の位置を数値で指定します。一般的には負の値を指定してください。
※skin_ini_editorでは"-(マイナス記号)"が指定できないので、テキストエディタで編集してください。
※この項目は指定せずともフレームスキンが反映されますが、ボタンが表示されなくなるので基本的には設定しましょう。
タイトルバー::最小化ボタンの描画開始縦位置(上側からのオフセット)(TitleBarMinimizeButtonY)
最小化ボタンのY軸側の位置を数値で指定します。
※この項目は指定せずともフレームスキンが反映されますが、ボタンが表示されなくなるので基本的には設定しましょう。
タイトルバー::テキストの描画開始位置(左上)(左端からの横距離。0 のときは自動計算)(TitleBarTextX)
タイトルテキストのX軸側の位置を数値で指定します。
※この項目は指定せずともフレームスキンが反映されます。
-35くらいを指定しておくとタイトルテキストの「Sleipnir - 」がずれて見えにくくなって面白いかもしれませんｗ
タイトルバー::テキストの描画開始位置(左上)(上端からの縦距離。0 のときは自動計算)(TitleBarTextY)
タイトルテキストのY軸側の位置を数値で指定します。
※この項目は指定せずともフレームスキンが反映されます。
フレーム::スキンの描画方法(FrameSkinType)
tile/strechを選択できます。
フレーム::上部(FrameTopSkin) ― topcenter.xxx
サイズは決まってませんが、左からアクティブ、非アクティブを作ってください。
ウィンドウの天辺の部分です。
フレーム::右上部(FrameTopRightSkin) ― topright.xxx
サイズは決まってませんが、左からアクティブ、非アクティブを作ってください。
※高さは"タイトルバー::背景(TitleBarSkin)"、"フレーム::上部(FrameTopSkin)"それぞれの高さを足した値を指定しましょう。
フレーム::左上部(FrameTopLeftSkin) ― topleft.xxx
サイズは決まってませんが、左からアクティブ、非アクティブを作ってください。
※高さは"タイトルバー::背景(TitleBarSkin)"、"フレーム::上部(FrameTopSkin)"それぞれの高さを足した値を指定しましょう。
フレーム::下部(FrameBottomSkin) ― bottomcenter.xxx
サイズは決まってませんが、左からアクティブ、非アクティブを作ってください。
フレーム::右下部(FrameBottomRightSkin) ― bottomright.xxx
サイズは決まってませんが、左からアクティブ、非アクティブを作ってください。
フレーム::左下部(FrameBottomLeftSkin) ― bottomleft.xxx
サイズは決まってませんが、左からアクティブ、非アクティブを作ってください。
フレーム::右部(FrameRightSkin) ― middleright.xxx
サイズは決まってませんが、左からアクティブ、非アクティブを作ってください。
フレーム::左部(FrameLeftSkin) ― middleleft.xxx
サイズは決まってませんが、左からアクティブ、非アクティブを作ってください。
今回のまとめ
タイトルバー・フレームスキンを使うとWinows標準タイトルバーから大幅に見た目が変わります。
リバーと同色で作っておけば単純ですがスキンの雰囲気を壊さないので是非作っておきましょう。
また、余力があればデザインセンスに富んだものを作ると良いでしょう。
