Tutorial: Creating my own first Windows Store app using C++ and My Experiences
My Objectives
So Ever since I started working in new office in C++ I wanted to try something different than MFC applications as a matter of fact I don't like the way it looks so here's a tutorial for myself in regards to that. This article is one such experimentation and my observation in that regards.Introduction
A Windows Windows Store app is tailored for the user experience that's introduced in Windows 8, I found a great article regarding this in the following link http://msdn.microsoft.com/en-us/library/windows/apps/hh465427.aspxand the complete app in http://go.microsoft.com/fwlink/p/?LinkId=258676
Before I dig into code, I want to understand some of the features and design principles that I can use to build a Windows Store app with C++.I also wanted to know how Microsoft Visual Studio Express 2012 for Windows 8 supports the design and development work because mostly I have been working on Visual Studio 2008. And it's important I understand how and when to use the Visual C++ component extensions (C++/CX)(Nothing special about CX but will try to do one more blog) to simplify the work of coding against the Windows Runtime(Important concept I will explain in other blog). I specifically wanted to use Windows Store app by using only XAML and C++.
Comparing C++ Desktop App to Store App
I have been working almost 5 months in Windows desktop programming with C++, I found some aspects of Windows Store app programming to be very familiar, and other aspects that require some learning.So What's the same?
- I'm still coding in C++, and I can access the STL, the CRT, and any other C++ libraries, except that I can't invoke certain functions directly, such as those related to file I/O.
- I usually used to get RC files from one of team designer, I can use XAML similar to them. And I can code like HTML for UI.
- I'm still creating apps that use Windows operating system types and my own custom types.
- I'm still using the Visual Studio debugger and other Microsoft development tools. (XAML editor and Blend is new but still I am in Microsoft environment)
- I'm still creating apps that are compiled to native machine code by the Visual C++ compiler. Windows Store apps in C++ don't execute in a managed run-time environment.
And What's new?
So it was a revelation for me as the design principles for Windows Store apps are very different from those for desktop apps. Window borders, labels, dialog boxes, and so on, are de-emphasized. Content is foremost. and I did not do lot of things in order in my planning
- And I am using XAML to define the entire UI. The separation between UI and core program logic is much clearer in a Windows Store app than in an MFC or Win32 app which I find awesome.So that other people better than me in UI can work on the appearance of the UI in the XAML file while I'm working on the behavior in the code file.
- I'm primarily programming against a new, easy-to-navigate, object-oriented API, the Windows Runtime, although Win32 is still available for some functionality.
- When I use Windows Runtime objects, I'm (typically) using C++/CX, which provides special syntax to create and access Windows Runtime objects in a way that enables C++ exception handling, delegates, events, and automatic reference counting of dynamically created objects. When I use C++/CX, the details of the underlying COM and Windows architecture are almost completely hidden from my app code. For more information, see C++/CX Language Reference. However, I can also program directly against the COM interfaces by using the Windows Runtime C++ Template Library.
- My app can support new concepts such as suspension, charms, and an app bar to create a more cohesive experience for the users.
- My app is compiled into a package that also contains metadata about the types that my app contains, the resources that it uses, and the capabilities that it requires (file access, internet access, camera access, and so forth).
- In the Windows Store, my app is verified as safe by a certification process and made discoverable to millions of potential customers.(So some of the services are paid).
Walk-through
First, I'll create a basic, one-page version so that I can focus on some fundamentals of Windows Store app programming in C++. This app won't have all the functionality that is required in a real Windows Store app, but it will serve to introduce me to starting difficulties and basic concepts. In part 2, I'll create a more full-featured, multi-page version of the app by using some of the pre-defined XAML templates in Visual Studio Express 2012 for Windows 8.
I'll start with the basics:
I'll start with the basics:
- How to create a Windows Store app project in Visual Studio Express 2012 for Windows 8.
- How to understand the various project files that are created.
- How to understand the Visual C++ component extensions, and when to use them.
To start creating an app, first I create a Windows Store app project that uses C++. Here I use the project template, Blank App (XAML).
To create a Windows Store app project
- In Visual Studio Express 2012 for Windows 8 and set the development settings for Visual C++ when prompted.
- Select the template for a Windows Store app project in new project menu.
- In the center pane, I choose Blank App (XAML).
- I'll call it SreekanthTesting.
- OK an then my project files are created.
Before I go on, let’s look at the project files. At the top of the Solution Explorer pane, Clicking the Show All Files icon to show all of the project files that the Blank App (XAML) template created (Actually, the Debug folder will not appear until after I built my app the first time by pressing F5.) that's where the app exe files present
| File name | Description |
|---|---|
| App.xaml, MainPage.xaml | The XAML markup files that represent the app object and the default page for the UI. I can modify these files by using the Visual Studio designer, Microsoft Expression Blend, or another XAML designer tool. Most of the modifications will be in MainPage.xaml. |
App.xaml.h, App.xaml.cpp MainPage.xaml.h, MainPage.xaml.cpp | The user-editable header and implementation code-behind files for the Application and MainPage classes. These classes correspond to the XAML trees in App.xaml and MainPage.xaml, respectively. The MainPage.xaml.h and MainPage.xaml.cpp files are where I add event handlers and other custom program logic that's related to this page. Member variables in the App class are in scope throughout your app. Variables in the Page class are in scope only in that page. App.xaml has no visual design surface, but I can still use the document outline and property inspector in the designer. |
| Package.appxmanifest | Contains metadata that describes My app, for example, display name, description, logos, and capabilities. When I click on this item, it opens in the Manifest Designer. |
| *.png | (In Assets folder.) The default logo and splash-screen images that you can replace with your own. |
| pch.h, pch.cpp | Typical C++ precompiled header files. I can add #include directives to the pch.h file as necessary. |
Files I don’t want to change
These files are generated by the XAML designer or editor whenever I navigate from the *.xaml page in Visual Studio. They enable the code-behind that I write to refer to XAML elements. They also keep IntelliSense in the code-behind up to date. Some of these files are in the Common subfolder (not expanded in the illustration).They can also be useful in debugging. But I don't modify these files because any changes I make will be overwritten the next time that I build my app or navigate away from the XAML page.| File name | Description |
|---|---|
| App.g.h, App.g.hpp | App.g.hpp contains the app's main method and some associated boilerplate code. App.g.h contains code that enables the operating system to load the .xaml files into memory at run time and create the object graph.I Don't want modify these files. |
StandardStyles.xaml
|
Contains predefined item templates, styles, and other elements that define the look and feel of a Windows Store app.I Don't want to modify the styles and templates in-place. However, I can base custom styles on these (by using the BasedOn attribute), or copy and paste them into other pages, give the copy a different name, and then modify the copy.
|
MainPage.g.h, MainPage.g.hpp
|
Contain the automatically-generated partial class definition for the MainPage and App classes, and the member variables that are generated for each XAML element that has an x:Name attribute. I Don't want modify these files.
|
XamlTypeInfo.g.h
|
The C++ file that the XAML editor generates to enable the Windows Runtime to recognize and load any custom types that are defined in app and are referenced in any XAML files. I Don't want to modify this file.
|
A first look at the code
In Solution Explorer, open MainPage.xaml and look at the markup in the XAML editor pane. Notice a
MainPage that derives from Windows::UI::Xaml::Controls::Page and contains a Windows::UI::Xaml::Controls::Grid member variable.
Each element type in the markup has an associated Windows Runtime type. As I add elements to the XAML, Visual Studio generates the C++ source code so that I can write code-behind that references those elements as Windows Runtime types. Not all the elements are represented in my C++ project code; only those elements that I refer to explicitly.
Let’s go back to MainPage.g.h. I can see that
MainPage is declared as a partial ref class.partial ref class MainPage : public Windows::UI::Xaml::Controls::Page… {…}
The partial and ref keywords are obviously not ISO standard C++. They are component extensions that you use specifically for creating instances of Windows Runtime types. The ref keyword indicates that the class is a Windows Runtime reference type; using ref saves me from having to write a lot of next-generation COM code. In the class member declarations, I notice a
Platform::Object^. The "^" symbol is known as a "hat" and it means "a handle to an object." Use it instead of "*" when you create Windows Runtime types in dynamic memory. I can also use the C++ auto keyword; the compiler will infer the type. The Platform namespace is specific to C++; it contains public and private types that are essential to the C++ "projection" of the Windows Runtime type system.Grid^ grid = ref new Grid(); // or: auto grid = ref new Grid(); grid->Width = 600;
In the most basic sense, a ref class is a COM object that implements the IInspectable interface and whose lifetime is managed by a smart pointer. The Windows Runtime defines a language-agnostic abstract binary interface (ABI) that runs natively in machine code, not through a virtual machine. C++/CX makes it possible to program against this ABI in an idiom that is much more like modern C++ than like old-school COM programming. I Use C++/CX specifically when I create and access Windows Runtime types. Libs, modules, and functions in a ref class that don't interface with the Windows Runtime can be written entirely in ISO standard C++. It's common to mix standard C++ and C++/CX in the same function. It's all compiled to native C++. For more information about C++/CX, see Visual C++ Language Reference (C++/CX).
The partial keyword tells the compiler that the declaration of this class is continued in another code file. That file is MainPage.xaml.h. If I, the programmer, have to add variables or functions to the MainPage class, do so in MainPage.xaml.h and MainPage.xaml.cpp. If the XAML editor has to add variables or other boilerplate code, it does so in the *.g.h and *.g.hpp files. Although the class definition has two parts, it behaves as one class, both while I am coding and at compile time. In general, I can safely ignore the *.g.* files. That's why Solution Explorer hides them by default. Now that we have looked behind the scenes. we will continue the other things some other time in my blog
Comments
Post a Comment