SlideShare a Scribd company logo
2013-02-09




                                    Laurent Duveau
Developing for both
Windows Phone 8
and Windows 8

                                       ldex.ca       @laurentduveau

             Laurent Duveau
             Windows 8 Instructor


             MVP / MCT / RD
Agenda
• Building for Windows Devices
   • Consistent Experience
      • Tiles, Notifications, Animations
   • Differences
      • Screen Sizes, Controls, Lifecycle
• Minimizing Development
   • Reuse
      • Portable Class Library
   • Sharing Code
Some Key Differences
It’s important to design for the platform differences as well as similarities




   Screen Size                                  Controls                        Lifecycle
   Windows Phone                                Windows Phone                   Windows Phone

   800x480, 1280x720, 1280x768                  Panorama, Pivot, ListPicker     Launched from start/apps list.
   Portrait, Landscape                          LongListSelector                Tombstones apps

   Windows                                      Windows                         Windows

   1024x768                                    GridView, ListView, Semantic    Resumes existing apps
   Portrait, Landscape, Snapped                 Zoom, FlipView                  No tombstoning
Strategies for sharing in a XAML app




• Separate UI from app logic (Model-View-ViewModel)
• Share portable .NET code in Portable Class Library
• Use common Windows Runtime API (Add as Link)
• Complete with platform-specific code as necessary
Separate UI from app logic
Model-View-ViewModel (MVVM)
Cross-platform app architecture
Minimizing Development
Reuse
Reusing pre-built components or libraries




Portable Class Library
• Managed Code
• Reusable library
• One codebase with no conditional compilation
Demo
Portable Class Libraries
Sharing Code
Reusing code by including code files in multiple projects




Share Code Files

•Use Add as Link to include same files in multiple projects
•Change once, Change everywhere
•What to do where platforms don’t match?
 •#if conditional blocks
 •Inheritance
 •Partial Classes and Methods
Sharing Code:             #if Conditional Blocks
• 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
• Can make code unreadable…
Sharing Code:     #if Conditional Blocks



#if NETFX_CORE
        using Windows.UI.Xaml.Media.Imaging;
#else
        using System.Windows.Media.Imaging;
#endif
Sharing Code:           #if Conditional Blocks



public object Convert(object value, Type targetType, object parameter,
           #if !NETFX_CORE
                      CultureInfo culture
           #else
                      string language
           #endif
)
Sharing Code:              Partial Classes & Methods


• Shared functionality in one code file              eg: DataSource.cs
• Platform specific code in additional code file     eg: DataSource.WP8.cs
• Classes are marked as partial and compiled into a single class
• Separates platform specific features
• Can use partial methods as a mechanism to separate out platform specific logic
Sharing Code:                   Partial Classes & Methods

/// <summary>
/// DataSource.cs
/// </summary>
public partial class DataSource:IDataSource {
    public async Task<IEnumerable<IFolder>> RetrieveFolders(IFolder root) {
        ... // other logic
        var folders = await LoadFolders(root);
        ... // other logic
        return folders
    }
}

/// <summary>
/// DataSource.WP8.cs
/// </summary>
public partial class DataSource {
    private async Task<IEnumerable<IFolder>> LoadFolders(IFolder root) {
        ...
    }
}
Demo
Sharing Code

More Related Content

Similar to Building apps for WP8 and Win8

Eric grover strategies for sharing code with windows 8 and windows phone 8 ...
Eric grover   strategies for sharing code with windows 8 and windows phone 8 ...Eric grover   strategies for sharing code with windows 8 and windows phone 8 ...
Eric grover strategies for sharing code with windows 8 and windows phone 8 ...
Eric Grover
 
Universal Apps Oct 2014
Universal Apps Oct 2014Universal Apps Oct 2014
Universal Apps Oct 2014
Joe Healy
 
Visual Basic User Interface-III
Visual Basic User Interface-IIIVisual Basic User Interface-III
Visual Basic User Interface-III
Sharbani Bhattacharya
 
TypeScript - Javascript done right
TypeScript - Javascript done rightTypeScript - Javascript done right
TypeScript - Javascript done right
Wekoslav Stefanovski
 
Android Introduction
Android IntroductionAndroid Introduction
Android Introduction
Sharmistha Mandal
 
Android Workshop_1
Android Workshop_1Android Workshop_1
Android Workshop_1
Purvik Rana
 
Difference between .net core and .net framework
Difference between .net core and .net frameworkDifference between .net core and .net framework
Difference between .net core and .net framework
Ansi Bytecode
 
Android application development
Android application developmentAndroid application development
Android application development
Linh Vi Tường
 
Anatomy of an HTML 5 mobile web app
Anatomy of an HTML 5 mobile web app Anatomy of an HTML 5 mobile web app
Anatomy of an HTML 5 mobile web app
Ivano Malavolta
 
Building a Modern Windows App
Building a Modern Windows AppBuilding a Modern Windows App
Building a Modern Windows App
Brent Edwards
 
Nashua Cloud .NET User Group - Basic WP8 App Dev With XAML and C#, April 2013
Nashua Cloud .NET User Group - Basic WP8 App Dev With XAML and C#, April 2013Nashua Cloud .NET User Group - Basic WP8 App Dev With XAML and C#, April 2013
Nashua Cloud .NET User Group - Basic WP8 App Dev With XAML and C#, April 2013
John Garland
 
Android development workshop
Android development workshopAndroid development workshop
Android development workshop
Jeff Sonstein
 
Meetup. Technologies Intro for Non-Tech People
Meetup. Technologies Intro for Non-Tech PeopleMeetup. Technologies Intro for Non-Tech People
Meetup. Technologies Intro for Non-Tech People
IT Arena
 
C# everywhere: Xamarin and cross platform development
C# everywhere: Xamarin and cross platform developmentC# everywhere: Xamarin and cross platform development
C# everywhere: Xamarin and cross platform development
Gill Cleeren
 
Sharing code win8 wp8
Sharing code win8 wp8Sharing code win8 wp8
Sharing code win8 wp8
matthidinger
 
Training - Managing .NET/J2EE Projects
Training - Managing .NET/J2EE ProjectsTraining - Managing .NET/J2EE Projects
Training - Managing .NET/J2EE Projects
Shashank Banerjea
 
Difference between .net and asp.net all you need to know
Difference between .net and asp.net  all you need to knowDifference between .net and asp.net  all you need to know
Difference between .net and asp.net all you need to know
sophiaaaddison
 
Develop business apps cross-platform development using visual studio with x...
Develop business apps   cross-platform development using visual studio with x...Develop business apps   cross-platform development using visual studio with x...
Develop business apps cross-platform development using visual studio with x...
Alexander Meijers
 
Create Cross Platform Apps with Portable Class Libraries
Create Cross Platform Apps with Portable Class LibrariesCreate Cross Platform Apps with Portable Class Libraries
Create Cross Platform Apps with Portable Class Libraries
Karthikeyan Anbarasan (AK)
 
Developing for Windows Phone 8 and Windows 8
Developing for Windows Phone 8 and Windows 8Developing for Windows Phone 8 and Windows 8
Developing for Windows Phone 8 and Windows 8
Dave Bost
 

Similar to Building apps for WP8 and Win8 (20)

Eric grover strategies for sharing code with windows 8 and windows phone 8 ...
Eric grover   strategies for sharing code with windows 8 and windows phone 8 ...Eric grover   strategies for sharing code with windows 8 and windows phone 8 ...
Eric grover strategies for sharing code with windows 8 and windows phone 8 ...
 
Universal Apps Oct 2014
Universal Apps Oct 2014Universal Apps Oct 2014
Universal Apps Oct 2014
 
Visual Basic User Interface-III
Visual Basic User Interface-IIIVisual Basic User Interface-III
Visual Basic User Interface-III
 
TypeScript - Javascript done right
TypeScript - Javascript done rightTypeScript - Javascript done right
TypeScript - Javascript done right
 
Android Introduction
Android IntroductionAndroid Introduction
Android Introduction
 
Android Workshop_1
Android Workshop_1Android Workshop_1
Android Workshop_1
 
Difference between .net core and .net framework
Difference between .net core and .net frameworkDifference between .net core and .net framework
Difference between .net core and .net framework
 
Android application development
Android application developmentAndroid application development
Android application development
 
Anatomy of an HTML 5 mobile web app
Anatomy of an HTML 5 mobile web app Anatomy of an HTML 5 mobile web app
Anatomy of an HTML 5 mobile web app
 
Building a Modern Windows App
Building a Modern Windows AppBuilding a Modern Windows App
Building a Modern Windows App
 
Nashua Cloud .NET User Group - Basic WP8 App Dev With XAML and C#, April 2013
Nashua Cloud .NET User Group - Basic WP8 App Dev With XAML and C#, April 2013Nashua Cloud .NET User Group - Basic WP8 App Dev With XAML and C#, April 2013
Nashua Cloud .NET User Group - Basic WP8 App Dev With XAML and C#, April 2013
 
Android development workshop
Android development workshopAndroid development workshop
Android development workshop
 
Meetup. Technologies Intro for Non-Tech People
Meetup. Technologies Intro for Non-Tech PeopleMeetup. Technologies Intro for Non-Tech People
Meetup. Technologies Intro for Non-Tech People
 
C# everywhere: Xamarin and cross platform development
C# everywhere: Xamarin and cross platform developmentC# everywhere: Xamarin and cross platform development
C# everywhere: Xamarin and cross platform development
 
Sharing code win8 wp8
Sharing code win8 wp8Sharing code win8 wp8
Sharing code win8 wp8
 
Training - Managing .NET/J2EE Projects
Training - Managing .NET/J2EE ProjectsTraining - Managing .NET/J2EE Projects
Training - Managing .NET/J2EE Projects
 
Difference between .net and asp.net all you need to know
Difference between .net and asp.net  all you need to knowDifference between .net and asp.net  all you need to know
Difference between .net and asp.net all you need to know
 
Develop business apps cross-platform development using visual studio with x...
Develop business apps   cross-platform development using visual studio with x...Develop business apps   cross-platform development using visual studio with x...
Develop business apps cross-platform development using visual studio with x...
 
Create Cross Platform Apps with Portable Class Libraries
Create Cross Platform Apps with Portable Class LibrariesCreate Cross Platform Apps with Portable Class Libraries
Create Cross Platform Apps with Portable Class Libraries
 
Developing for Windows Phone 8 and Windows 8
Developing for Windows Phone 8 and Windows 8Developing for Windows Phone 8 and Windows 8
Developing for Windows Phone 8 and Windows 8
 

More from Laurent Duveau

Shit happens… debugging an Angular app.
Shit happens… debugging an Angular app.Shit happens… debugging an Angular app.
Shit happens… debugging an Angular app.
Laurent Duveau
 
8 things you didn't know about the Angular Router, you won't believe #6!
8 things you didn't know about the Angular Router, you won't believe #6!8 things you didn't know about the Angular Router, you won't believe #6!
8 things you didn't know about the Angular Router, you won't believe #6!
Laurent Duveau
 
De 0 à Angular en 1h30! (french)
De 0 à Angular en 1h30! (french)De 0 à Angular en 1h30! (french)
De 0 à Angular en 1h30! (french)
Laurent Duveau
 
Angular 6, CLI 6, Material 6 (french)
Angular 6, CLI 6, Material 6 (french)Angular 6, CLI 6, Material 6 (french)
Angular 6, CLI 6, Material 6 (french)
Laurent Duveau
 
Angular Advanced Routing
Angular Advanced RoutingAngular Advanced Routing
Angular Advanced Routing
Laurent Duveau
 
Debugging an Angular App
Debugging an Angular AppDebugging an Angular App
Debugging an Angular App
Laurent Duveau
 
TypeScript: Angular's Secret Weapon
TypeScript: Angular's Secret WeaponTypeScript: Angular's Secret Weapon
TypeScript: Angular's Secret Weapon
Laurent Duveau
 
Introduction to Angular for .NET Developers
Introduction to Angular for .NET DevelopersIntroduction to Angular for .NET Developers
Introduction to Angular for .NET Developers
Laurent Duveau
 
TypeScript: Angular's Secret Weapon
TypeScript: Angular's Secret WeaponTypeScript: Angular's Secret Weapon
TypeScript: Angular's Secret Weapon
Laurent Duveau
 
Introduction to Angular for .NET Developers
Introduction to Angular for .NET DevelopersIntroduction to Angular for .NET Developers
Introduction to Angular for .NET Developers
Laurent Duveau
 
Introduction to Angular for .NET Developers
Introduction to Angular for .NET DevelopersIntroduction to Angular for .NET Developers
Introduction to Angular for .NET Developers
Laurent Duveau
 
Introduction to Angular with TypeScript for .NET Developers
Introduction to Angular with TypeScript for .NET DevelopersIntroduction to Angular with TypeScript for .NET Developers
Introduction to Angular with TypeScript for .NET Developers
Laurent Duveau
 
Introduction to Angular for .NET Developers
Introduction to Angular for .NET DevelopersIntroduction to Angular for .NET Developers
Introduction to Angular for .NET Developers
Laurent Duveau
 
Introduction à Angular 2
Introduction à Angular 2Introduction à Angular 2
Introduction à Angular 2
Laurent Duveau
 
Angular 2... so can I use it now??
Angular 2... so can I use it now??Angular 2... so can I use it now??
Angular 2... so can I use it now??
Laurent Duveau
 
ngconf 2016 (french)
ngconf 2016 (french)ngconf 2016 (french)
ngconf 2016 (french)
Laurent Duveau
 
Microsoft Edge pour les développeurs web
Microsoft Edge pour les développeurs webMicrosoft Edge pour les développeurs web
Microsoft Edge pour les développeurs web
Laurent Duveau
 
Microsoft Edge pour les développeurs web
Microsoft Edge pour les développeurs webMicrosoft Edge pour les développeurs web
Microsoft Edge pour les développeurs web
Laurent Duveau
 
Introduction to SPAs with AngularJS
Introduction to SPAs with AngularJSIntroduction to SPAs with AngularJS
Introduction to SPAs with AngularJS
Laurent Duveau
 
Xamarin.Forms [french]
Xamarin.Forms [french]Xamarin.Forms [french]
Xamarin.Forms [french]
Laurent Duveau
 

More from Laurent Duveau (20)

Shit happens… debugging an Angular app.
Shit happens… debugging an Angular app.Shit happens… debugging an Angular app.
Shit happens… debugging an Angular app.
 
8 things you didn't know about the Angular Router, you won't believe #6!
8 things you didn't know about the Angular Router, you won't believe #6!8 things you didn't know about the Angular Router, you won't believe #6!
8 things you didn't know about the Angular Router, you won't believe #6!
 
De 0 à Angular en 1h30! (french)
De 0 à Angular en 1h30! (french)De 0 à Angular en 1h30! (french)
De 0 à Angular en 1h30! (french)
 
Angular 6, CLI 6, Material 6 (french)
Angular 6, CLI 6, Material 6 (french)Angular 6, CLI 6, Material 6 (french)
Angular 6, CLI 6, Material 6 (french)
 
Angular Advanced Routing
Angular Advanced RoutingAngular Advanced Routing
Angular Advanced Routing
 
Debugging an Angular App
Debugging an Angular AppDebugging an Angular App
Debugging an Angular App
 
TypeScript: Angular's Secret Weapon
TypeScript: Angular's Secret WeaponTypeScript: Angular's Secret Weapon
TypeScript: Angular's Secret Weapon
 
Introduction to Angular for .NET Developers
Introduction to Angular for .NET DevelopersIntroduction to Angular for .NET Developers
Introduction to Angular for .NET Developers
 
TypeScript: Angular's Secret Weapon
TypeScript: Angular's Secret WeaponTypeScript: Angular's Secret Weapon
TypeScript: Angular's Secret Weapon
 
Introduction to Angular for .NET Developers
Introduction to Angular for .NET DevelopersIntroduction to Angular for .NET Developers
Introduction to Angular for .NET Developers
 
Introduction to Angular for .NET Developers
Introduction to Angular for .NET DevelopersIntroduction to Angular for .NET Developers
Introduction to Angular for .NET Developers
 
Introduction to Angular with TypeScript for .NET Developers
Introduction to Angular with TypeScript for .NET DevelopersIntroduction to Angular with TypeScript for .NET Developers
Introduction to Angular with TypeScript for .NET Developers
 
Introduction to Angular for .NET Developers
Introduction to Angular for .NET DevelopersIntroduction to Angular for .NET Developers
Introduction to Angular for .NET Developers
 
Introduction à Angular 2
Introduction à Angular 2Introduction à Angular 2
Introduction à Angular 2
 
Angular 2... so can I use it now??
Angular 2... so can I use it now??Angular 2... so can I use it now??
Angular 2... so can I use it now??
 
ngconf 2016 (french)
ngconf 2016 (french)ngconf 2016 (french)
ngconf 2016 (french)
 
Microsoft Edge pour les développeurs web
Microsoft Edge pour les développeurs webMicrosoft Edge pour les développeurs web
Microsoft Edge pour les développeurs web
 
Microsoft Edge pour les développeurs web
Microsoft Edge pour les développeurs webMicrosoft Edge pour les développeurs web
Microsoft Edge pour les développeurs web
 
Introduction to SPAs with AngularJS
Introduction to SPAs with AngularJSIntroduction to SPAs with AngularJS
Introduction to SPAs with AngularJS
 
Xamarin.Forms [french]
Xamarin.Forms [french]Xamarin.Forms [french]
Xamarin.Forms [french]
 

Recently uploaded

Programming Foundation Models with DSPy - Meetup Slides
Programming Foundation Models with DSPy - Meetup SlidesProgramming Foundation Models with DSPy - Meetup Slides
Programming Foundation Models with DSPy - Meetup Slides
Zilliz
 
June Patch Tuesday
June Patch TuesdayJune Patch Tuesday
June Patch Tuesday
Ivanti
 
GraphRAG for Life Science to increase LLM accuracy
GraphRAG for Life Science to increase LLM accuracyGraphRAG for Life Science to increase LLM accuracy
GraphRAG for Life Science to increase LLM accuracy
Tomaz Bratanic
 
Astute Business Solutions | Oracle Cloud Partner |
Astute Business Solutions | Oracle Cloud Partner |Astute Business Solutions | Oracle Cloud Partner |
Astute Business Solutions | Oracle Cloud Partner |
AstuteBusiness
 
Generating privacy-protected synthetic data using Secludy and Milvus
Generating privacy-protected synthetic data using Secludy and MilvusGenerating privacy-protected synthetic data using Secludy and Milvus
Generating privacy-protected synthetic data using Secludy and Milvus
Zilliz
 
Your One-Stop Shop for Python Success: Top 10 US Python Development Providers
Your One-Stop Shop for Python Success: Top 10 US Python Development ProvidersYour One-Stop Shop for Python Success: Top 10 US Python Development Providers
Your One-Stop Shop for Python Success: Top 10 US Python Development Providers
akankshawande
 
Azure API Management to expose backend services securely
Azure API Management to expose backend services securelyAzure API Management to expose backend services securely
Azure API Management to expose backend services securely
Dinusha Kumarasiri
 
“Temporal Event Neural Networks: A More Efficient Alternative to the Transfor...
“Temporal Event Neural Networks: A More Efficient Alternative to the Transfor...“Temporal Event Neural Networks: A More Efficient Alternative to the Transfor...
“Temporal Event Neural Networks: A More Efficient Alternative to the Transfor...
Edge AI and Vision Alliance
 
Let's Integrate MuleSoft RPA, COMPOSER, APM with AWS IDP along with Slack
Let's Integrate MuleSoft RPA, COMPOSER, APM with AWS IDP along with SlackLet's Integrate MuleSoft RPA, COMPOSER, APM with AWS IDP along with Slack
Let's Integrate MuleSoft RPA, COMPOSER, APM with AWS IDP along with Slack
shyamraj55
 
Nordic Marketo Engage User Group_June 13_ 2024.pptx
Nordic Marketo Engage User Group_June 13_ 2024.pptxNordic Marketo Engage User Group_June 13_ 2024.pptx
Nordic Marketo Engage User Group_June 13_ 2024.pptx
MichaelKnudsen27
 
leewayhertz.com-AI in predictive maintenance Use cases technologies benefits ...
leewayhertz.com-AI in predictive maintenance Use cases technologies benefits ...leewayhertz.com-AI in predictive maintenance Use cases technologies benefits ...
leewayhertz.com-AI in predictive maintenance Use cases technologies benefits ...
alexjohnson7307
 
Overcoming the PLG Trap: Lessons from Canva's Head of Sales & Head of EMEA Da...
Overcoming the PLG Trap: Lessons from Canva's Head of Sales & Head of EMEA Da...Overcoming the PLG Trap: Lessons from Canva's Head of Sales & Head of EMEA Da...
Overcoming the PLG Trap: Lessons from Canva's Head of Sales & Head of EMEA Da...
saastr
 
SAP S/4 HANA sourcing and procurement to Public cloud
SAP S/4 HANA sourcing and procurement to Public cloudSAP S/4 HANA sourcing and procurement to Public cloud
SAP S/4 HANA sourcing and procurement to Public cloud
maazsz111
 
Skybuffer AI: Advanced Conversational and Generative AI Solution on SAP Busin...
Skybuffer AI: Advanced Conversational and Generative AI Solution on SAP Busin...Skybuffer AI: Advanced Conversational and Generative AI Solution on SAP Busin...
Skybuffer AI: Advanced Conversational and Generative AI Solution on SAP Busin...
Tatiana Kojar
 
Choosing The Best AWS Service For Your Website + API.pptx
Choosing The Best AWS Service For Your Website + API.pptxChoosing The Best AWS Service For Your Website + API.pptx
Choosing The Best AWS Service For Your Website + API.pptx
Brandon Minnick, MBA
 
Skybuffer SAM4U tool for SAP license adoption
Skybuffer SAM4U tool for SAP license adoptionSkybuffer SAM4U tool for SAP license adoption
Skybuffer SAM4U tool for SAP license adoption
Tatiana Kojar
 
HCL Notes und Domino Lizenzkostenreduzierung in der Welt von DLAU
HCL Notes und Domino Lizenzkostenreduzierung in der Welt von DLAUHCL Notes und Domino Lizenzkostenreduzierung in der Welt von DLAU
HCL Notes und Domino Lizenzkostenreduzierung in der Welt von DLAU
panagenda
 
zkStudyClub - LatticeFold: A Lattice-based Folding Scheme and its Application...
zkStudyClub - LatticeFold: A Lattice-based Folding Scheme and its Application...zkStudyClub - LatticeFold: A Lattice-based Folding Scheme and its Application...
zkStudyClub - LatticeFold: A Lattice-based Folding Scheme and its Application...
Alex Pruden
 
Fueling AI with Great Data with Airbyte Webinar
Fueling AI with Great Data with Airbyte WebinarFueling AI with Great Data with Airbyte Webinar
Fueling AI with Great Data with Airbyte Webinar
Zilliz
 
A Comprehensive Guide to DeFi Development Services in 2024
A Comprehensive Guide to DeFi Development Services in 2024A Comprehensive Guide to DeFi Development Services in 2024
A Comprehensive Guide to DeFi Development Services in 2024
Intelisync
 

Recently uploaded (20)

Programming Foundation Models with DSPy - Meetup Slides
Programming Foundation Models with DSPy - Meetup SlidesProgramming Foundation Models with DSPy - Meetup Slides
Programming Foundation Models with DSPy - Meetup Slides
 
June Patch Tuesday
June Patch TuesdayJune Patch Tuesday
June Patch Tuesday
 
GraphRAG for Life Science to increase LLM accuracy
GraphRAG for Life Science to increase LLM accuracyGraphRAG for Life Science to increase LLM accuracy
GraphRAG for Life Science to increase LLM accuracy
 
Astute Business Solutions | Oracle Cloud Partner |
Astute Business Solutions | Oracle Cloud Partner |Astute Business Solutions | Oracle Cloud Partner |
Astute Business Solutions | Oracle Cloud Partner |
 
Generating privacy-protected synthetic data using Secludy and Milvus
Generating privacy-protected synthetic data using Secludy and MilvusGenerating privacy-protected synthetic data using Secludy and Milvus
Generating privacy-protected synthetic data using Secludy and Milvus
 
Your One-Stop Shop for Python Success: Top 10 US Python Development Providers
Your One-Stop Shop for Python Success: Top 10 US Python Development ProvidersYour One-Stop Shop for Python Success: Top 10 US Python Development Providers
Your One-Stop Shop for Python Success: Top 10 US Python Development Providers
 
Azure API Management to expose backend services securely
Azure API Management to expose backend services securelyAzure API Management to expose backend services securely
Azure API Management to expose backend services securely
 
“Temporal Event Neural Networks: A More Efficient Alternative to the Transfor...
“Temporal Event Neural Networks: A More Efficient Alternative to the Transfor...“Temporal Event Neural Networks: A More Efficient Alternative to the Transfor...
“Temporal Event Neural Networks: A More Efficient Alternative to the Transfor...
 
Let's Integrate MuleSoft RPA, COMPOSER, APM with AWS IDP along with Slack
Let's Integrate MuleSoft RPA, COMPOSER, APM with AWS IDP along with SlackLet's Integrate MuleSoft RPA, COMPOSER, APM with AWS IDP along with Slack
Let's Integrate MuleSoft RPA, COMPOSER, APM with AWS IDP along with Slack
 
Nordic Marketo Engage User Group_June 13_ 2024.pptx
Nordic Marketo Engage User Group_June 13_ 2024.pptxNordic Marketo Engage User Group_June 13_ 2024.pptx
Nordic Marketo Engage User Group_June 13_ 2024.pptx
 
leewayhertz.com-AI in predictive maintenance Use cases technologies benefits ...
leewayhertz.com-AI in predictive maintenance Use cases technologies benefits ...leewayhertz.com-AI in predictive maintenance Use cases technologies benefits ...
leewayhertz.com-AI in predictive maintenance Use cases technologies benefits ...
 
Overcoming the PLG Trap: Lessons from Canva's Head of Sales & Head of EMEA Da...
Overcoming the PLG Trap: Lessons from Canva's Head of Sales & Head of EMEA Da...Overcoming the PLG Trap: Lessons from Canva's Head of Sales & Head of EMEA Da...
Overcoming the PLG Trap: Lessons from Canva's Head of Sales & Head of EMEA Da...
 
SAP S/4 HANA sourcing and procurement to Public cloud
SAP S/4 HANA sourcing and procurement to Public cloudSAP S/4 HANA sourcing and procurement to Public cloud
SAP S/4 HANA sourcing and procurement to Public cloud
 
Skybuffer AI: Advanced Conversational and Generative AI Solution on SAP Busin...
Skybuffer AI: Advanced Conversational and Generative AI Solution on SAP Busin...Skybuffer AI: Advanced Conversational and Generative AI Solution on SAP Busin...
Skybuffer AI: Advanced Conversational and Generative AI Solution on SAP Busin...
 
Choosing The Best AWS Service For Your Website + API.pptx
Choosing The Best AWS Service For Your Website + API.pptxChoosing The Best AWS Service For Your Website + API.pptx
Choosing The Best AWS Service For Your Website + API.pptx
 
Skybuffer SAM4U tool for SAP license adoption
Skybuffer SAM4U tool for SAP license adoptionSkybuffer SAM4U tool for SAP license adoption
Skybuffer SAM4U tool for SAP license adoption
 
HCL Notes und Domino Lizenzkostenreduzierung in der Welt von DLAU
HCL Notes und Domino Lizenzkostenreduzierung in der Welt von DLAUHCL Notes und Domino Lizenzkostenreduzierung in der Welt von DLAU
HCL Notes und Domino Lizenzkostenreduzierung in der Welt von DLAU
 
zkStudyClub - LatticeFold: A Lattice-based Folding Scheme and its Application...
zkStudyClub - LatticeFold: A Lattice-based Folding Scheme and its Application...zkStudyClub - LatticeFold: A Lattice-based Folding Scheme and its Application...
zkStudyClub - LatticeFold: A Lattice-based Folding Scheme and its Application...
 
Fueling AI with Great Data with Airbyte Webinar
Fueling AI with Great Data with Airbyte WebinarFueling AI with Great Data with Airbyte Webinar
Fueling AI with Great Data with Airbyte Webinar
 
A Comprehensive Guide to DeFi Development Services in 2024
A Comprehensive Guide to DeFi Development Services in 2024A Comprehensive Guide to DeFi Development Services in 2024
A Comprehensive Guide to DeFi Development Services in 2024
 

Building apps for WP8 and Win8

  • 1. 2013-02-09 Laurent Duveau Developing for both Windows Phone 8 and Windows 8 ldex.ca @laurentduveau Laurent Duveau Windows 8 Instructor MVP / MCT / RD
  • 2. Agenda • Building for Windows Devices • Consistent Experience • Tiles, Notifications, Animations • Differences • Screen Sizes, Controls, Lifecycle • Minimizing Development • Reuse • Portable Class Library • Sharing Code
  • 3. Some Key Differences It’s important to design for the platform differences as well as similarities Screen Size Controls Lifecycle Windows Phone Windows Phone Windows Phone 800x480, 1280x720, 1280x768 Panorama, Pivot, ListPicker Launched from start/apps list. Portrait, Landscape LongListSelector Tombstones apps Windows Windows Windows 1024x768  GridView, ListView, Semantic Resumes existing apps Portrait, Landscape, Snapped Zoom, FlipView No tombstoning
  • 4. Strategies for sharing in a XAML app • Separate UI from app logic (Model-View-ViewModel) • Share portable .NET code in Portable Class Library • Use common Windows Runtime API (Add as Link) • Complete with platform-specific code as necessary
  • 5. Separate UI from app logic
  • 9. Reuse Reusing pre-built components or libraries Portable Class Library • Managed Code • Reusable library • One codebase with no conditional compilation
  • 11. Sharing Code Reusing code by including code files in multiple projects Share Code Files •Use Add as Link to include same files in multiple projects •Change once, Change everywhere •What to do where platforms don’t match? •#if conditional blocks •Inheritance •Partial Classes and Methods
  • 12. Sharing Code: #if Conditional Blocks • 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 • Can make code unreadable…
  • 13. Sharing Code: #if Conditional Blocks #if NETFX_CORE using Windows.UI.Xaml.Media.Imaging; #else using System.Windows.Media.Imaging; #endif
  • 14. Sharing Code: #if Conditional Blocks public object Convert(object value, Type targetType, object parameter, #if !NETFX_CORE CultureInfo culture #else string language #endif )
  • 15. Sharing Code: Partial Classes & Methods • Shared functionality in one code file eg: DataSource.cs • Platform specific code in additional code file eg: DataSource.WP8.cs • Classes are marked as partial and compiled into a single class • Separates platform specific features • Can use partial methods as a mechanism to separate out platform specific logic
  • 16. Sharing Code: Partial Classes & Methods /// <summary> /// DataSource.cs /// </summary> public partial class DataSource:IDataSource { public async Task<IEnumerable<IFolder>> RetrieveFolders(IFolder root) { ... // other logic var folders = await LoadFolders(root); ... // other logic return folders } } /// <summary> /// DataSource.WP8.cs /// </summary> public partial class DataSource { private async Task<IEnumerable<IFolder>> LoadFolders(IFolder root) { ... } }

Editor's Notes

  1. AgendaThe material in this session is broken down into three sections:Building for Windows Devices: This is focused on getting developers to think about the application they’re building. There’s not only a need to consider the common elements (ie tiles, notifications, the use of grids and content rather than chrome) but also to respect the differences (egGridViews and ListViews versus ListPickers and LongListSelectors). We’ll talk about how to deal with different actual screen sizes (Win8 layouts need to scale, WP8 layouts do not (for the most part)). Minimizing Development: This section looks at how to reuse as much code as possible. This can be done by building libraries that can simply be reused using portable class libraryies. Alternatively it may be necessary to simply share code between projects. The latter can allow for high levels of reuse as there are less constraints imposed and gives developers the ability to use partial classes, compiler directives and other techniques for sharing code between projects.Architecture: In the last section of this session there will be discussion around apis for doing common tasks (selecting files, capturing photos etc), some are the same, others vary between platforms. This section will also look at how developers can architect their applications to promote reuse across both platforms, with a heavy focus on the MVVM/Data binding design pattern.
  2. Some Key Differences:Screen SizeRaw screen size. For Windows Phone this isn’t too much of an issue since most applications will scale automatically between the default WVGA (ie 800x480) and the other resolutions available on Windows Phone 8. For Windows you have to design interfaces that can accommodate different screen sizes and aspect ratios. A lot of applications being ported from iPad don’t adapt well to Windows as they’ve been designed for fixed proportions. Use of the GridView and/or ListView controls is essential to ensure interfaces that scale well.2) OrientationOn Windows Phone, apps can optionally support Portrait and Landscape .On Windows: Applications are required to support the Snapped mode. ControlsWindows Phone has unique page level controls such as the Panorama and Pivot which should be used when designing the application. There are also individual controls such as the LongListSelector (recommended to be used in place of the ListBox) and ListPicker (Windows Phone equivalent of a dropdown box) that should be used to be consistent. Windows also brings a number of unique controls:GridView: (groupable) tile array. Also possible to dynamically size items in the grid. The GridView comes with built in styles for input and selectionListView: Replacement for ListBox for displaying list of itemsSemanticZoom: Allows for quick jump through large lists of grid itemsFlipView: Browsing view optimised for touch to pane left-right through sequential items.LifecycleBasic navigation model is relatively similar, as on both the user navigates from one page to another. There is a strong concept of navigating back on both – using the hardware back button on the phone, or via a back button positioned on the upper a[[ bar on Windows 8.However, there are differences in the way applications are launched or resumed that developers have to be aware of and must code for. These differences include: - Windows Phone applications are always (re)launched when started from the start screen or the applications list (although this default behaviour can be overridden in WP8 if Fast Application Resume is implemented). Windows applications are simply resumed (no navigation events in/out of page). - Windows Phone applications can be tombstoned, unlike Windows applications which are suspended but never tombstoned. - Both platforms support a variety of different entry points Windows Phone: normal startup, toast &amp; tile launch, Speech launch, App Connect (ie search), protocol and file association Windows: normal startup, toast &amp; tile launch, Search, Share, protocol and file association
  3. Minimizing DevelopmentSince in theory Windows Phone is the same core platform as Windows there should be a common development strategy that can be applied. Unfortunately this is one quite the case – this section looks at some of the pitfalls and how they can be overcome.
  4. ReuseThe supported scenarios for complete reuse are very limited. It’s not possible to build a single executable that will simply run across both platforms (unlike iOS or Android where you can effectively build universal applications which will run on both devices). It’s also not possible to simply reuse components built for one platform on the other. The only true reuse scenario that is currently supported is via a Portable Class Library:Portable Class LibraryThese are class libraries that contain only managed code and as such can be simply referenced by managed applications for both Windows and Windows Phone. This takes a lowest common denominator approach resulting in a very constrained sub-set of even the Windows Phone .NET framework.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.
  5. For demonstration notes please look in the “Demonstration” folder and open the corresponding Word document. 
  6. Sharing CodePortable Class Libraries are quite limiting so often alternative approaches must be adopted.An alternative is to share the actual code files between projects for different platforms. Whilst this would appear to add an overhead the result is that Visual Studio is able to maintain links to files even if they aren’t in the one project structure. This means that you can have multiple projects all referencing the same source code files. This means that when you update the source file it will be updated across all projects that reference it.Sharing code files works well for where there are common apis across the different platforms. However it would appear to breakdown where there are differences in the APIs, or even just the syntax of APIs, between the platforms. Simply sharing code files may generate compilation errors when code is added that is specific to only one of the platforms. In this section three methods for combating this will be presented#if Conditional Blocks where compilation symbols are used to effectively comment out blocks of codeInheritance where platform specific subclasses are generated to expose additional properties/methodsPartial Classes and Methods where platform specific methods can be grouped together rather than being dispersed through the shared code
  7. #if Conditional BlocksThis is the simplest form of logic that can be used to separate platform specific code. Both Windows and Windows Phone already has platform specific build constants defined, being NETFX_CORE and WINDOWS_PHONE respectively. These can be used to comment out, or enable blocks of code at compile time.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. For example in the case where an #if statement was used to switch between two platform specific implementations it would be hard to follow the logic as the developer would have to continually jump over blocks of code relevant to the other platform. This extends into the debugging experience making it harder to track down issues.
  8. Example 1: Using #if conditional blocks to switch between two similar namespaces. In this case the code was referencing the BitmapImage class which is in a different namespace on each platform (see PhotoManager.Core.WP8/Data/Entities/Picture.cs for example)
  9. Example 2: Using #if conditional block within the signature for a method. This is an example of how the inappropriate use of #if can lead to hard to read code (for an implementation of IValueConverter – see PhotoManager.WP8/Converters/BoolVisibilityConverter.cs). One approach here to make this easier to read would be to simply repeat the whole method signature within the two #ifdef alternatives, rather than trying to split at the point of difference.
  10. Partial Classes &amp; MethodsAnother technique is to use partial classes.Partial classes came about back in the days of Windows Forms where developers wanted to be able to add logic to a form but didn’t want to modify the designer generated file. By putting their additional logic in a separate file and marking the classes as partial, all the code would end up being compiled down into a single class. This strategy is great for separating out platform specific implementations: the shared logic can reside in the primary file (egDataSource.cs); platform specific logic can reside in files created for the specific platform (eg DataSource.WP8.cs and DataSource.Win8.cs). This has the added benefit in that only the code that is relevant to the specific platform is included in the project (ie DataSource.Win8.cs wouldn’t be included in the WP8 project and vice versa).It’s possible to use partial methods to call from code in the primary file into the platform specific code – if the platform specific code doesn’t “implement” the partial method it’s simply compiled out and never called. To enforce platform specific implementation simply call the required method from the primary file – this will yield a build error until the platform specific method is created.Pro: All the methods appear within the same class (and as such in the methods dropdown in Visual Studio).Con: Again you end up with multiple files for the same class
  11. ExampleHere we see the primary file, DataSource.cs (PhotoManager.Core.WP8/Data/DataSource.cs), with a method called RetrieveFolders that does a bunch of work before and after calling LoadFolders. LoadFolders exists only in the platform specific files, in this case DataSource.WP8.cs (PhotoManager.Core.WP8/Data/DataSource.WP8.cs).Note that in this case a platform specific suffix has been used – this is similar to what you see with XAML (mypage.xaml) and the corresponding code-behind file (mypage.xaml.cs).Example 3: Open PhotoManager.Core.WP8/Data/DataSource.csOpen PhotoManager.Core.WP8/Data/DataSource.WP8.csIllustrate how the WP8 specific logic resides in separate files, yet all methods are accessible via methods dropdown.
  12. For demonstration notes please look in the “Demonstration” folder and open the corresponding Word document.If you have demoed the code sharing techniques as you went through the preceding slides, you may want to hide this demo slide.