DovetailConnect Blog

Adding a Custom Dialog To Your Wix Installer

Kevin Miller November 4, 2009

installer ninjaRecently I made the move to Wix3 for a couple of projects and I have been quite happy. One of the things that has been simplified is adding a a custom step into the installer process.

I’ll leave the heavy lifting of how to insert the custom dialog to Jan Schepens’ post Making a custom setup dialog using WiX 3.0. He tells you how to customize your UI layout and insert a new dialog into the process. Read this post it explains it well. Neil Sleightholm has a similar post Customised UI’s For Wix that is about removing dialogs from the layout.

I’m going to be straight with you. This post is mainly for myself. I want to have this resource six months from now when I need to do the same thing again.

Wiring Up Your Dialog

Jan does a good job with his post so good that I want to leave it mostly alone. I do want to underscore the need to wire up the dialog into the flow of the UI for going in the Back and Next wizard directions.

<Publish Dialog="InstallDirDlg" Control="Back" Event="NewDialog" Value=
"LicenseAgreementDlg">1</Publish> <Publish Dialog="InstallDirDlg" Control="Next" Event="SetTargetPath" Value=
"[WIXUI_INSTALLDIR]" Order="1">1</Publish> <Publish Dialog="InstallDirDlg" Control="Next" Event="DoAction" Value=
"WixUIValidatePath" Order="2">NOT
WIXUI_DONTVALIDATEPATH</Publish> <Publish Dialog=
"InstallDirDlg" Control="Next" Event="SpawnDialog" Value=
"InvalidDirDlg" Order="3"><![CDATA[NOT WIXUI_DONTVALIDATEPATH AND
WIXUI_INSTALLDIR_VALID<>"1"]]></Publish> <Publish Dialog=
"InstallDirDlg" Control="Next" Event="NewDialog" Value=
"webSiteLocator" Order="4">WIXUI_DONTVALIDATEPATH OR WIXUI_INSTALLDIR_VALID=
"1"</Publish> <Publish Dialog="InstallDirDlg" Control="ChangeFolder" Property="_BrowseProperty" Value=
"[WIXUI_INSTALLDIR]" Order="1">1</Publish> <Publish Dialog="InstallDirDlg" Control="ChangeFolder" Event="SpawnDialog" Value=
"BrowseDlg" Order="2">1</Publish> <Publish Dialog="webSiteLocator" Control="Back" Event="NewDialog" Value="InstallDirDlg">1</Publish> <Publish Dialog="webSiteLocator" Control="Next" Event="NewDialog" Value="VerifyReadyDlg">1</Publish> <Publish Dialog="VerifyReadyDlg" Control="Back" Event="NewDialog" Value=
"webSiteLocator" Order="1">NOT Installed</Publish> <Publish Dialog="VerifyReadyDlg" Control="Back" Event="NewDialog" Value=
"MaintenanceTypeDlg" Order="2">Installed</Publish>

 

The key when inserting your dialog is to also rewire the NewDiaqlog events from the previous and next dialogs in the wizard to point at your new dialog.

Creating the Custom Dialog

Hate to break this to you the fun part is over. The trick with the custom dialog is actually creating the custom dialog. Editing Xml user interfaces is not fun and the edit/test cycle between building your Wix installer and manually testing it is painful. I went looking for an interactive dialog editor and found WixEdit. Suddenly a lot of the pain went away. WixEdit is still a bit rough here are a couple of tips.

  • Copy the WixEdit exe and dlls into your Wix doc directory to make it happy.
  • WixEdit doesn’t currently like the Wix3 namespace. I could not get it to open my .wxs files. If you have an existing dialog you wish to edit it... Create a new project with WixEdit and copy your Dialog Xml into that project file. Then copy the resulting dialog xml back out when you are done. Ulgy but better than nothing.

image

Bonus: Enabling and Disabling Controls Based On A Checkbox

I wanted the dialog to enable the text fields when a checkbox is pressed. The trick to this is having conditions on the controls toggling the control’s enabled state based on the checkbox’s property.

  <Control Id="headerLabel" Type="Text" X="20" Y="126" Width="290" Height="13" Text="Host Header Name" />
  <Control Id="webSiteHeader" Type="Edit" Property="WEBSITEHEADER"
           X="20" Y="139" Width="320" Height="15"
           Text="[WEBSITEHEADER]" Disabled="yes">
    <Condition Action="disable"><![CDATA[CUSTOMIZEWEBSITE <> "yes"]]></Condition>
    <Condition Action="enable"><![CDATA[CUSTOMIZEWEBSITE = "yes"]]></Condition>
  </Control>

  <Control Type="CheckBox" Id="customizeWebSiteLocation" Property="CUSTOMIZEWEBSITE"
           Width="120" Height="17" X="240" Y="56" 
           Text="Customize Website Binding" CheckBoxValue="yes">
    <Condition Action="show">NOT Installed</Condition>
  </Control>
share

Tags:

Comments

Re: Adding a Custom Dialog To Your Wix Installer

Jasper, Thank you for explaining how to get WixEdit working. Once I told WixEdit where my Wix binaries were I could edit .wxs files within my project. Perhaps WixEdit could prompt the first time user for the directory or Look in the typical Wix locations automatically? (C:\Program Files (x86)\Windows Installer XML v3) (C:\Program Files\Windows Installer XML v3)

Re: Adding a Custom Dialog To Your Wix Installer

There's an easier way of updating the dialog flow than having to download WiX source (which is not included with the WiX SDK). 1. Create your dialog using WixEdit or start with borrowed existing. 2. Insert your custom dialog with existing WixUI_XXX sequence. Use Orca tool to identify Dialog and Control names of existing MSI with UI you want to enhance. For example, add the following code to your main product to insert a custom user-defined dialog. 1 1 1 1 Note that the custom code is after the standard UIRef element. This examples updates the feature tree wizard to display your dialog after feature dialog page. The key to making this work is overriding the appropriate dialogs to point to your custom dialog on Next and Back respectively. The main advantage is the pattern cleanly extends existing WixUI dialog libraries without needing to locate and rewrite original WiX source.

Post new comment

The content of this field is kept private and will not be shown publicly.
CAPTCHA
This question is for testing whether you are a human visitor and to prevent automated spam submissions.