InstallShield FAQ <スイート/アドバンストUI プロジェクトで、ユーザー インターフェイスをカスタマイズする> 注)このドキュメントは、InstallShield 2014 Premier Edition を基に作成しています。InstallShield 2014 以外のバージョンでは設 定名などが異なる場合もあります。 概 要 スイート/アドバンスト UI プロジェクトでは、MSI や InstallScript ベースのインストーラーに比べ、より柔軟にユーザ ーインターフェイスをカスタマイズすることができます。 「スイート/アドバンスト UI プロジェクト」は複数の製品を1つに統合するためのプロジェクトで Premier Edition のみ で提供されますが、複数製品を高度な UI に統合してインストールすることが可能です。 また、Professional Edition ではスイートインストーラーの高度な UI を使用できる「アドバンスト UI プロジェクト」が 提供されています。MSI や InstallScript ベースのユーザーインターフェイスはカスタマイズの自由度が低いため、 代わりにアドバンスト UI プロジェクトのウィザードインターフェイスを使用して MSI や InstallScript インストーラー を実行することができます。 「スイート/アドバンスト UI プロジェクト」「アドバンスト UI プロジェクト」の違いは、以下のとおりです。 カテゴリ アドバンスト UI プロジェクト スイート/アドバンスト UI プロジェクト プロジェクトに含められるプラ 1 1つ以上 制限なし 制限なし カスタマイズ可能 カスタマイズ可能 イマリ パッケージの数 プロジェクトに含められる InstallShield 前提条件の数 ユーザーインターフェイス この記事では、スイート/アドバンスト UI プロジェクトで既存のダイアログの背景色やイメージ画像を変更する方法 を紹介します。 1/8 InstallShield FAQ A.「スイート/アドバンスト UI」「アドバンスト UI」 プロジェクトプロジェクトを作成する スイート/アドバンスト UI プロジェクトを作成し、パッケージを追加します。 1. スイート/アドバンスト UI プロジェクトを作成します 2. 機能を作成し、msi パッケージを追加します ●スイートインストーラーの基本的な作成方法 Tips and Tricks(http://www.networld.co.jp/is/tips.htm)から以下の記事をご参照ください。 スイートインストーラーの基本的な作成方法 http://www.networld.co.jp/is/pdf/SuiteInstaller_Basic.pdf 2/8 InstallShield FAQ B. ウィザードインターフェイスで、ダイアログの背景色やアイコンなどのスタイルを変更する スイート/アドバンスト UI プロジェクトでは、基本の MSI や InstallScript プロジェクトと異なり、ウィザードインターフ ェイスを使用して、ユーザーインターフェイスのカスタマイズを行います。 ウィザードインターフェイスは、「ウィザード ページ」および「2 番目のウィンドウ (ポップアップ ウィンドウ)」で構成さ れます。 <ウィザードページ> <2 番目のウィンドウ> ウィザードインターフェイスの各要素(ヘッダー、本文、ナビゲーション、ヘッダーイメージなど)に対して、スタイルを設 定することで、一括でダイアログの背景やフォントなどを変更できます。 3/8 InstallShield FAQ ■ダイアログの背景色を変更する ダイアログの背景には、ブラシスタイルを適用できます。カスタムのブラシスタイルを作成して、背景に適用します。 1. [ユーザー インターフェイス]-[ウィザード インターフェイス]を表示します 2. [ウィザードページ]をクリックして、設定を確認します ウィザードページに属するダイアログの本文 背景、ヘッダー背景、ナビゲーション背景 に、それぞれ「Body」「Header」「Footer」のブ ラシスタイルが適用されていることが確認で きます 3. [ブラシ]を右クリックして[ブラシを追加]を選択し、「caBackground」という名前に変更します 4. 「caBackground」スタイルで、背景色の設定を行います。 例) ブラシの種類 グラデーション 垂直方向のグラデーション 新しいグラデーションボタン(緑の[+]) をクリックして、以下を設定 最初の色: 薄い黄色(FFFF99) 停止の色: 薄い緑(CCFFCC) 4/8 InstallShield FAQ 5. 再度、[ブラシを追加]から「caHeader」というスタイルを作成し、以下の設定を行います ブラシの種類 グラデーション 6. 手順 5 と同様に「caFooter」というスタイルを作成し、以下の設定を行います ブラシの種類 グラデーション 7. 純色ブラシ 薄い緑(CCFFCC) [ウィザードページ]の設定で、作成したスタイルを適用します デフォルトの本文背景 ヘッダー背景 ナビゲーション背景 8. 純色ブラシ 薄い黄色(FFFF99) caBackground caHeader caFooter ビルド後、インストーラーを実行して背景色が変更されたことを確認します 5/8 InstallShield FAQ ●背景すべてに同じスタイルを適用する方法 本文背景、ヘッダー背景、ナビゲーション背景に同じスタイルを適用したい場合、[完全なウィザード背景] の設定を使用します。[完全なウィザード背景]にスタイルを指定すると、本文、ヘッダー、ナビゲーション背 景すべてが同じスタイルに指定されます。 下記は、水平方向へのグラデーション背景のブラシスタイルを、すべての背景に適用する設定例です。 ※[完全なウィザード背景]を使用した場合、個別の背景スタイルはすべて「スタイル設定なし」にします。 6/8 InstallShield FAQ ■アイコンファイルを変更する 右上に表示されるヘッダーイメージと 「InstallationWelcome」「InstallationComplete」ダイアログのアイコンイメージを 変更します。 1. [ウィザードページ]を表示し、[ヘッダーイメージ]にファイル(.png)を指定します ※ここで追加したファイルは、自動的に[サポートファイル]の[言語非依存]ノードに追加されます 2. [ウィザードページ]の[InstallationWelcome]-[IDC_IMAGE1]を表示します 3. [コンテンツ]-[リソース]で、ロゴファイルを選択します 4. [InstallationComplete]-[IDC_IMAGE1]でも同様に、ロゴファイルを選択します 7/8 InstallShield FAQ 5. ビルド後、インストーラーを実行してイメージが変更されたことを確認します ●ウィザードアイコンを変更する方法 キャプションバーの左上にあるアイコンファイルを変更したい場合、[ウィザードページ]の[ウィザードアイ コン]に .ico ファイルを指定します。 【注意】左下の「InstallShield」の文字列は削除することはできません。 以上 8/8
© Copyright 2024