Slide 1

Slide 1 text

Intro To Windows 8 Apps For Windows Developers KYLE MITOFSKY

Slide 2

Slide 2 text

Overview Mobile Usages WinRT Framework Xaml Overview Model-View-ViewModel ‘Metro’ Design

Slide 3

Slide 3 text

Mobile Proliferation  Deployment Targets  Desktop  Windows  Web  All OS  Mobile  Windows  Apple  Android

Slide 4

Slide 4 text

Framework Design Guidelines  Metro / Modern UI Style / Window 8 / Windows Store / WinRT  Fast and Fluid  Content over chrome  Immersive  Touch Centric  Permissions / Security

Slide 5

Slide 5 text

Async and Await Sub Async cmdExecuteTask_Click(sender As Object, e As EventArgs) _ Handles cmdExecuteTask.Click Dim retval = Await DataAccessCode.GetCustomerListAsync("CA") End Sub  With Async (Good)  With Callbacks (Bad) Private TargetHandler As GetCustomerListHandler = AddressOf DataAccessCode.GetCustomerList Private CallbackHandler As AsyncCallback = AddressOf MyCallbackMethod Sub cmdExecuteTask_Click(sender As Object, e As EventArgs) _ Handles cmdExecuteTask.Click TargetHandler.BeginInvoke("CA", CallbackHandler, Nothing) End Sub Sub MyCallbackMethod(ByVal ar As IAsyncResult) Dim retval As String() retval = TargetHandler.EndInvoke(ar) End Sub

Slide 6

Slide 6 text

Tips: Logos  Generate Logos with Expression Designer  Download Some Templates: Square Logo Wide Logo Because this is a lot of work

Slide 7

Slide 7 text

Tips: Namespaces  Make sure Xaml and Code-Behind namespaces match  Code scoped inside of root namespace Namespace Flyouts Public NotInheritable Class Settings  Xaml must include root namespace

Slide 8

Slide 8 text

Xaml Styles  Styles are just things that can set one or more properties on an object.  They can be applied within a scope or individually with keys   <Setter Property="FontSize" Value="40"/>

Slide 9

Slide 9 text

Templated Control  Set Style  Set Behavior  Let’s make a Control that Navigates to the Settings Panel <Setter Property="Content" Value="&#xE115;"/> <Setter Property="AutomationProperties.Name" Value="Settings"/> Private Sub OpenSettings(ByVal sender As Object, ByVal e As RoutedEventArgs) _ Handles Me.Click Windows.UI.ApplicationSettings.SettingsPane.Show() End Sub

Slide 10

Slide 10 text

Binding  Binding – Declaratively Link Two Properties  Data Context – Where to Look for Properties  INotifyPropertyChanged – How the Interface Knows to Update the Binding OnPropertyChanged("PropertyName") Target Element Target Property Binding Expression

Slide 11

Slide 11 text

Commands  Invoke In Xaml Private _wordSubmitCommand As RelayCommand Public ReadOnly Property WordSubmitCommand() As RelayCommand Get If _wordSubmitCommand Is Nothing Then _wordSubmitCommand = New RelayCommand(AddressOf WordSubmit) End If Return _wordSubmitCommand End Get End Property  Binds to RelayCommand on ViewModel Called Method

Slide 12

Slide 12 text

ReSharper Can Help with Plumbing  Menu: ReSharper > Templates Explorer  Live Templates are like VS Code Snippets, but much better.

Slide 13

Slide 13 text

Visual State with LayoutAwarePage  VisualState has content of StoryBoard Full Screen Portrait Snapped Filled

Slide 14

Slide 14 text

App Bar  Style – AppBarButtonStyle  Content – Font is Segoe UI Symbol  AutomationProperties.Name – Binds Button Text Character Map

Slide 15

Slide 15 text

Settings Charm AddHandler SettingsPane.GetForCurrentView.CommandsRequested  System asks which options you’d like on Settings Page Private Sub CommandsRequestedHandler(ByVal sender As SettingsPane, _ ByVal args As SettingsPaneCommandsRequestedEventArgs) Dim command As New SettingsCommand("Key", "Text", Sub(c) Show(New Settings)) args.Request.ApplicationCommands.Add(command) End Sub  Add SettingsCommands to EventArgs Dim helper = New Flyouts.SettingsHelper helper.AddCommand(Of Flyouts.Settings)("Settings")  Use SettingsHelper C# / VB

Slide 16

Slide 16 text

Persisting User Settings  Store Values Specific to the Current User Private Function LoadSettings(key As String) As Object Return ApplicationData.Current.LocalSettings.Values(key) End Function Private Sub SaveSettings(Of T)(value As T, key As String) ApplicationData.Current.LocalSettings.Values(key) = value End Sub  Retrieve Values Specific to the Current User

Slide 17

Slide 17 text

Demo Demo Time

Slide 18

Slide 18 text

Windows Store  Get A Windows Developer Account  https://appdev.microsoft.com/StorePortals/en-US/Home/Index  Project > Store > Create App Packages  WACK – Windows Application Certification Kit  Download New One for 8.1  Submission  Windows 8 app certification requirements (Windows)

Slide 19

Slide 19 text

Libraries  MVVM Light  By Laurent Bugnion (GalaSoft)  Callisto  By Tim Heuer (Microsoft)  WinRT Xaml Toolkit  Open Source

Slide 20

Slide 20 text

Windows 8 Resources  Virtual Office Hours  http://ohours.org/mcummings  http://ohours.org/jimoneil  App Builder  http://build.windowsstore.com

Slide 21

Slide 21 text

Further Reading  Active Blogs  Jerry Nixon’s Blog  Tim Heuer’s Blog  Pluralsight  Building Windows 8 Style Apps in C# and XAML  Building Windows 8 Applications with JavaScript and HTML  Windows 8 – From Start to Store  Building Windows 8 MVVM XAML Apps  Windows 8 – From Design to Delivery with C# and XAML

Slide 22

Slide 22 text

Bibliography  Async / Await  Async/Await - Best Practices in Asynchronous Programming  Asynchronous Programming with Async and Await (C# and Visual Basic)  Working with IAsync WinRT Methods  Logos  Generating Windows Store Logo Assets At Every Resolution  Windows 8 apps need 28 logo varietals; enter Expression Design  Download Microsoft Expression Design 4 Free  Templated Control  Walkthrough: A Custom Control in XAML isn’t a User Control  App Bar  Guidelines for app bars (Windows Store apps)  Walkthrough: The Windows 8 AppBar  Settings Charm  Guidelines for app settings (Windows Store apps)  How to Create a Windows 8 Settings Pane in XAML  SettingsPane.GetForCurrentView  Settings Helper: C# / VB  User Settings  Quickstart: Local application data (Windows Store apps using C#/VB/C++ and XAML)  ApplicationData.LocalSettings  ReSharper Live Templates  ReSharper Features: Code Templates