Create Setup and Deployment of WPF Application Step by Step

16
Create Setup and Deployment of WPF Application Step by Step Introduction In this article we will see how we can create a Setup and Deployment of WPF Application. I would guide you step by step so that you don't miss anything. Crating WPF Application Project Fire up Visual Studio 2008 and Create a WPF Application and name the project as MyApplication. We would add another WPF User Control Library so that you get the complexity of more than one project and their dependencies. So add a New Project to the Solution and name it as WPFHelper.

Transcript of Create Setup and Deployment of WPF Application Step by Step

Page 1: Create Setup and Deployment of WPF Application Step by Step

Create Setup and Deployment of WPF Application Step by Step Introduction

In this article we will see how we can create a Setup and Deployment of WPF Application. I would guide you step by step so that you don't miss anything.

Crating WPF Application Project

Fire up Visual Studio 2008 and Create a WPF Application and name the project as MyApplication.

We would add another WPF User Control Library so that you get the complexity of more than one project and their dependencies. So add a New Project to the Solution and name it as WPFHelper.

Page 2: Create Setup and Deployment of WPF Application Step by Step

Let's make this simple. When you add a WPF User Control Library it comes with a UserControl1.xaml, delete the file and add a class and name it as Employee.cs

Page 3: Create Setup and Deployment of WPF Application Step by Step

Have the following structure for simplicity.

namespace WPFHelper

    public class Employee    {        public string Name { get; set; }    }}

Now your Solution structure would look like as follows:

Now add reference of this WPFHelper to MyApplication.

Page 4: Create Setup and Deployment of WPF Application Step by Step

Now go back to our main application "MyApplication" and and some controls so that it would have dependecies on the Assembly of WPFHelper project.

Now I have added a ComboBox that would contain the Employee names.

Write the below code to bind to some sample data.

Page 5: Create Setup and Deployment of WPF Application Step by Step

XAML

<Window x:Class="MyApplication.Window1"    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"    xmlns:local="clr-namespace:WPFHelper;assembly=WPFHelper"    Title="Window1" Height="300" Width="300">    <Grid>        <ComboBox x:Name="cmbEmployeeNames" Height="23" Margin="21,29,98,0" VerticalAlignment="Top" ItemsSource="{Binding}">            <ComboBox.ItemTemplate>                <DataTemplate>                    <TextBlock Text="{Binding Name}"/>                </DataTemplate>            </ComboBox.ItemTemplate>        </ComboBox>    </Grid></Window>

C#

public partial class Window1 : Window    {        public Window1()        {            InitializeComponent();            List<Employee> myList = new List<Employee>             {                new Employee{ Name="Some 1"},                new Employee{ Name="Some 2"},                new Employee{ Name="Some 3"},                new Employee{ Name="Some 4"},                new Employee{ Name="Some 5"}            };

            cmbEmployeeNames.ItemsSource = myList;        }    }

Now run the application to test the application.

Page 6: Create Setup and Deployment of WPF Application Step by Step

Yes, we are going good.

Now comes the most important part where we would go step by step.

Step 1

Add a Setup and Deployment project to the Solution and name it as MyApplicationSetup.

Page 7: Create Setup and Deployment of WPF Application Step by Step

As soon as you add the project it opens the File Explorer view.

The solution structure would be like as follows:

In the left pane you see the System Folders and the right pane is for the content of the Folder.

If you see above we have 3 System Folders. You can add other System Folders based on your requirement.

The following list is shown when you right click on the root and select Add Special Folder.

Page 8: Create Setup and Deployment of WPF Application Step by Step

Step 2

We would add Program File's Folder to our Setup project.

Here is the way how you should add contents to the folders. 1. Application Folder

a. It should contain the Primary output and the dependencies. 

2. Program Files Folder

a. It should contain the Folder where your Primary output would be copied while installation and the necessary files [Resource file such as icons, config, etc..].

Page 9: Create Setup and Deployment of WPF Application Step by Step

 

3. User's Desktop

a. It should contain the Shortcut of your application 

4. User's Program Menu

a. It should contain the Shortcut of your application.

Step 3

Now we would add Primary output and other dependencies to Application Folder.

Select as displayed above.

Page 10: Create Setup and Deployment of WPF Application Step by Step

You would see the projects available in the solution to add. As MyApplication is the Startup Project select it and press OK. You would see the change in the folder as follows.

Step 4

Now we would add A folder to the Program Files Folder.

Page 11: Create Setup and Deployment of WPF Application Step by Step

Step 5

Name the folder as My Application.

Step 6

Now add the same as you did for the Application Folder.

But you would see the dependecy DLL are not added. Here you can add required files for the Application to run such as Icons and all.

Step 7

Now we would add a Shortcut to User's Desktop.

Here is the Trick go to your Application folder and Create a shortcut of your Primary output and rename it as required. And then move the file from there to User's Desktop. The following screens would help you doing this.

Page 12: Create Setup and Deployment of WPF Application Step by Step
Page 13: Create Setup and Deployment of WPF Application Step by Step

Step 8

Now do the same procedure as above for User's Program Menu. As it requires the same.

We have to do a last round of work for all the folders and files we have added. That is a property called AlwaysCreate to True. By default it is False.

Page 14: Create Setup and Deployment of WPF Application Step by Step

Step 9

Change all folders and files setting as AlwaysCreate = True.

Changing the Default Location of Application Folder.

By default it is: [ProgramFilesFolder][Manufacturer]\[ProductName]

If you don't want to change it's fine. But if you give [Manufacture] in the attribute then it would create folder as Microsoft in Program Files and then your folder.

I prefer to remove the attribute so that your application would be directly under Program Files.

Change the Default Location to [ProgramFilesFolder] \[ProductName]

Now our Setup project is ready. Rebuild the Solution and then rebuild the Setup project.

Go to the Debug directory of the Setup project. There you would find your setup files as .msi and .exe

The first one is for distribution.

That's it you have successfully created a Setup for your WPF application.

Hope this article helps. Comment Request!Thank you for reading this post. Please post your feedback, question, or comments about this post Here.