Impossible to add background image through theme file when using wixstdba

[wixbot]

I've tried to set a background image to the installer window using a theme file based on the classic wix burn theme. I've changed the theme to place an image across the entire dialog to use as a background. It seems however that it is not possible to use and image in this fashion - no matter where I place the <Image> element in the theme xml file the image is placed on top of other elements.

I first tried to modify the <Image> element in the same location as in the Wix classic burn theme, i.e. before any elements. This causes all text elements to be obscured by the image.

Then I tried to place the <Image> element as the first child of the "Install" <Page> element. This showed the image as the background on the first page of the installer wizard, but no image is shown on subsequent pages.

I then tried to add another <Image> element as the first child of the "Progress" <Page> element, but this then once again obscured the text on the first page of the installer, but it displayed correctly on the progress page. Then on subsequent pages no image was displayed at all.

I also tried to add the <Image> element after all <Page> elements, but this also caused the image to be displayed on top of the text on the first page.

Here is a copy of the theme file used:

<?xml version="1.0" encoding="utf-8"?>
<Theme xmlns="http://wixtoolset.org/schemas/thmutil/2010">
  <Window Width="499" Height="384" HexStyle="100a0000" FontId="0">#(loc.Caption)</Window>
  <Font Id="0" Height="-12" Weight="500" Foreground="000000" Background="F0F0F0" >Segoe UI</Font>
  <Font Id="1" Height="-24" Weight="500" Foreground="000000">Segoe UI</Font>
  <Font Id="2" Height="-22" Weight="500" Foreground="666666">Segoe UI</Font>
  <Font Id="3" Height="-12" Weight="500" Foreground="000000" Background="F0F0F0" >Segoe UI</Font>
  <Font Id="4" Height="-12" Weight="500" Foreground="ff0000" Background="F0F0F0"  Underline="yes">Segoe UI</Font>
  <Font Id="5" Height="-24" Weight="500" Foreground="000000" Background="E0E0E0">Segoe UI</Font>
  <Font Id="6" Height="-9" Weight="500" Foreground="000000" Background="F0F0F0">Segoe UI</Font>
  <!-- Attempt 1 -->
  <!-- Image X="0" Y="0" Width="493" Height="312" ImageFile="logo.png" Visible="yes"/ -->
  <Text X="130" Y="-45" Width="500" Height="2" FontId="5" Visible="yes"></Text>
  <Page Name="Help">
    <Text X="150" Y="30" Width="-11" Height="30" FontId="2" DisablePrefix="yes">#(loc.HelpHeader)</Text>
    <Text X="150" Y="71" Width="-20" Height="-50" FontId="6" DisablePrefix="yes">#(loc.HelpText)</Text>
    <Button Name="HelpCancelButton" X="-11" Y="-11" Width="75" Height="23" TabStop="yes" FontId="0">#(loc.HelpCloseButton)</Button>
  </Page>
  <Page Name="Install">
    <!-- Attempt 2 -->
    <Image X="0" Y="0" Width="493" Height="312" ImageFile="logo.png" Visible="yes"/>
    <Text X="150" Y="30" Width="-11" Height="100" FontId="2" DisablePrefix="yes">#(loc.WillInstall)</Text>
    <Hypertext Name="EulaHyperlink" X="150" Y="-60" Width="-11" Height="17" TabStop="no" FontId="3" HideWhenDisabled="yes">#(loc.InstallLicenseLinkText)</Hypertext>
    <Button Name="InstallButton" X="-91" Y="-11" Width="75" Height="23" TabStop="yes" FontId="0">#(loc.InstallInstallButton)</Button>
    <Button Name="WelcomeCancelButton" X="-11" Y="-11" Width="75" Height="23" TabStop="yes" FontId="0">#(loc.InstallCloseButton)</Button>
  </Page>
  <Page Name="Options">
  </Page>
  <Page Name="Progress">
    <!-- Attempt 3 -->
    <!-- Image X="0" Y="0" Width="493" Height="312" ImageFile="logo.png" Visible="yes"/ -->
    <Text X="150" Y="30" Width="-11" Height="30" FontId="2" DisablePrefix="yes">#(loc.ProgressHeader)</Text>
    <Text X="150" Y="71" Width="70" Height="17" FontId="3" DisablePrefix="yes">#(loc.ProgressLabel)</Text>
    <Text Name="OverallProgressPackageText" X="150" Y="71" Width="-11" Height="17" FontId="3" DisablePrefix="yes">#(loc.OverallProgressPackageText)</Text>
    <Progressbar Name="OverallCalculatedProgressbar" X="150" Y="93" Width="250" Height="15" />
    <Button Name="ProgressCancelButton" X="-11" Y="-11" Width="75" Height="23" TabStop="yes" FontId="0">#(loc.ProgressCancelButton)</Button>
  </Page>
  <Page Name="Modify">
    <Text X="150" Y="30" Width="-11" Height="100" FontId="2" DisablePrefix="yes">#(loc.ModifyHeader)</Text>
    <Button Name="RepairButton" X="-171" Y="-11" Width="75" Height="23" TabStop="yes" FontId="0" HideWhenDisabled="yes">#(loc.ModifyRepairButton)</Button>
    <Button Name="UninstallButton" X="-91" Y="-11" Width="75" Height="23" TabStop="yes" FontId="0">#(loc.ModifyUninstallButton)</Button>
    <Button Name="ModifyCancelButton" X="-11" Y="-11" Width="75" Height="23" TabStop="yes" FontId="0">#(loc.ModifyCloseButton)</Button>
  </Page>
  <Page Name="Success">
    <Text X="150" Y="30" Width="-11" Height="100" FontId="2" DisablePrefix="yes">#(loc.SuccessHeader)</Text>
    <Button Name="LaunchButton" X="-91" Y="-11" Width="75" Height="23" TabStop="yes" FontId="0" HideWhenDisabled="yes">#(loc.SuccessLaunchButton)</Button>
    <Text Name="SuccessRestartText" X="150" Y="-51" Width="-11" Height="34" FontId="3" HideWhenDisabled="yes" DisablePrefix="yes">#(loc.SuccessRestartText)</Text>
    <Button Name="SuccessRestartButton" X="-91" Y="-11" Width="75" Height="23" TabStop="yes" FontId="0" HideWhenDisabled="yes">#(loc.SuccessRestartButton)</Button>
    <Button Name="SuccessCancelButton" X="-11" Y="-11" Width="75" Height="23" TabStop="yes" FontId="0">#(loc.SuccessCloseButton)</Button>
  </Page>
  <Page Name="Failure">
    <Text X="150" Y="30" Width="-11" Height="30" FontId="2" DisablePrefix="yes">#(loc.FailureHeader)</Text>
    <Hypertext Name="FailureLogFileLink" X="150" Y="71" Width="-11" Height="51" FontId="3" TabStop="yes" HideWhenDisabled="yes">#(loc.FailureHyperlinkLogText)</Hypertext>
    <Hypertext Name="FailureMessageText" X="150" Y="131" Width="-11" Height="51" FontId="3" TabStop="yes" HideWhenDisabled="yes" />
    <Text Name="FailureRestartText" X="150" Y="160" Width="-11" Height="34" FontId="3" HideWhenDisabled="yes" DisablePrefix="yes">#(loc.FailureRestartText)</Text>
    <Button Name="FailureRestartButton" X="-91" Y="-11" Width="75" Height="23" TabStop="yes" FontId="0" HideWhenDisabled="yes">#(loc.FailureRestartButton)</Button>
    <Button Name="FailureCloseButton" X="-11" Y="-11" Width="75" Height="23" TabStop="yes" FontId="0">#(loc.FailureCloseButton)</Button>
  </Page>
  <!-- Attempt 4 -->
  <!-- Image X="0" Y="0" Width="493" Height="312" ImageFile="logo.png" Visible="yes"/ -->
</Theme>

Originally opened by villintehaspam

[wixbot]

Release changed from v3.10 to v4.x
Type changed from Bug to Feature

[rseanhall]

This was actually a duplicate of #3285. To use an image as the background for the entire window:

• Set the image in Theme/@ImageFile
• Specify the initial coordinates in Window/@SourceX and Window/@SourceY
• For the font referenced in Window/@FontId, Font/@Background must not be specified

As noted in #4106, general support for drawing controls on top of each other isn't likely to be added to thmutil.