初級者のSleipnirスキン作成(完全攻略編・controlsの章・其之3)
Controlsの3回目です。
Controlsの解説予定
- ツールバー
- ステータスバー
- タブ、エクスプローラバー(当ページ)
- Dock、Panel
- メニュー項目、マネージャ、情報バー
- タイトルバー、フレームスキン
- アドレスバー、検索バー、分類不明、書き漏らし
タブ部
タブブラウザであるSleipnirの肝となるタブ部分です。
上下左右に表示が可能なので、上下左右分を作ります。
タブ内容が読みやすくなるようにアクティブ、非アクティブ、未読、既読をskin.iniの[Colors]セクションのタブ関連と組み合わせてください。
タブ上(TabSkin) ― tab.xxx / タブ左(LeftTabSkin) ― tab_left.xxx / タブ下(BottomTabSkin) ― tab_bottom.xxx / タブ右(RightTabSkin) ― tab_right.xxx
タブ部分のスキンです。
サイズは76x19(19x19*4)ピクセルで、左からそれぞれ非アクティブ、アクティブ、非アクティブホバー、アクティブホバーです。
※タブ上を単純にタブ下・左・右にコピーしたり、方向に合わせて回転させたりすればいいでしょう。
タブ上背景(TabBgSkin) ― tab_bg.xxx / タブ左背景(LeftTabBgSkin) ― tab_left_bg.xxx / タブ下背景(BottomTabBgSkin) ― tab_bottom_bg.xxx / タブ右背景(RightTabBgSkin) ― tab_right_bg.xxx
タブ部分の背景のスキンです。
サイズは自由です。多段タブ表示用に背景をグラデーションさせてるスキンも存在します。
タブの背景用スキンの使用方法(TabBgSkinType)
skin_ini_editorではtile/strechの選択肢が表示されますが、実際にはstrechのみ選択が可能みたいです。
タブスクロール(TabScrollSkin) ― tab_scroll.xxx
タブの表示方法をスクロール(1行)にしている時に、表示されるスクロール部分のスキンです。
サイズは180x15(15x15*12)ピクセルで左からそれぞれ「上向き通常、上向きホバー、上向き押下、下向き通常、下向きホバー、下向き押下、左向き通常、左向きホバー、左向き押下、右向き通常、右向きホバー、右向き押下」です。
タブの閉じるボタン(TabCloseSkin) ― tab_close.xxx
Sleipnirオプション＞Dock＞タブ拡張＞「タブバーにアクティブタブを閉じるボタンを表示する」にチェックを入れると表示されるボタンのスキンです。
サイズは30x15(15x15*2)ピクセルで、左からそれぞれ「通常、ホバー」です。
エクスプローラバー部
様々な機能を提供するパネルを開くタブが表示される部分です。
設定していない場合は自動的にタブスキンが呼び出されるので、作ってない場合も多いです。
項目名にエクスプローラバーが含まれているものの一部が登場してないですが、それらはPanel部で解説予定です。
エクスプローラタブ::タブ上(ExplorerBarTab_TabSkin) ― explorerbar_tab.xxx / エクスプローラタブ::タブ左(ExplorerBarTab_LeftTabSkin) ― explorerbar_tab_left.xxx / エクスプローラタブ::タブ下(ExplorerBarTab_BottomTabSkin) ― explorerbar_tab_bottom.xxx / エクスプローラタブ::タブ右(ExplorerBarTab_RightTabSkin) ― explorerbar_tab_right.xxx *1
エクスプローラバー上のタブのスキンです。
サイズは76x19(19x19*4)ピクセルで、左からそれぞれ非アクティブ、アクティブ、非アクティブホバー、アクティブホバーです。
※設定していない場合はタブスキンが自動的に呼ばれ流用されます。(逆は不可)
エクスプローラタブ::タブ上背景(ExplorerBarTab_TabBgSkin) ― explorerbar_tab_bg.xxx / エクスプローラタブ::タブ左背景(ExplorerBarTab_LeftTabBgSkin) ― explorerbar_tab_left_bg.xxx / エクスプローラタブ::タブ下背景(ExplorerBarTab_BottomTabBgSkin) ― explorerbar_tab_bottom_bg.xxx / エクスプローラタブ::タブ右背景(ExplorerBarTab_RightTabBgSkin) ― explorerbar_tab_right_bg.xxx
エクスプローラバーの背景です。
サイズは自由で、並べ方は次の項目の通りtile固定のようです。
※タブ背景とは違いこちらはリバー、ステータスバーに雰囲気を合わせて作るべきでしょう。
エクスプローラバータブ::タブ背景スキンの使用方法(ExplorerBarTabTabBgSkinType)
skin_ini_editorではtile/strechの選択肢が表示されますが、実際にはtileのみ選択が可能みたいです。
