設計の都合で、既定のサイズよりも小さいナビゲーション ボタンが必要になった場合、デザイン モードでボタンとフォントのサイズを変更しようとしても、イライラするだけでうまくいかないことがあります。また、矢印を正確に中央に配置するなどとても無理だと思えるかもしれません。InfoPath では、小型ナビゲーション ボタンを作成することはできますが、さらにビューの .xsl ファイルにボタンのインライン スタイルを手動で簡単に追加する必要があります。

このタスクでは、矢印 (9、3、4、および :) が表示された小型ナビゲーション ボタンのセットを作成します。ボタンはそれぞれ先頭、前、次、最後に移動するボタンです。まず、新しい空白のフォームを作成しておきます。

4 つの小型ナビゲーション ボタンを作成する

1. [Controls] 作業ウィンドウを開きます。
2. ビューにボタンを挿入します。
3. ボタンを選択し、そのフォント サイズおよびフォントをそれぞれ「8pt」および「Webdings」に設定します。
4. ボタンをダブルクリックします。
5. [Button Properties] ダイアログ ボックスの [General] タブをクリックし、図 1 のように、ラベルとして「9」、ID として「btnFirst」を入力します。

図 1 ナビゲーション ボタンのプロパティの設定

Webdings フォントでは、テキストの '9' は 9、'3' は 3、'4' は4、および ':' は : の矢印になります。

6. [Size] タブで、高さと幅の両方の値を「16px」に設定し、[OK] をクリックします。
7. ボタンのコピーを 3 つ作成して、ビューのボタンを全部で 4 つにします。
8. 新しい 3 つのボタンのラベルと ID をそれぞれ「3」と「btnPrevious」、「4」と「btnNext」、「:」と「btnLast」に変更します。

この時点で 4 種類のナビゲーションの矢印がビューに表示されています。しかし、図 2 に示すように、16x16 のボタン内で矢印の表示が切れています。これを、XSL を手動で編集して修正します。

図 2 小型ナビゲーション ボタン内で矢印の表示が切れています。

個々の小型ナビゲーション ボタンのインライン スタイルを変更する

1. [File] メニューの [Extract Form Files] をクリックします。
2. 取り出したフォーム構成ファイルの保存先を選択し、[OK] をクリックします。
3. InfoPath を終了して、フォーム構成ファイルに対するロックを解除します。
4. テキスト エディタを使用して、ビューの .xsl ファイルを開きます。
5. テキスト「btnFirst」を検索し、同じ input 要素の style 属性を探します。
6. インライン スタイルの最後に、次のプロパティおよび値を追加します。

7. 同じプロパティおよび値を他の 3 つの小型ナビゲーション ボタンのインライン スタイルの最後にも追加します。それぞれの要素は、テキスト「btnPrevious」、「btnNext」、および「btnLast」で検索できます。
8. ビューの .xsl ファイルを保存し、テキスト エディタを閉じます。
9. manifest.xsf ファイルを右クリックし、[Design] をクリックして、フォーム テンプレートを再度開きます。

それぞれの小型ナビゲーション ボタンのインライン スタイルに line-height プロパティを追加したことによって、図 3 のように、矢印が切れずにボタンの中央に適切に配置されるようになりました。

図 3 修正した小型ナビゲーション ボタン内の矢印は切れていません。

©2005 Greg Collins. All rights reserved. Licensed to Autonomy Systems, LLC for display on InfoPathDev.com.