メインバーのスキン その3
前回の続きです。Fill Background Vertical rule/Fill Background Horizontal rule
背景画像の描画方法を以下のメニューから選択します。背景画像の描画方法について
状態パネルの大きさと背景画像の大きさが合わない場合、メニューで選択された方法で背景画像の描画を調整します。この時、「マージン」で指定された部分は、この設定で指定する描画方法の対象外になります。
例えば各マージンに「4」を指定した場合、背景画像のおおよそ周囲4ピクセルはボーダー(枠)として扱われ、余白を描画するのに利用されます。
余白の描画は状態パネルの大きさに応じて自動的に拡大縮小が行われます。
従って、背景画像のボーダー部分を除外した部分がここでの設定の対象になります。
こうすることで、ボーダー部分の拡縮による歪みを軽減しています。
もしボーダー部分が歪む場合は、画像のボーダー部分を小さくすると良いでしょう。
ちなみに、PNGのアルファチャンネルを考慮した描画を行うため、アルファチャンネルで指定した透過度が反映されます。
Fill Background Vertical rule
背景画像の縦方向の描画方法を指定します。Fill Background Horizontal rule
背景画像の横方向の描画方法を指定します。コピー
状態パネルの余白部分を除いた領域が全て埋まるように、繰り返し背景画像が描画されます。リサイズ
状態パネルの余白部分を除いた領域が全て埋まるように、背景画像が拡大縮小され描画されます。Fill Background Vertical rule/Fill Background Horizontal ruleの例
「Fill Background Vertical rule」と「Fill Background Horizontal rule」の使用例です。例で使用する背景画像について
背景画像は以下の画像を用意しました。見やすくするため、この背景画像は拡大して表示しています。
実際の画像サイズは、24x24ピクセルです。
使用したの背景画像
例に使用した背景画像は以下の画像です。ボーダーについて
画像の黒の部分はボーダーとして使用する部分です。黒の部分のサイズは画像の上下左右の端から4ピクセルになります。
例で指定しているマージンについて
例で指定している「マージン」は、すべて「4」です。コピーの例
ここでは、「Fill Background Vertical rule」と「Fill Background Horizontal rule」両方に「コピー」を選択しています。背景画像のボーダーを除いた部分が、状態パネルの背景を埋めるように繰り返し描画されていることが分かります。
リサイズの例
ここでは、「Fill Background Vertical rule」と「Fill Background Horizontal rule」両方に「リサイズ」を選択しています。背景画像のボーダーを除いた部分が、状態パネルの背景を埋めるように拡大描画されていることが分かります。
カスタムテキストアイコンの色を使う
チェックをオンにすると、「有効なテキストアイコンの色」及び「無効なテキストアイコンの色」の設定を有効にします。チェックをオフにした場合、「選択されていないメニューアイテムの文字色」で設定された色が利用されます。
テキストアイコンとは
テキストアイコンとは、画像の代わりに文字でアイコンを表現するアイコンのことです。有効なテキストアイコンの色
有効なテキストアイコンの文字色を設定します。有効なテキストアイコンとは、クリック可能なテキストアイコンのことです。
ボタンをクリックすると、色選択画面が表示されるので色を選択します。
赤
例として色を「赤」に設定すると、以下のようになります。無効なテキストアイコンの色
無効なテキストアイコンの文字色を設定します。無効なテキストアイコンとは、クリック不可能なテキストアイコンのことです。
ボタンをクリックすると、色選択画面が表示されるので色を選択します。
特殊アイコンの位置
状態パネルに表示される各アイコンの表示位置を、自分で定義することができます。注意
状態パネルに表示したい全てのアイコンの位置を定義する必要があります。位置を定義していないアイコンは、状態パネルに表示されません。
設定のフォーマット
設定のフォーマットは以下のようになっています。
アイコン名:横方向の位置(X座標),縦方向の位置(Y座標);アイコン名:横方向の位置(X座標),縦方向の位置(Y座標);・・・
各座標の単位はピクセルです。
状態パネルの左上から設定した「マージン」の値を足した位置が原点です。
アイコン名について
アイコン名は状態パネル自身や、各アドオンが定義しています。例えばMozcの変換モードを切り換えるアイコンのアイコン名は、「mozc-composition-mode」です。
詳細は省略します。