WiXインストーラーのダイアログのバナー画像や背景画像を変更する手順を紹介します。

画像の準備

ダイアログ画像

ダイアログの画像を準備します。493×312 pixelのbmp形式の画像を用意します。左側164 pixel部分にロゴや画像を配置します。


今回は下図の画像を用意しました。

バナー画像

bmp形式のバナー画像を準備します。左側には進行状況が表示されるため、ロゴなどは右側に配置します。


今回は下図の画像を用意しました。

インストーラーの作成

こちらの記事を参照して最小限のUIを持つインストーラーを作成します。

先に作成した画像ファイルをプロジェクトファイルのあるディレクトリに配置します。(Visual Studioでは画像ファイルをプロジェクトのノードにドラッグ＆ドロップすることで配置できます。)


Product.wxsファイルを変更します。

Product.wxs

<?xml version="1.0" encoding="UTF-8"?>
<Wix xmlns="http://schemas.microsoft.com/wix/2006/wi">
  <Product Id="*" Name="MinimalUIInstallerCustom2" Language="1033" Version="1.0.0.0" Manufacturer="iPentec" UpgradeCode="68ebfec5-9d40-45a9-a950-afa2e7c7b006">
    <Package InstallerVersion="200" Compressed="yes" InstallScope="perMachine" />

    <MajorUpgrade DowngradeErrorMessage="A newer version of [ProductName] is already installed." />
    <MediaTemplate EmbedCab="yes"/>
    <UIRef Id="WixUI_Minimal" />
    <WixVariable Id="WixUILicenseRtf" Value="license.rtf"/>
    <WixVariable Id="WixUIDialogBmp" Value="dialog.bmp" />
    <WixVariable Id="WixUIBannerBmp" Value="banner.bmp" />
    
    <Feature Id="ProductFeature" Title="MinimalUIInstallerCustom2" Level="1">
      <ComponentGroupRef Id="ProductComponents" />
    </Feature>
  </Product>

  <Fragment>
    <Directory Id="TARGETDIR" Name="SourceDir">
      <Directory Id="ProgramFilesFolder">
        <Directory Id="INSTALLFOLDER" Name="MinimalUIInstallerCustom2" />
      </Directory>
    </Directory>
  </Fragment>
  
  <Fragment>
    <DirectoryRef Id="INSTALLFOLDER">
      <Component Id="Component1" Guid="{BE0399F6-8287-44B9-8252-8017A4935BBB}" DiskId="1">
        <File Id="File01" Name="Document.txt" Source="Document.txt"/>
      </Component>
    </DirectoryRef>
  </Fragment>
  
  <Fragment>
    <ComponentGroup Id="ProductComponents" Directory="INSTALLFOLDER">
      <ComponentRef Id="Component1" />
    </ComponentGroup>
  </Fragment>
</Wix>

解説

  <WixVariable Id="WixUIDialogBmp" Value="dialog.bmp" />
  <WixVariable Id="WixUIBannerBmp" Value="banner.bmp" />

を記述することにより、インストーラーのダイアログの画像とバナー画像を指定できます。

<WixVariable Id="WixUILicenseRtf" Value="license.rtf"/>

の記述はソフトウェア使用契約の文章を指定する記述です。詳しくはこちらの記事を参照してください。

プロジェクトをビルドするとビルド出力ディレクトリに、msiファイルが生成されます。

実行結果

ビルドされたmsiファイルを実行します。下図のダイアログが表示されます。指定した画像がダイアログに反映されています。


[使用許諾契約書に同意します]のチェックボックスをチェックします。チェック後[インストール]ボタンをクリックします。


インストールが始まります。ダイアログ上部に指定したバナー画像が表示されます。


インストールが完了すると下図の画面が表示されます。[完了]ボタンをクリックしてインストーラーを終了します。