Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Real Life MAF (2.2) Oracle Open World 2015

1,003 views

Published on

Oracle Mobile Application Framework enables you to create apps for both Apple iOS and Android. When you’re building your first Oracle Mobile Application Framework app, you’ll run into issues you can’t solve by reading the Oracle Applications Developer’s Guide, such as skinning, device interaction, creating custom springboards, and more. These issues can all be solved, but there are many different approaches. This session presents solutions to these and other real-life Oracle Mobile Application Framework challenges.

Published in: Technology
  • Be the first to comment

Real Life MAF (2.2) Oracle Open World 2015

  1. 1. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. | REAL-LIFE ORACLE MAF Luc Bors eProseed NL Oracle Open World 2015 San Francisco October 26th 2015 Things You Don’t Learn from Oracle’s Developers Guide
  2. 2. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. |2 WHO AM I ? •  Luc Bors •  Managing Partner •  eProseed •  Oracle Platinum Partner
  3. 3. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. | PROGRAM AGENDA Introducing Oracle MAF UI Development Device Properties Device Interaction REST JSON : A Sample 1 2 3 4 5 3
  4. 4. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. |4 INTRODUCING MAF •  MAF is a hybrid-mobile framework – Cross Platform Mobile Development – Visual and Declarative Development – Leverage Java Skills – Simplified Device Feature and Services Access
  5. 5. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. |5 MAF RUNTIME ARCHITECTURE •  Mobile Device – HTML – CSS – Java Script – Java – Cordova – SQLite – Push Handler – Access Control •  Server Side
  6. 6. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. | PROGRAM AGENDA Introducing Oracle MAF UI Development Device Properties Device Interaction REST JSON : A Sample 1 2 3 4 5 6
  7. 7. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. |7 TIP TIME
  8. 8. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. | DON’T MESS UP !! •  Read the installation guidelines carefully •  Install JDeveloper with jdk1.7 8 Cable Mess Frustration - photo by: Jonathan Arehart
  9. 9. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. |9 NO LONGER IN THIS PRESENTATION •  Gestures; Pull to Refresh •  Gestures; Swipe to Reveal •  In MAF 2.2 this is standard!
  10. 10. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. |10 NO LONGER IN THIS PRESENTATION •  Toggle Springboard •  In MAF 2.2 this is (almost) standard!
  11. 11. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. |11 TOGGLE SPRINGBOARD •  What is the Default toggle behavior ?
  12. 12. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. |12 TOGGLE SPRINGBOARD •  What is the Desired toggle behavior ? <amx:commandLink id="cl1" actionListener="#{bindings.toggleSpringboard.execute}”
 styleClass="springboard-icon" shortDesc="Springboard Link”>
 <amx:image id="i1" source="/images/springboard.svg" 
 shortDesc="Springboard Image"/>
 </amx:commandLink>
  13. 13. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. |13 DRAG AND DROP DEVELOPMENT
  14. 14. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. |14 DRAG AND DROP DEVELOPMENT
  15. 15. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. |15 DRAG AND DROP DEVELOPMENT
  16. 16. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. |16 CREATE FRAGMENTS •  Create Fragments that can be re-used •  Fragments can have styling •  Assign Attribute values when Fragment is used
  17. 17. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. |17 USE FRAGMENTS •  Drop fragment on page •  Assign Attribute values
  18. 18. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. |18 TO DND OR NOT TO DND ? •  The hard work – Create page fragments first – Create bindings manually – Assign attribute Values •  VS
  19. 19. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. |19 MAKE IT EVEN MORE BEAUTIFUL •  Use the tools ! •  Chrome Developer tools •  Safari Developer tools
  20. 20. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. |20 SKINNING IOS APPS •  Safari
  21. 21. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. |21 SKINNING IOS APPS
  22. 22. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. |22 SKINNING ANDROID APPS •  Chrome
  23. 23. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. |23 SKINNING ANDROID APPS
  24. 24. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. |24 TIP TIME
  25. 25. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. |25 THE MASONRY LAYOUT •  Works with mobileAlta-v1.4 •  You can disable the drag and drop behavior on the masonry layout items. •  Use the undocumented style class in MAF 2.2 for this is amx-masonryLayout-noDrag
  26. 26. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. | PROGRAM AGENDA Introducing Oracle MAF UI Development Device Properties Device Interaction REST JSON : A Sample 1 2 3 4 5 26
  27. 27. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. |27 DEVICE PROPERTIES •  Many Device properties are available •  Do what is possible, avoid what cannot be done
  28. 28. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. |28 LOADING IN THE BACKGROUND
  29. 29. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. | HOW IT WORKS •  Check network connectivity – #{deviceScope.hardware.networkStatus} – "wifi", "2g", "unknown", "none”, etc etc •  Start background thread – Load Images in background 29
  30. 30. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. |30 LOADING IN THE BACKGROUND
  31. 31. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. |31 MULTIPLE BACKGROUND THREADS •  You can actually use multiple background threads •  Can be refreshed individually •  AdfmfJavaUtilities.flushDataChangeEvent()
  32. 32. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. |32 HOW TO START IOS SIMULATOR ? •  Deploy app from within JDeveloper •  Start from within Xcode •  Start from Commandline
  33. 33. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. | PROGRAM AGENDA Introducing Oracle MAF UI Development Device Properties Device Interaction REST JSON : A Sample 1 2 3 4 5 33
  34. 34. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. | DEVICE INTERACTION •  The Device Datacontrol •  Drag n Drop support •  Attributes as fields •  Operations as buttons •  Or as a link
  35. 35. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. | BEHIND THE SCENES
  36. 36. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. | CAMERA INTERACTION •  Take a picture …………… •  …… or get one from the Library DeviceManager.CAMERA_SOURCETYPE_PHOTOLIBRARY import oracle.adf.model.datacontrols.device; DeviceManager dm = DeviceManagerFactory.getDeviceManager(); if (dm.hasCamera){ dm.getPicture( 100, DeviceManager.CAMERA_DESTINATIONTYPE_FILE_URI, DeviceManager.CAMERA_SOURCETYPE_CAMERA, false, DeviceManager.CAMERA_ENCODINGTYPE_PNG, 200, 200); }
  37. 37. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. | UPLOADING YOUR PICTURE •  REST/JSON à Needs a String, not an image 37 DeviceManager dm = DeviceManagerFactory.getDeviceManager(); String myImageDataBase64 = dm.getPicture(50, DeviceManager.CAMERA_DESTINATIONTYPE_DATA_URL, DeviceManager.CAMERA_SOURCETYPE_CAMERA, false, DeviceManager.CAMERA_ENCODINGTYPE_JPEG, 200, 200); } myImageDataBase64 = URLEncoder.encode(myImageDataBase64, java.nio.charset.StandardCharsets.UTF_8.toString());
  38. 38. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. | LOCAL NOTIFICATIONS •  Declarative – DeviceFeatures DC •  JavaScript API – adf.mf.api.localnotification •  Java API – adfmfContainerUtilities 38
  39. 39. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. | CREATING A LOCAL NOTIFICATION •  AdfmfContainerUtilities.addLocalNotification(options) •  AdfmfContainerUtilities.cancelLocalNotification(notificationId); 39
  40. 40. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. | REPEATING LOCAL NOTIFICATIONS 40
  41. 41. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. |41 TIP TIME
  42. 42. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. |42 CANCELING REPEATING NOTIFICATIONS •  Cancelling a notification means that the notification is COMPLETELY cancelled even if it was scheduled to fire every DAY •  Create a new one after cancelling
  43. 43. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. | PROGRAM AGENDA Introducing Oracle MAF UI Development Device Properties Device Interaction REST JSON : A Sample Some More Tips 1 2 3 4 5 43 6
  44. 44. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. |44 OVERVIEW OF A MAF SOLUTION JSONBeanSerializationHelper POJO Datacontrol Data Objects Data Objects Data ObjectsDataArray REST Adapter MAFBindingLayer RemoteRESTJSON R E S T C o n n e c t i o n MAF App
  45. 45. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. |45 CLASS HIERARCHY RestCallerUtil FlightCustURIs JsonArrayToFlightPassengerListArray JsonArrayToFlightDetailsArray FlightPassengerListArray FlightDetailsArray FlightPassengerListEntity FlightDetailsEntity FlightPassengersDC CustomerComplaintEntity FlightsRestService CustomerComplaintObject CustomerComplaintObjectToJsonObject CustomerRestService
  46. 46. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. |46 RESTSERVICE ADAPTER DOES THE CALL •  setRequestType – REQUEST_TYPE_GET à to GET flights and Passengers – REQUEST_TYPE_POST à to POST a complaint •  setConnectionName: To use the correct REST-connection •  setRequestURI à What is it that we want to do –  /flights/KL34 –  /flights/KL34/passengerlist –  /complaints •  NOTE: Request URI are bundled in a Custom Class (FlightCustURIs)
  47. 47. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. |47 REST JSON FROM SOA SUITE, OSB OR MCS
  48. 48. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. |48 USE SOAP UI “CLOUD SERVICE” { "FlightCode": { "CarrierCode": "KL", "FlightNumber": "34" }, "FlightDate": "2015-03-07T09:50:00.000+01:00", "TotalNumberOfPassengers": "22", "Passengers": [ { "FirstName": "Diana", "LastName": "Woodstock", "Country": "UK", "FrequentFlyerNumber": "BB123332", "Seat": "2B" }, { "FirstName": "William", "LastName": "Simon", "Country": "US", "FrequentFlyerNumber": "KK9182673", "Seat": "4C" },
  49. 49. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. |49 TIP TIME
  50. 50. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. | WHERE ARE MY FIFILES ? •  Finding the actual log file for an app, particularly since iOS 8 and Xcode 6, is a somewhat tricky •  Logfile – application.log 50
  51. 51. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. | THERE ARE MY LOGFILES ! •  iOS simulator content – /Users/lucbors/Library/Developer/CoreSimulator 51
  52. 52. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. | THERE ARE MY DEVICES ! •  iOS simulator content – /Users/lucbors/Library/Developer/CoreSimulator/Devices 52
  53. 53. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. | THERE IS MY DEVICE ! •  iOS simulator content – /Users/lucbors/Library/Developer/CoreSimulator/Devices – Use ls -lt 53
  54. 54. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. | THERE IS MY APPLICATION ! •  iOS simulator content – /Users/lucbors/Library/Developer/CoreSimulator/Devices/ <device>/data/Containers/Data/Application 54
  55. 55. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. | THERE IS MY LOGFILE ! •  iOS simulator content – /Users/lucbors/Library/Developer/CoreSimulator/Devices/ <device>/data/Containers/Data/Application/<app>/Documents/ logs 55
  56. 56. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. | WHERE ARE MY LOGFILES ? •  Change Location 56
  57. 57. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. | IN MAF 2.2 THINGS CHANGED •  Logfile is automatically redirected to the JDeveloper Console 57
  58. 58. Copyright © 2014, eProseed and/or its affiliates. All rights reserved. |58 SUMMARY •  Many Options to Develop •  Many Features to Use •  Highly Configurable •  Use Common Patterns •  Think Outside of the Box •  Use other Tools to Help you

×