W8/WP8 App Dev for SAP, Part 3B: Developing for Windows Phone 8 and Windows 8

766 views

Published on

Published in: Technology
  • Be the first to comment

W8/WP8 App Dev for SAP, Part 3B: Developing for Windows Phone 8 and Windows 8

  1. 1. Daniel Kreuzhofer UX Consultant Microsoft Consulting Services Germany Cross Development Windows 8 and Windows Phone 8
  2. 2. • Linked files • #if conditionals • Using Extension methods to bridge implementation differences • MVVM • Portable Class Libraries • A common user experience bringing high-quality experiences to the user. Best Practices for Windows 8 / Windows Phone 8 7/26/2013MS UX Team Germany2
  3. 3. Windows 8 7/26/2013MS UX Team Germany3 Common Structure Windows Phone 8
  4. 4. Common APIs in Windows 8 and Windows Phone 8
  5. 5. Your apps Your way Windows Phone 8 Developer Platform XAML Apps Direct3D Apps XAML Maps Geolocation Sensors In-App Purchase Direct3D HTML XML Threading Touch Speech XAudio2 Phone Features Push Camera Video Proximity Media Foundation Calendar Wallet Contacts Core Types VoIP STL Multitasking Live Tiles Memory Async Enterprise CRT C# and VB C#, VB, and C++ C++ File system, Networking, Graphics, Media Core Operating System
  6. 6. 7/26/2013MS UX Team Germany6 “Add as Link”
  7. 7. 7/26/2013MS UX Team Germany7 “Add as Link” Windows 8 Windows Phone 8
  8. 8. 7/26/2013MS UX Team Germany8 Common APIs Common Base Class Library Hardware Storage (Files and Folders) Different Launchers and Choosers Sharing APIs
  9. 9. 7/26/2013MS UX Team Germany9 #if Conditional Blocks Windows 8 #if NETFX_CORE Dispatcher.RunAsync(CoreDispatcherPriority.Normal, () => { #endif #if WINDOWS_PHONE Deployment.Current.Dispatcher.BeginInvoke(() => { #endif Windows Phone 8
  10. 10. 7/26/2013MS UX Team Germany10 #if Conditional Blocks Windows 8 #if NETFX_CORE new MessageDialog(Content, Title).ShowAsync(); #endif #if WINDOWS_PHONE MessageBox.Show(Content, Title, MessageBoxButton.OK); #endif Windows Phone 8
  11. 11. 7/26/2013MS UX Team Germany11 Threading Windows 8 AND Windows Phone 8 #if NETFX_CORE Dispatcher.RunAsync(CoreDispatcherPriority.Normal, () => { #else Deployment.Current.Dispatcher.BeginInvoke(() => { #endif double _accelX = args.Reading.AccelerationX; double _accelY = args.Reading.AccelerationY;
  12. 12. 7/26/2013Microsoft confidential12 Web Service
  13. 13. 7/26/2013MS UX Team Germany13 HttpWebResponse and HttpWebRequest Windows 8 var request = (HttpWebRequest)WebRequest.Create(autoCompleteUri); HttpWebResponse response = (HttpWebResponse)await request.GetResponseAsync(); // retrieve data using StreamReader
  14. 14. 7/26/2013MS UX Team Germany14 HttpWebResponse and HttpWebRequest Windows Phone 8 var request = (HttpWebRequest)WebRequest.Create(autoCompleteUri); request.BeginGetResponse(new AsyncCallback(AutoCompleteCallback), request); } private void AutoCompleteCallback(IAsyncResult callback) { HttpWebRequest request = (HttpWebRequest)callback.AsyncState; HttpWebResponse response = (HttpWebResponse)request.EndGetResponse(callback); // retrieve data using StreamReader }
  15. 15. Convergence through Extension
  16. 16. 7/26/2013MS UX Team Germany16 Extension Methods Windows Phone 8 HttpWebRequest Extension public static Task<HttpWebResponse> GetResponseAsync(this HttpWebRequest request) { var taskComplete = new TaskCompletionSource<HttpWebResponse>(); request.BeginGetResponse(asyncResponse => { HttpWebRequest responseRequest = (HttpWebRequest)asyncResponse.AsyncState; HttpWebResponse someResponse = (HttpWebResponse)responseRequest.EndGetResponse(asyncResponse); taskComplete.TrySetResult(someResponse); }, request); return taskComplete.Task; }
  17. 17. 7/26/2013MS UX Team Germany17 HttpWebResponse and HttpWebRequest Windows 8 AND Windows Phone 8 var request = (HttpWebRequest)WebRequest.Create(autoCompleteUri); HttpWebResponse response = (HttpWebResponse)await request.GetResponseAsync(); // retrieve data using StreamReader
  18. 18. Use PCLs whenever possible
  19. 19. 7/26/2013MS UX Team Germany19 HttpClient now available on Windows Phone 8 Available on Nuget as an extension package
  20. 20. Convergence through Architecture
  21. 21. Model-View-ViewModel (MVVM)
  22. 22. Portable Class Libraries
  23. 23. 4 5 7 7.5 8 4 4.0.3 4.5 Core BCL ✔ ✔ ✔ ✔ ✔ ✔ ✔ ✔ ✔ ✔ Core XML ✔ ✔ ✔ ✔ ✔ ✔ ✔ ✔ ✔ ✔ LINQ ✔ ✔ ✔ ✔ ✔ ✔ ✔ ✔ ✔ IQueryable ✔ ✔ ✔ ✔ ✔ ✔ ✔ ✔ "dynamic" keyword ✔ ✔ ✔ ✔ ✔ Core WCF ✔ ✔ ✔ ✔ ✔ ✔ ✔ ✔ ✔ Core networking ✔ ✔ ✔ ✔ ✔ ✔ ✔ ✔ ✔ View models ✔ ✔ ✔ ✔ ✔ ✔ ✔ Data annotations ✔ ✔ ✔ ✔ ✔ ✔ XLINQ ✔ ✔ ✔ ✔ ✔ ✔ ✔ ✔ ✔ MEF ✔ ✔ ✔ ✔ ✔ ✔ Data contract serialization ✔ ✔ ✔ ✔ ✔ ✔ ✔ ✔ ✔ XML serialization ✔ ✔ ✔ ✔ ✔ ✔ ✔ ✔ ✔ Json serialization ✔ ✔ ✔ ✔ ✔ ✔ ✔ ✔ ✔ System.Numerics ✔ ✔ ✔ ✔ ✔ ✔ Xbox 360Feature Silverlight Windows Phone Metro style apps .NET Framework
  24. 24. Cross-platform app architecture
  25. 25. 7/26/2013MS UX Team Germany26 Different Form Factors Require Different UX Windows Phone 8 Windows 8 Screen Size 800x480 1280x720 1280x768 Screen Size 1024x768 2,560x1,440 everything in between
  26. 26. 7/26/2013MS UX Team Germany27 Different Form Factors Require Different UX Windows Phone 8 Windows 8 Orientation Portrait Landscape Orientation Portrait Landscape Snapped
  27. 27. MS UX Team Germany28 Different Controls GridView Group-able Array of Tiles Dynamic item size
  28. 28. MS UX Team Germany29 Different Controls FlipView Browsing View Touch-optimized for left-right navigation
  29. 29. MS UX Team Germany30 Different Controls Semantic Zoom Pinch-zoom through grouped list of items
  30. 30. MS UX Team Germany31 Different Form Factors Require Different UX Panorama Introduction and exploratory content
  31. 31. MS UX Team Germany32 Different Form Factors Require Different UX Pivot Scanning views Grouped information
  32. 32. MS UX Team Germany33 Different Form Factors Require Different UX LongListSelector Headers and Footers Group header navigation
  33. 33. MS UX Team Germany34 Translating UX Semantic Zoom  Pivot
  34. 34. MS UX Team Germany35 Translating UX – Details View Horizontal scroll  Vertical scroll
  35. 35. MS UX Team Germany36 Different Form Factors Require Different UX GridView  LongListSelector
  36. 36. Summary
  37. 37. • Abstracting Models, ViewModels • Binding data to the View • Linked files • Models, Services could be encapsulated in Portable Class Libraries • Shared APIs (hardware, storage, base class libraries) • Using #if conditionals for small code differences • Using Extension methods to bridge implementation differences • Async-await model for HttpWebResponse/Request • Focus on the user experience that works for the form factor Windows 8 / Windows Phone 8 Apps Are a Perfect Match 7/26/2013MS UX Team Germany38
  38. 38. The information herein is for informational purposes only an represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. © 2012 Microsoft Corporation. All rights reserved. Microsoft, Windows, Windows Vista and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

×