Mobile design patterns

Transcript

1. Mobile
   design
   patterns
   Alexandra Marin @ ITAKE Unconference 2017
   @xmonodev
   crossplatform.io
   

   View Slide

2. Hello!
   { }
   #mobile #designpatterns #itakeunconf
   crossplatform.io
   

   View Slide

3. Design code
   that runs
   cross-platform
   { crossplatform.io }
   #mobile #designpatterns #itakeunconf
   crossplatform.io
   

   View Slide

4. Overview
   { crossplatform.io }
   #mobile #designpatterns #itakeunconf
   crossplatform.io
   

   View Slide

5. The mobile
   problem
   { crossplatform.io }
   #mobile #designpatterns #itakeunconf
   

   View Slide

6. Target universal
   features
   { crossplatform.io }
   #mobile #designpatterns #itakeunconf
   

   View Slide

7. Enhance experience
   based on
   device capabilities
   { crossplatform.io }
   #mobile #designpatterns #itakeunconf
   

   View Slide

8. Platform-independent
   code with Xamarin
   { crossplatform.io }
   #mobile #designpatterns #itakeunconf
   

   View Slide

9. Platform-specific
   code with Xamarin
   { crossplatform.io }
   #mobile #designpatterns #itakeunconf
   

   View Slide

10. Case study #1:
    Different capabilities
    Case study #2:
    Different platform
    { crossplatform.io }
    #mobile #designpatterns #itakeunconf
    

    View Slide

11. Taking a
    selfie
    #mobile #designpatterns #itakeunconf
    crossplatform.io
    

    View Slide

12. { crossplatform.io }
    #mobile #designpatterns #itakeunconf
    Facade
    design pattern
    crossplatform.io
    

    View Slide

13. //On platform
    if(deviceHasCamera)
    {
    //Take photo via Camera app
    //Apply resizing
    //Save it via File Manager
    }
    else
    {
    //Choose from gallery
    }
    { crossplatform.io }
    #mobile #designpatterns #itakeunconf
    crossplatform.io
    

    View Slide

14. { crossplatform.io }
    #mobile #designpatterns #itakeunconf
    //Shared code
    camera.ReturnPhoto();
    crossplatform.io
    

    View Slide

15. Save the
    date
    #mobile #designpatterns #itakeunconf
    crossplatform.io
    

    View Slide

16. Bridge
    design pattern
    { crossplatform.io }
    #mobile #designpatterns #itakeunconf
    crossplatform.io
    

    View Slide

17. { crossplatform.io }
    #mobile #designpatterns #itakeunconf
    //Shared code
    class MyCalendar
    {
    ICalendar calendar;
    void SaveTheDate()
    {
    calendar.AddEvent();
    }
    }
    crossplatform.io
    

    View Slide

18. { crossplatform.io }
    #mobile #designpatterns #itakeunconf
    //iOS
    iOSCalendar : ICalendar
    {
    AddEvent()
    {
    //add event with
    //EventKit
    }
    }
    crossplatform.io
    

    View Slide

19. { crossplatform.io }
    #mobile #designpatterns #itakeunconf
    //Android
    DroidCalendar : ICalendar
    {
    AddEvent()
    {
    //add event with
    //CalendarContract
    }
    }
    crossplatform.io
    

    View Slide

20. Inversion
    of Control
    { crossplatform.io }
    #mobile #designpatterns #itakeunconf
    

    View Slide

21. Service
    locator
    { crossplatform.io }
    #mobile #designpatterns #itakeunconf
    

    View Slide

22. //Construct on platform
    Locator.RegisterType
    ();
    //Use in shared code
    Locator.Resolve();
    { }
    #mobile #designpatterns #itakeunconf
    { crossplatform.io }
    

    View Slide

23. Dependency
    injection
    { crossplatform.io }
    #mobile #designpatterns #itakeunconf
    { crossplatform.io }
    

    View Slide

24. { crossplatform.io }
    #mobile #designpatterns #itakeunconf
    //Construct on platform
    IoC.RegisterType
    ();
    //Gets injected in shared
    class constructor
    public SharedClass(ICalendar
    cameraHelper)
    { crossplatform.io }
    

    View Slide

25. Summary
    { crossplatform.io }
    #mobile #designpatterns #itakeunconf
    { crossplatform.io }
    crossplatform.io
    

    View Slide

26. Ask Me Anything
    crossplatform.io
    or @xmonodev
    { crossplatform.io }
    #mobile #designpatterns #itakeunconf
    { crossplatform.io }
    crossplatform.io
    

    View Slide