CHAPTER 1

image

Setting Up Windows 8 Application Project

Aren’t you excited to get your first hands-on experience by developing FinanceHub Windows 8 application following MVVM design pattern? This chapter will guide you through setting up the development environment and then we will create a FinanceHub Windows 8 application project using one of the Visual Studio Windows Store XAML templates and will set up project structure supporting MVVM pattern-based development. Let’s get started!

The Development Environment

Microsoft has tried very hard to make the development experience smoother with the next generation of its integrated development tool sets. You need to follow four simple steps to set up your Visual Studio 2012 development environment for developing Windows 8 applications.

  1. Install Windows 8 Operating System.
  2. Install Visual Studio 2012 (recommended for this book) or Visual Studio 2012 Express for Windows 8.
  3. Set up required Database Storage platform.
  4. Obtain Developer License

The Windows 8 Operating System

The first step is to install Windows 8. This is a mandatory step and for the Windows 8 application development you must install Windows 8 operating system. If you have not done so please visit the Microsoft Windows 8 home page (http://windows.microsoft.com/en-US/windows/home) and set up your machine with Windows 8.

Windows 8 applications will only run on the Windows 8 platform; thus it’s important to note that so far Microsoft has not allowed the development of the Windows 8 applications for earlier Windows operating system such as Windows 7 and Windows Vista as well as server-side operating systems such as Windows 2012 server and Windows 2008 server.

The Visual Studio Development Platform

Windows 8 applications development is supported only on the latest version of Visual Studio (Visual Studio 2012). You have the option to either install a full version of Visual Studio 2012 or the Express edition of the Visual Studio 2012 for Windows 8. Let’s look at both options in turn.

image Note   For this book I have used Visual Studio 2012 Ultimate edition. However, you can use any of the below mentioned Visual Studio 2012 versions to develop the project in this book.

Visual Studio 2012

You can use Visual Studio 2012 Ultimate, Premium, or Professional version to build a line of business enterprise applications. Install Visual Studio 2012 (one of the mentioned versions – based on the license available to you), which will also install the following required components to develop Windows 8 applications:

  • Windows 8 SDK
  • Blend for Visual Studio
  • Windows 8 XAML and JavaScript Project Templates

The Visual Studio Ultimate 2012 version comes with the all possible features in all areas. Compared to the Ultimate version the Premium version lacks some of the features in the areas of debugging and diagnostic, testing tools, and architecture and modeling. Whereas the Professional version lacks more features in the areas of debugging and diagnostic, integrated environment, testing, tools, architecture and modeling, Team Foundation Server, software and services for production use, and software for development and testing.

image Note   Get details on feature comparisons in the above-mentioned areas between different versions of Visual Studio 2012 by visiting Microsoft site - http://www.microsoft.com/visualstudio/11/en-us/products/compare.

Visual Studio 2012 Express for Windows 8

You can also use Visual Studio 2012 Express for Windows 8 to build a professional Windows 8 application. The Express Visual Studio edition is free to developers. Install Visual Studio 2012 Express for Windows 8 from the Microsoft website (http://www.microsoft.com/visualstudio/11/en-us/products/express), which will also install the following required components to develop Windows 8 applications:

  • Windows 8 SDK
  • Blend for Visual Studio
  • Windows Store XAML and JavaScript Project Templates

Data Storage

The FinanceHub Windows 8 application will need to store stock portfolio and other related information. We will use a CSV (comma separated values) file to store the required information for demonstration purposes in this book. However, for other line of business (LoB) applications you can determine whether using SQL Server or a similar type of scalable database platform for the information storage would be more suitable.

image Note   Refer to “Pro Windows 8 Development with XAML and C#” by Jesse Liberty to get more information of how you develop LoB Windows 8 applications with database integration. Visit http://www.apress.com/microsoft/visual-studio/9781430240471 to get more information on this book.

Developer License

You must obtain a developer license to develop, build, install, and test Windows 8 applications before submitting them to the Windows Store for testing and certification. The developer license is free and you can obtain one or more developer licenses. There are two ways you can receive a developer license:

  • Using Visual Studio 2012, where you will be asked to obtain a developer license when you install Visual Studio 2012 on your machine and then open it for the first time.
  • Using Windows PowerShell commands from the command prompt, which you will use typically when you have not installed Visual Studio 2012.

image Note   Visit the Microsoft MSDN site at http://msdn.microsoft.com/en-us/library/windows/apps/hh974578 to get more details on the developer license, especially if you have to get it via command prompt, which is not the case in this book.

The Windows Store Project Templates

Visual Studio 2012 provides a few default Windows Store project templates that will give you a head start developing your applications. You’ll find templates for both XAML and .NET languages as well HTML5 and JavaScript. Some of the common Windows 8 store application project templates across different languages are:

  • Blank App – project template is a single-page project, which does not contain any predefined controls or layout, namely, user interface.
  • Grid App – project template is a multi-page project that allows navigation among group items and group-level dedicated page displays group and related items. You would use this template when you look at set of categories (group) of the application content and then drill through in details by displaying selected category (group) and related lists of items and so on. Windows 8 App Store and Video applications are examples of Grid template-based applications.
  • Split App – project template is a two-page project where the first page displays groups and enables you to select one of the groups, which will display the second page containing a list of items and the details of the selected item on the right side. You would use this template when you want to quickly look at the list of items and details of the selected item on the right side in a two-column view. Windows news reader and email applications are examples of Split template-based applications. In this book I will be using Blank App project template to develop the FinanceHub application to demonstrate everything from scratch.

Creating a Windows Store XAML Project – FinanceHub

This section will create a Windows 8 XAML project - FinanceHub - using the Windows Store Blank App project template. Next we will explore and understand the project structure, default files, and the package application manifest file. Finally we will create new folders supporting the development of the application using MVVM design-pattern. At the end of the chapter you’ll be left with a strong foundation on which you’ll build through the remainder of this tutorial.

  1. As shown in Figure 1-1, to create a new project named FinanceHub select Visual C# and the Windows Store option under the Installed Templates section of the Visual Studio New Project window.

    9781430249085_Fig01-01.jpg

    Figure 1-1.  Creating Windows Store XAML Project in Visual Studio 2012 using the Blank App Project Template

  2. You will see a set of XAML project templates from which you should select Blank App (XAML) option.
  3. Set the Name of the project to FinanceHub and select an appropriate location and click OK to create the project.

You will see that a new folder FinanceHub is created and the project is created under that folder.

Exploring FinanceHub Project

If you open the FinanceHub project and look at the Solution Explorer window you will find a familiar WPF and Silverlight-like project structure, as shown in Figure 1-2.

9781430249085_Fig01-02.jpg

Figure 1-2.  Default FinanceHub Project Structure

The Project Structure

You will see some familiar XAML project structure as well a few new things introduced for Windows 8 applications. Let’s quickly look at each of them:

  • App.xaml and MainPage.xaml and related code-behind files are similar to any other WPF and Silverlight XAML projects.
  • Under Common folder there is a single helper file StandardStyle.xaml, which contains the set of styles that are common for Windows 8 application layout.
  • Under Assets folder a set of 4 PNG icon images are present that are used by the application manifest defining default application logos (large and small application logos to display on the start screen and application logo to be displayed on the Windows Store) and splash screen (to display when the application starts).
  • Visual Studio 2012 enables adding reference to the whole SDK rather individual assemblies. As a result you will see by default References folder contains two SDK files, which actually references all the assemblies as part of the attached SDK. First SDK reference is to the .NET for Windows 8 apps that essentially references all new Windows 8 APIs. Second SDK reference is to the Windows SDK that references to all .NET Windows System Assembly files.
  • Under Properties folder you will see an AssemblyInfo.cs file, which includes general information about the application.

The Package Application Manifest File

The Package.appxmanifest file is an important file, which defines the runtime configuration properties and enables the capabilities of the Windows 8 application deployment package. When you open this file within Visual Studio 2012, it will open as a window with four tabs: Application UI, Capabilities, Declarations, and Packaging.

The Application UI Tab

Figure 1-3 shows the Application UI tab that will allow you to set the properties that describe your application. The application properties include the application entry point, startup icon, preferred application orientation, and application splash screen definition. It references images stored under the Assets folder of the project.

9781430249085_Fig01-03.jpg

Figure 1-3.  The Application UI Tab

The Capabilities Tab

Figure 1-4 shows the Capabilities tab, which is introduced for Windows 8 applications. This tab will enable application features such as access to Document Libraries, Internet, Microphone, Location, and Webcam. You must check the associated checkbox to enable this feature during application execution.

9781430249085_Fig01-04.jpg

Figure 1-4.  The Capabilities Tab

image Note   Even if you have written code associated to the feature and have not selected the related feature under the Capabilities tab, the feature will not be available to the deployed application.

The Declarations Tab

Figure 1-5 shows the Declarations tab, which is introduced for Windows 8 applications. This tab will enable you to add declarations and specify related properties enabling integration of your application with other applications such as the Search contract. The Search contract will allow you to add a Search pane to your application and you can search within and across application content. It will also allow other applications to search your application content.

9781430249085_Fig01-05.jpg

Figure 1-5.  The Declaration Tab

The Packaging Tab

Figure 1-6 shows the Packaging tab, which describes the application deployment package, allowing you to update key package properties such as package identification id, windows store logo (the image is added under the Assets folder), application version, and publisher information.

9781430249085_Fig01-06.jpg

Figure 1-6.  The Packaging Tab

Setting MVVM Architecture in FinanceHub Project

So far we looked at the default blank XAML Windows Store application structure. Next we will add some additional folders to support the design and development of the FinanceHub project using MVVM design pattern.

Please add the following five folders as placeholders to support the MVVM design pattern:

  • Dependencies – This folder will contain additional third party or custom dependencies assemblies that would require development of our application.
  • Infrastructure – This folder will contain required classes and will implement services to support loosely coupled MVVM development.
  • Model – This folder will contain the model class of the application.
  • View – This folder will contain the user interface definition made up of different XAML controls and pages of the application.
  • ViewModel – This folder will contain the ViewModel of the pages/usercontrols.

Figure 1-7 shows the final blank project structure of the FinanceHub Windows 8 application.

9781430249085_Fig01-07.jpg

Figure 1-7.  Final FinanceHub Application Project Structure

If you run the project at this point, it will compile successfully and you will see the project is running without any user interface.

Summary

You have now seen how to set up your development environment to start the Windows 8 application development. As you noticed Windows 8 and Visual Studio 2012 are required to develop Windows 8 applications. You even have an option to use Visual Studio 2012 Express, though I recommend using one of the regular Visual Studio 2012 versions to develop LoB Windows 8 applications.

The first chapter of this book ended with creating a skeleton of the FinanceHub XAML Windows 8 application that will follow and implement the MVVM design pattern in the next three chapters. We used the Windows Store Blank XAML App project template in Visual Studio 2012. We also added a few blank folders as placeholders to support the development following the MVVM design pattern.

Do not forget to download the source code and visit the Chapter 1 folder to view the source code that we developed in this chapter.

The next chapter defines the presentation layer, or the view of the application that will drive the user interface of the application.

..................Content has been hidden....................

You can't read the all page of ebook, please click here login for view all page.
Reset
3.15.220.219