Maximizing code reuse betweenWindows Phone 8 and Windows 8Tom Walker@Tinytootorangesodacode.azurewebsites.netKen Cenerelli...
• Part 1: Hardware Overview Platform APIs Shared Core• Part 2: Development Techniques MVVM project structure Portable ...
• We are on the path to Windows and Windows Phoneconvergence• Right now Windows 8 and Windows Phone 8 have ashared core bu...
Some Key Differences• It’s important to design for the platform differences as wellas similaritiesMaximizing code reuse be...
Windows 8 PlatformMaximizing code reuse between WP8 and Windows 8
Windows Phone 8 PlatformMaximizing code reuse between WP8 and Windows 8
Shared APIsMaximizing code reuse between WP8 and Windows 8
What Shared Core Means• OS components such as the kernel, networking, graphicssupport, file system and multimedia are the ...
What Shared Core Doesn’t Mean• Windows 8 and Windows Phone 8 developers work toexactly the same APIs (though you will see...
Part 2: Development Techniques• Four examples of how you can approach code reuse: MVVM project structure Portable Class ...
MVVM - Overview• MVVM is an architectural pattern:• Relies on features XAML/C# provideMaximizing code reuse between WP8 an...
Why use MVVM?• Loose coupling between UI and code• Enables reusability• Separation between UX designer & developer• Increa...
MVVM components• Model Data or business logic Database, Web Services, File System, etc.• View Model A specialization of...
MVVM for code reuse• Create a separate UI for each platform to take advantage ofthe different screen sizes• MVVM by itself...
MVVM - Demo• Setting up a project to use MVVMMaximizing code reuse between WP8 and Windows 8Demo 1:MVVM Project Setup
Portable Class Libraries - Overview• Portable Class Libraries have been available since .NETFramework 4• Portable assembli...
Portable Class Libraries – What To Share• Any managed code you write, particularly app logic• Do not share conditional com...
Portable Class Libraries & MVVMMaximizing code reuse between WP8 and Windows 8
Portable Class Libraries - Demo• Creating a simple Portable Class LibraryMaximizing code reuse between WP8 and Windows 8De...
Shared XAML UI - Overview• Isolate parts of your UI into user controls and attempt toshare those. Windows Phone 8 and Wind...
Shared XAML UI – What To Share?Maximizing code reuse between WP8 and Windows 8
Maximizing code reuse between WP8 and Windows 8Demo 3:Shared XAML UI
Sharing Code - Overview• Change once, Change everywhere• Approaches: Add as Link #if conditional blocks Partial Classes...
Add As Link - Overview• Use this technique for any code you’re able to isolate that’splatform-independent and used in both...
#if Conditional Blocks - Overview• Pros: Enable/Disable lines or chunks of code based on compilation platform Existing c...
Partial Classes - Overview• Can put shared functionality in one code file and platformspecific code in additional code fil...
Maximizing code reuse between WP8 and Windows 8Demo 4:Creating a PartialClass
Part 3: Demo – An app for both platforms• Technologies Used: MVVM Light Toolkit Portable Class Library for JSON.NET (New...
Maximizing code reuse between WP8 and Windows 8Demo:Create an app forboth platforms
Actions to continue your learning• Build a project in both Windows 8 andWindows Phone 8• Create a Portable Class Library t...
Resources for Attendees• Channel 9: Building Apps for Both Windows 8 andWindows Phone 8 Jump Start http://bit.ly/18dELOu• ...
Related Sessions• Architecting mobile apps for Win8, IOS and Android Erik Renaud - ARC376• Building Mobile Experiences th...
Questions?• Tom Walker @Tinytoot orangesodacode.azurewebsites.net• Ken Cenerelli @KenCenerelli kencenerelli.wordpress....
Upcoming SlideShare
Loading in …5
×

Maximizing code reuse between Windows Phone 8 and Windows 8 (DevTeach Toronto 2013)

891 views

Published on

Examine how to better leverage the various technologies available to the developer to enable code reuse between Windows Phone 8 and Windows 8 Store apps.

The slides will be broken into two parts with the first looking at what the two platforms share in terms of hardware and their ""shared core"". After this it will dig into some code to demonstrate how portable class libraries, shared XAML UI and the MVVM project structure can make a developer's life so much easier.

Published in: Technology
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
891
On SlideShare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
0
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide
  • The only true reuse scenario that is currently supported is via a Portable Class Library
  • - Windows 8 and Windows Phone 8 Share Many Components At The Operating System Level
  • Created by John GossmanDerived from MVCRequired XAML Data Binding
  • ViewModel:-The glue that ties the View to the model – the UI to the data- Exposes data from the model that the view can bind toView: Each page shown to a user is a ViewData from model is displayed to userUsing binding
  • The only true reuse scenario that is currently supported is via a Portable Class Library
  • Assemblies that target multiple platformsSupport subset of .NET assemblies that target the platforms you choosePCL doesn’t allow any WinRT/WinPRT APIs – only .NET (to get WinRT APIs, you need to link)Pros: Written in managed code, complete reuse with the ability to simply “Add Reference” to the built assembly.Cons: Severe limitations imposed by the need to work across different platforms without targeting. Important features such as INotifyPropertyChanged and Task are missing making it difficult to use in practice.
  • Show how to reference a PCLThe most common recommendation is to put your models and business logic in a reusable PCL and put your platform-specific view models in the respective User Interface tiers
  • Demo: Creating a simple Portable Class LibraryUse same project as MVVM one?
  • - Microsoft insists that sharing XAML is not where you should invest time- Instead, you’ll have much more success structuring your app logic to make it reusable
  • Majority of UI will be platform specificPortable code can be compiled once and run on WP8 or W8 – anything in PCLCommon code is code that use APIs available to both platforms but not portable (WinRT APIs)B/C code must be compiled for each platform
  • Demo: Creating a User Control in each projectThis technique limited but it also does not scale well
  • This strategy is useful for where there are subtle differences (for example a different namespace or slightly different parameters to a method)The biggest issue with this strategy is that it can quite easily make code unreadable and hard to maintain.
  • This strategy is useful for where there are subtle differences (for example a different namespace or slightly different parameters to a method)The biggest issue with this strategy is that it can quite easily make code unreadable and hard to maintain.
  • - Demo: Adding a link between two projects OR Create a partial class
  • Maximizing code reuse between Windows Phone 8 and Windows 8 (DevTeach Toronto 2013)

    1. 1. Maximizing code reuse betweenWindows Phone 8 and Windows 8Tom Walker@Tinytootorangesodacode.azurewebsites.netKen Cenerelli@KenCenerellikencenerelli.wordpress.com
    2. 2. • Part 1: Hardware Overview Platform APIs Shared Core• Part 2: Development Techniques MVVM project structure Portable Class Libraries Shared XAML UI Sharing Code• Part 3: Demo – In-depth development for both platforms• Wrap-up Next Steps, Resources & Related Sessions Q & AAgendaMaximizing code reuse between WP8 and Windows 8
    3. 3. • We are on the path to Windows and Windows Phoneconvergence• Right now Windows 8 and Windows Phone 8 have ashared core but you cannot write once and run everywhere(unlike iOS or Android)• We can however leverage some existing architecturesimilarities between the twoPart 1: Hardware OverviewMaximizing code reuse between WP8 and Windows 8
    4. 4. Some Key Differences• It’s important to design for the platform differences as wellas similaritiesMaximizing code reuse between WP8 and Windows 8
    5. 5. Windows 8 PlatformMaximizing code reuse between WP8 and Windows 8
    6. 6. Windows Phone 8 PlatformMaximizing code reuse between WP8 and Windows 8
    7. 7. Shared APIsMaximizing code reuse between WP8 and Windows 8
    8. 8. What Shared Core Means• OS components such as the kernel, networking, graphicssupport, file system and multimedia are the same on bothWindows 8 and Windows Phone 8• Hardware manufacturers work with the same driver modelon both platforms• Windows Phone gets the support for multi-core and otherhardware features that Windows has had for years• These solid, common foundations makes it easier to extendthe Windows platform into the futureMaximizing code reuse between WP8 and Windows 8
    9. 9. What Shared Core Doesn’t Mean• Windows 8 and Windows Phone 8 developers work toexactly the same APIs (though you will see more commonality as new features are introduced toboth platforms in the future)Maximizing code reuse between WP8 and Windows 8
    10. 10. Part 2: Development Techniques• Four examples of how you can approach code reuse: MVVM project structure Portable Class Libraries Shared XAML UI Add As Link (Partial Classes)• Accelerate your app development with these methods• Not all will work in every situationMaximizing code reuse between WP8 and Windows 8
    11. 11. MVVM - Overview• MVVM is an architectural pattern:• Relies on features XAML/C# provideMaximizing code reuse between WP8 and Windows 8
    12. 12. Why use MVVM?• Loose coupling between UI and code• Enables reusability• Separation between UX designer & developer• Increased testabilityMaximizing code reuse between WP8 and Windows 8
    13. 13. MVVM components• Model Data or business logic Database, Web Services, File System, etc.• View Model A specialization of the Model that the View uses Informs the view to update No UI code• View Represents the user interface the user sees Should contain a minimal amount of codeMaximizing code reuse between WP8 and Windows 8
    14. 14. MVVM for code reuse• Create a separate UI for each platform to take advantage ofthe different screen sizes• MVVM by itself doesn’t help us for sharing code acrossplatforms – only on the same platform• Use Portable Class Libraries to share models and viewmodels across platformsMaximizing code reuse between WP8 and Windows 8
    15. 15. MVVM - Demo• Setting up a project to use MVVMMaximizing code reuse between WP8 and Windows 8Demo 1:MVVM Project Setup
    16. 16. Portable Class Libraries - Overview• Portable Class Libraries have been available since .NETFramework 4• Portable assemblies can target multiple platforms, includingWindows 7, Windows 8, Windows Phone, Silverlight, andXbox 360• Only allowed to call APIs available across multipleplatforms• Note: the Express versions of Visual Studio 2012 don’tinclude a Portable Class Library project template. It isavailable only in Visual Studio 2012 Pro or greaterMaximizing code reuse between WP8 and Windows 8
    17. 17. Portable Class Libraries – What To Share• Any managed code you write, particularly app logic• Do not share conditional compilation code (code for WP8that you want to implement differently for Windows 8) Instead, abstract away the platform-dependent code and share only theportable, platform-independent code• Windows Runtime APIs aren’t portable and can’t be used ina Portable Class Library There is overlap in the Windows Runtime APIs that are supported on WP8and Windows 8. However, binary compatibility is not supported. Your codehas to be compiled for each platform• Doesn’t use UI constructs Although XAML for WP8 and Windows looks similar this code isn’t portableMaximizing code reuse between WP8 and Windows 8
    18. 18. Portable Class Libraries & MVVMMaximizing code reuse between WP8 and Windows 8
    19. 19. Portable Class Libraries - Demo• Creating a simple Portable Class LibraryMaximizing code reuse between WP8 and Windows 8Demo 2:Portable Class Library
    20. 20. Shared XAML UI - Overview• Isolate parts of your UI into user controls and attempt toshare those. Windows Phone 8 and Windows 8 bothsupport XAML user controls• New controls take advantage of form factor• Consider the Windows Phone when designing the Windows8 SnapView• Limitations XAML on Windows Phone 8 and XAML on Windows 8 is not binarycompatible Namespace prefixes are different in XAML for Windows Phone 8 and XAMLfor Windows 8Maximizing code reuse between WP8 and Windows 8
    21. 21. Shared XAML UI – What To Share?Maximizing code reuse between WP8 and Windows 8
    22. 22. Maximizing code reuse between WP8 and Windows 8Demo 3:Shared XAML UI
    23. 23. Sharing Code - Overview• Change once, Change everywhere• Approaches: Add as Link #if conditional blocks Partial Classes and MethodsMaximizing code reuse between WP8 and Windows 8
    24. 24. Add As Link - Overview• Use this technique for any code you’re able to isolate that’splatform-independent and used in both apps eg. User controls with no platform dependencies.• This is particularly useful when you’re trying to share codethat uses a Windows Runtime API that can’t be sharedinside a Portable Class LibraryMaximizing code reuse between WP8 and Windows 8
    25. 25. #if Conditional Blocks - Overview• Pros: Enable/Disable lines or chunks of code based on compilation platform Existing compilation constants NETFX_CORE Windows 8 WINDOWS_PHONE Windows Phone 8 Useful for when there are subtle differences in syntax or methods• Cons: A downside is it can make code unreadableMaximizing code reuse between WP8 and Windows 8
    26. 26. Partial Classes - Overview• Can put shared functionality in one code file and platformspecific code in additional code file• Classes are marked as partial and compiled into a singleclass• Separates platform specific features• Can use partial methods as a mechanism to separate outplatform specific logicMaximizing code reuse between WP8 and Windows 8
    27. 27. Maximizing code reuse between WP8 and Windows 8Demo 4:Creating a PartialClass
    28. 28. Part 3: Demo – An app for both platforms• Technologies Used: MVVM Light Toolkit Portable Class Library for JSON.NET (NewtonSoft) HttpClient for Windows 8 and Windows Phone 8 (release candidate) Add As Link ComicVine WebAPIMaximizing code reuse between WP8 and Windows 8
    29. 29. Maximizing code reuse between WP8 and Windows 8Demo:Create an app forboth platforms
    30. 30. Actions to continue your learning• Build a project in both Windows 8 andWindows Phone 8• Create a Portable Class Library to link thetwo projects• Choose one other development technique toextend your code between both projectsMaximizing code reuse between WP8 and Windows 8
    31. 31. Resources for Attendees• Channel 9: Building Apps for Both Windows 8 andWindows Phone 8 Jump Start http://bit.ly/18dELOu• Maximize code reuse between Windows Phone 8and Windows 8 http://bit.ly/11TfzOl• How to Make Portable Class Libraries Work forYou http://bit.ly/116yIL4• Channel 9: Create Cross-platform Apps usingPortable Class Libraries http://bit.ly/1906wv8Maximizing code reuse between WP8 and Windows 8
    32. 32. Related Sessions• Architecting mobile apps for Win8, IOS and Android Erik Renaud - ARC376• Building Mobile Experiences that Dont Suck Atley Hunter - MOB362• Designing Windows Store HTML5/JS Apps Mark Arteaga - WIN371• Bringing it all together Win8 WP8 Azure MVC... Colin Melia - WIN312Maximizing code reuse between WP8 and Windows 8
    33. 33. Questions?• Tom Walker @Tinytoot orangesodacode.azurewebsites.net• Ken Cenerelli @KenCenerelli kencenerelli.wordpress.comMaximizing code reuse between WP8 and Windows 8

    ×