Windows 8 and Windows Phone 8 .NET Development Overview - Windows8AppFactor

  • Article

Image255

Key Facts This is based on the slides created by West Region DPE. You can get the slides, the code, and more at https://windows8appfactor.com.

  1. Developer Tooling
  2. Design tools
  3. Working with the Simulator
  4. Exploration of the Built in Templates
  5. Type of controls
  6. Working with Controls
    • Events
    • Properties
  7. Data Binding
  8. Data Context
  9. Value Converters
  10. Item Controls/Item Templates
  11. Binding Collections
  12. Windows Phone 8
    • Development Tools
    • Windows Phone 8 Emulator
    • The Shared Kernel
    • The Phone API

Image256

Key FactsAt this time there are two separate marketplaces and two separate SDKs, one for tablets and PCs and one for phones. While there are many similarities in the programming models between Windows 8 and Windows phone, you will need to create separate projects for each platform. Microsoft realizes this is not the ideal scenario, but one that is work in progress, since Windows phone came before Windows 8.

  1. Download the Windows phone SDK
    1. https://dev.windowsphone.com/en-us/downloadsdk
  2. Download Windows 8 SDK
    1. https://msdn.microsoft.com/en-us/windows/desktop/hh852363.aspx
  3. Windows Phone Store
    1. https://www.windowsphone.com/en-us/store
  4. Windows 8 Store Info
    1. https://windows.microsoft.com/en-US/windows-8/apps#Cat=t1

Image257 
Key Facts Windows 8 offers additional support for CPUs. The ARM processor is known to be a low energy CPU, allowing tablets and laptops to run for longer periods of time. Windows 8 also supports a number of sensors, allowing application developers to determine location, orientation of the device relative to gravity, and of course touch. Perhaps the biggest change is touch for a Windows 8 and the fact that there is this global marketplace, which makes it safe and reliable to download applications. It also provides a revenue model for developers and dramatically lowers the barriers to entry, freeing the developer from having to worry about billing and collection, creating a storefront, and raising awareness.

  1. Windows 8 supports a variety of applications
    • Windows store apps
    • Browser-based applications
    • Desktop applications
  2. Windows 8 also supports several programming languages
    • C/C++
    • C#/VB.NET
    • JavaScript
  3. Windows 8 also supports declarative visual design languages
    • XAML
    • HTML5/CSS3
  4. Windows 8 also supports older programming models
    • Win32/COM
    • .NET/Silverlight

Essential Downloads For Windows 8 Development Don't miss out on these links to start your downloading.

MSDN subscribers can get Windows 8 from MSDN Subscriber Downloads https://msdn.microsoft.com/subscriptions/default.aspx#
Download Visual Studio Express 2012 for Windows 8 (392 mb) https://www.microsoft.com/click/services/Redirect2.ashx?CR_EAC=300051951#
Test your app before you submit it for certification and listing in the Windows Store - Windows App Certification Kit https://msdn.microsoft.com/windows/apps/jj572486#
Visual Studio Extensions for the Windows Library for JavaScript https://msdn.microsoft.com/library/windows/apps/hh770842.aspx#
Standalone tools to easily install, test, and profile the performance of a Windows Store app on a PC running Windows 8 without Visual Studio 2012 installed https://go.microsoft.com/fwlink/?LinkId=255953#
SSO - A set of controls and APIs that enable apps to integrate Single Sign On (SSO) with your Microsoft account and access information from SkyDrive and Hotmail https://go.microsoft.com/fwlink/?LinkID=247807&clcid=0x409#
Use advertising to monetize your applications while presenting a rich, engaging and immersive advertising experience to your users - Get the Windows 8 Ads SDK https://advertising.microsoft.com/windowsadvertising/developer#
Add a scalable and secure cloud backend as well as incorporate structured storage, user authentication, and push notifications - Get Windows Azure Mobile Services https://go.microsoft.com/fwlink/?LinkId=267242#
Windows 8 samples gallery https://code.msdn.microsoft.com/windowsapps/#
Download Sample pack (193 mb) https://go.microsoft.com/fwlink/?LinkID=243667&clcid=0x409#
Learn more about designing Windows apps https://msdn.microsoft.com/library/windows/apps/hh779072#
Essential .psd assets including templates, common controls, and common components such as contracts, notifications, and tiles - Download design assets https://www.microsoft.com/click/services/Redirect2.ashx?CR_EAC=300050688#

SkyDrive, Outlook and Identity Management with the Live SDKMake your apps or websites work with SkyDrive, Skype, and Outlook.com.

Live SDK developer guide https://msdn.microsoft.com/en-US/library/live/hh243641#
Live SDK core concepts https://msdn.microsoft.com/en-US/library/live/hh826528#
Live API reference https://msdn.microsoft.com/en-US/library/live/hh243650#
SkyDrive API https://msdn.microsoft.com/en-US/library/live/hh826521#
Identity API https://msdn.microsoft.com/en-US/library/live/hh826537#
Outlook.com API https://msdn.microsoft.com/en-US/library/live/hh826535#

Image258 
Key Facts There is an ever-growing list of supported programming environments, beyond the ones in the slide above.

  1. Some other options that are available 
    • Support for Direct 2D and 3D programming
      • This programming model offers a collection of APIs for handling advanced graphics, such as multimedia graphics, animation, vectors.
      • There is also support for advanced sound and music
      • It is the same programming model used by Xbox game developers
      • Requires the use of C and C++ programming
    • Can take advantage of hardware acceleration ( GPU )
  2. Third-party gaming platforms are supported
    • Scirra
    • Gamemaker
    • Unity

Image259

Key Facts Visual Studio only runs in Windows 8. But even if you have a Mac, it is possible to run Windows 8 and a VM. There are free versions of Visual Studio, called Visual Studio Express.

  1. You can view and download the samples here:

Image260

Key FactsMicrosoft has pioneered the modern UI, which is a collection of design guidelines that are changing the face of computing. Many of the leading high-tech companies are now embracing this new way of designing applications, focusing on the content, not the chrome. Gone are the days of 3-D shadows, gratuitous animations, and the concept of skeumorphism. Users want a clean interface without distractions. Here are some other pointers :

  1. The modern UI was inspired by the Swiss movement of the 1960s
  2. From a font perspective, the UI was built upon the Segoe UI font, which was inspired by Helvetica and the Swiss movement
  3. Minimize dependencies on graphics and focus on typography
    1. Often described as sleek, quick, modern
  4. Influences the design of Windows phone, the Microsoft Web properties,and the Xbox dashboard
  5. Animation does play a role, with respect to touch gestures such as swipe and so on

Image261

Key FactsIt is important to know why Windows phone uses a simulator and why Windows 8 applications use an emulator.

  1. Windows phone requires an emulator because it doesn’t run natively on a Windows 8 developer computer. The Windows Phone app is not running on its native OS, which would be the phone itself.
  2. Windows 8 runs in the simulator. The simulator is nothing more than a fancy remote desktop app, that provides added features for the developer to test with, such as changing device orientation and resolutions - to name a few.

Image262

Key FactsDevelopers can choose from among a variety of templates. Each of these template types is available for various programming languages. The blank app template has the fewest bells and whistles, and requires the most work for the developer. You are basically starting from scratch here - there is no user interface to start with. Developers must add the necessary controls and markup to design the interface .

Image266

Key Facts The grid app template is very powerful. It makes it very easy to model applications where the data is hierarchical in nature. An application can have many groups , and each group can have many items. All the necessary navigation and relationships exist within the template. Even a default data model is provided that the developer can modify to suit his application needs.

 04011igu

  1. The four built in objects are:
    • SampleDataCommon
    • SampleDataGroup
    • SampleDataItem
    • SampleDataSource
  2. The important step here is to understand the data model.
  3. As explained previously, groups have many items.
  4. You will see this reflected in the code.
  5. Also note that both groups and items share similar or common properties, such as a title, description, and image.
Class How used What it is What it contains
SampleDataCommon Base class to both SampleDataGroup and SampleDataItem Represents data that is common to both groups and items. Title, Subtitle, Description, Image
SampleDataItem Represents an item The SampleDataItem represents a child or single item Content. SampleDataItem is stored as a collection withing SampleDataGroup
SampleDataGroup Represents a group The SampleDataGroup is the group or parent of many SampleDataItems Contains a collection of many SampleDataItems
SampleDataSource Represents a collection of Groups. This is the master data source for the application. It is the container of all data. Contains a collection of many SampleDataGroups

Image267 
Key Facts This template is similar to the grid app template. Instead of having separate pages for groups and for items, they are combined into a split screen scenario. This allows end-users to minimize paging in and paging out of groups and items.

Image268 
Key Facts There are dozens of controls available to the Windows 8 developer. There is also a vibrant ecosystem where developers can purchase third-party controls. To view the built-in controls from within Visual Studio you will select view/toolbox. Some of the controls are simply containers for other controls, such as the layout panels.

Image269 
Key Facts Building a user interface typically means dragging controls from the toolbox onto the designer surface. This can be done either from Blend or from Visual Studio. Wwhen dragging controls into a XAML page, you are essentially typing in example code into the designer automatically. This means that developers can directly type in XAML and not drag controls from the toolbox if desired. Itworks the same way as web development works in that you don't have to use a designer and you can do it by hand.

  1. There are generally two activities that developers engage in:
    • Creating the user interface as described above
      • Working with the .xaml page
    • Entering code behind, which is code that execute based on the changing state of controls ( for example the user clicks on a button and code must execute )
      • Working with the .cs page

Image270

Key Facts Properties allow you to customize the appearance and behavior of controls. More complex uses of properties involve nesting and elements. Be aware that there are default values. If, for example, you do not specify the grid and row attributes of a control, they will default to zero. There are various other default values depending on the control.

  1. Properties can be changed in several ways at design time:
    • You can use the properties Windows of both Blend and Visual Studio
    • You can edit the XAML directly, and bypass the properties Windows completely
  2. Properties can be changed at runtime
    • Explained in the next section

Image271

Key FactsControl properties can be modified with code at runtime. This is always easier if you provide a name for a control. If you do not, you will need to navigate the visual tree and make use of the inherit parent-child relationship among controls. The code in the slide above illustrates both approaches.

Image272
Key Facts Events get triggered due to a user action or an internal change due to a sensor or a programmatically generated event. To enable controls to respond to user input, you will need to attach an event procedure. This can be done either through the declarative markup, or using code behind techniques. It is sometimes necessary to attach events at runtime .

Image273
Key Facts Data binding is important because it minimizes the code you have to write. It allows your user interface to automatically get populated with data from bound objects. You would normally have to write a lot of code behind to achieve the same result that you can declaratively using the binding syntax described here and on the next few slides.

  1. There is generally a source and a target
    • The source is typically an object that implements INotifyPropertyChanged
      • The source is generally an object that contains the data to be displayed to the user
      • This makes it possible for the object to "notify" the control when the data has changed, thus enabling the controls to request the new data from their bound object and update the user interface
    • The target is generally a user interface element
      • It implements DependencyObject
      • Dependencies allow user interface elements to communicate with the underlying data source ( typically poco objects )

Image274 
Key Facts There is a special syntax for binding expressions. Note the use of the curly brace and the keyword "Binding." It is even possible to convert from the source to the target, using a value converter.

Image275
Key Facts Data context is a concept where objects can inherit data binding information from successive parent objects in an object relationship hierarchy. Binding would not be possible without a corresponding data context.

  1. It generally represents the data source that is used for data binding.
  2. A typical use of DataContext is to set it directly to a data source object.
    1. This data source might be an instance of a class such as a business object.
    2. Or you can create a data source as an observable collection, so that the data context enables detecting changes in the backing collection.

Image276 

Key Facts Note the use of the item template in the list view control. Without any code we can display a list of students in the <ListView> control.

  1. The item template is bound to the student object
  2. The student object implements INotifyPropertyChanged
  3. A student has a first name and last name
  4. Students is an observable collection and is bound to the list control

Image277

Key Facts There are a few basic steps to binding collections to controls. You can see those requirements above.

  1. INotifyCollectionChanged notifies listeners ( controls ) when an individual item in the collection gets added or removed. This allows the control to get the latest data.
  2. If you need to loop through the collection, think about using the IEnumerable interface. The list in the collection is represented by ObservableCollection.
  3. ObservableCollection is simply a collection class that provides notifications to listeners when anything gets added or removed from the collection.
    • This collection implements INotifyCollectionChanged and INotifyPropertyChanged.
    • The INotifyCollectionChanged takes place when something in the collection is added, removed, removed etc.
    • The INotifyPropertyChanged gets fired as an event when any property value gets changed
      • The user will modify a customer record, for example, and the resulting event will be INotifyPropertyChanged, which will notify the user interface that a property has changed and that it should redraw itself the new data.

Image278

 Key Facts Let's switch gears and now talk about Windows phone development. As you recall there is a separate store or marketplace for the phone platform. It is separate from the Windows 8 store or marketplace. There is also a separate SDK.

  1. Some of the built in templates differ. some of the templates include the following Windows phone template types:
    • Data Bound app
    • Panorama app
    • Pivot app
    • Direct 3D
    • XNA
    • HTML 5
    • Audio playback
    • Audio streaming
    • Scheduled task
  2. But there are a lot of similarities too.
    • They both share the use of XAML, C#/VB, C++
    • Much of the primitives in the .NET framework are identical
    • Too many more to list

Image279

Key Facts There are 10 general steps to getting not only developing, but getting your app into the store.

Step 1 Idea Conception
Step 2 Download Tooling, SDKs
Step 3 Establish Windows Store Developer Account at Microsoft Dev Center Portal
Step 4 (optional) Advertising
Step 5 App Development, App Package Creation
Step 6 Upload App package to Dev Center Portal
Step 7 Finish completing work at Dev Center Portal
Step 8 Wait for Certification
Step 9 Fix non-compliance errors and re-submit.
Step 10 Raise awareness, Make adjustments, Enhance application

Image280

 Key Facts It is relatively easy to set up your Windows 8 computer to develop Windows Phone 8 applications. your typical 64-bit setup of Windows 8 should work.

  1. The SDK is for building games for Windows Phone 8 or Windows phone 7.5
  2. The SDK includes Visual Studio express 2012 for Windows Phone
  3. The SDK will also work as an add-in to higher versions of Visual Studio
  4. The SDK includes multiple emulators and some profiling tools
  5. Some testing tools are also provided

Image281

Key Facts Microsoft's dream about one platform for all devices is coming true. The latest mobile operating system for Windows phone is a full-fledged NT kernel.

  1. It is called "Shared Windows Core"
  2. Massive amounts of plumbing code around the filesystem and security infrastructure is common
  3. This allows developers to create apps and drivers that span three distinct environments of phone, tablet, and desktop
  4. This also means hardware manufacturers only have to write the device drivers once
  5. This also goes a long way in bringing browsers to parity between desktop, tablet, and phone
  6. The good news is for enterprises because now Windows Phone 8 includes Secure Boot, BitLocker and a bunch of encryption
  7. There's also shared libraries for C and C++, and Direct X

Image283

 Key Facts You will notice that Windows phone 8 brings a lot to the table compared to its predecessor of phone 7.1

  1. For serious game writers Direct 2D and 3D bring incredible power to the forefront
  2. Direct 3D allows you to leverage the GPU, giving you hardware acceleration for the entire 3-D rendering pipeline
  3. Direct3D competes with OpenGL ( as a frame of reference )
Introduction to the Multilingual App Toolkit https://channel9.msdn.com/Series/Introducing-Windows-8/Introduction-to-the-Multilingual-App-Toolkit#
Windows Azure SDK for Windows 8 and Windows Phone 8 https://www.windowsazure.com/en-us/downloads/#
Live SDK for Windows Phone https://go.microsoft.com/fwlink/?LinkId=267558#
Windows Phone Toolkit https://go.microsoft.com/fwlink/?LinkId=267555#
Windows Phone Power Tools https://wptools.codeplex.com/#
Coding4Fun Toolkit for Windows Phone https://go.microsoft.com/fwlink/?LinkId=267557#

Image284

 Key Facts The Windows phone Offers some unique features.

  1. Win32 and COM APIs give you some low level features not previously available, such as Winsock, for those that want to do direct TCP/IP sessions.
  2. There's a brand-new API for speech synthesis and recognition
  3. The Windows lock screen background can leverage background image providers
    • The user can customize notifications on the lock screen
  4. The SharedMediaTask allows an application to launch a dialogue that allows a user to share a picture or video on social networks
  5. A wallet namespace is available to define payment instruments that work with Near Field Communications and the Secure Element on the phone

Conclusion This content was meant as additional guidance to that already posted on:
https://www.windows8appfactor.com If you have material you think I should add I would love to hear about it. This was my first pass through so I'm sure I will enhance it over time.

Setting Up before you arrive at an AppFactor EventIf you are planning to attend some of the in-person events, here are some links to some of the tooling. Be ready before arriving.

Trial version of Windows 8image https://aka.ms/AppFactorWin8
Related tooling image https://aka.ms/AppFactorDownloads