Your SlideShare is downloading. ×
Wireless Wednesdays: Part 3
Upcoming SlideShare
Loading in...5

Thanks for flagging this SlideShare!

Oops! An error has occurred.


Introducing the official SlideShare app

Stunning, full-screen experience for iPhone and Android

Text the download link to your phone

Standard text messaging rates apply

Wireless Wednesdays: Part 3


Published on

Your business users want to access their Notes & Domino applications on their mobile devices. Join our third webinar in a free four-part series and have two experienced experts, Matt White and Rich …

Your business users want to access their Notes & Domino applications on their mobile devices. Join our third webinar in a free four-part series and have two experienced experts, Matt White and Rich Sharpe, guide you through what you need to know.

The first webinar on Jan. 8 took a look at the tools and frameworks that can help you. The second webinar on Mar. 5 took a deeper dive into one of the main alternatives: IBM Dojo Mobile Controls. The second half of the series will tackle the other main alternatives: Unplugged Mobile Controls and JQuery Mobile. Matt and Rich will pick out the good, the bad, and the ugly stories from their Domino development experiences.

In Part 3, learn:
-Unplugged Mobile Controls
-Performance considerations
-Handling offline requirements
-Pros and cons vs. alternatives

Published in: Technology

  • Be the first to comment

  • Be the first to like this

No Downloads
Total Views
On Slideshare
From Embeds
Number of Embeds
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

No notes for slide


  • 1.       Getting Started with Mobile Development Part  3:  April  2,  2014  
  • 2. Introducing   •  Your  mobile  Domino  server:  take  your  Notes  apps  with   •  Tools  for  collaboraFve  compuFng  in  mid-­‐size  and  large   enterprises,  primarily  for  IBM  Notes   •  Easy-­‐to-­‐use  tools  for  developers  and  administrators   •  Unplugged:  easy  mobilizaFon  of  Notes  apps  to  Blackberry,   Android  and  iOS   •  2300+  acFve  customers,  47  countries   •  Offices  in  US,  UK  and  Japan  
  • 3. •  Your  mobile  Domino  server:  take  your  Notes  apps  with   you!   •  End-­‐users  access  Notes  applicaFons  from  mobile  devices   whether  online  or  offline   •  Leverages  exisFng  skills  and  technology  –  XPages  –  a   replicaFon  model  you  already  know   •  Unplugged  3.0  recently  released   Teamstudio  Unplugged  
  • 4. •                 ConFnuity  –  Mobile  offline  access  to  BCM    programs   •                 OneView  Approvals  –  Expense  approvals;    anywhere,  anyFme   •                 CustomerView  –  lightweight  CRM    framework  for  field  sales  and  field  service    teams   •  Contacts  –  customer  informaFon  database   •  AcFviFes  –  customer  acFvity  log   •  Media  –  mobile  offline  file  storage  and  access   Unplugged  Template  Apps  
  • 5. •  Unplugged  Mobile  Controls  User  Group  –  April  meeFng   tomorrow   •  Next  webinar  with  TLCC:  Ask  the  XPages  Experts  –  April  10   •  Next  Wireless  Wednesdays  webinar:  Part  4  –  May  7   •  Promo<on:  Demo  the  Unplugged  Admin  Console  and  be  entered   to  win  a  Galaxy  Tab  3    
  • 6. Unplugged Controls
  • 7. Agenda Introduction Installation Development Tips and Tricks 1 2 3 2 4
  • 8. Wireless Wednesdays  A series of webinars where we discuss XPages mobile development for the enterprise  In January we looked at an introduction to mobile  In February, at Connect, we talked about creating the Unplugged Controls project  In March we looked at Dojo Mobile  This month we’re talking Unplugged Controls  Still to come –  jQuery Mobile 3
  • 9. Introduction  Unplugged Mobile Controls are created by Teamstudio as a set of open source development tools  To aid development of applications to run on Teamstudio Unplugged  But the controls are free, open source and can run in a mobile browser as well –  You can use the controls even if you don’t use Unplugged 4
  • 10. Introduction  The idea is to make creating a really good mobile application in XPages a simple process: –  Add custom controls and resources to your database –  Created XPages using the controls –  If it’s a simple app you don’t even need to write any code  There are 18 controls –  Everything from headers / footers, views, forms dialogs –  We’re always adding more 5
  • 11. Introduction  A few key deliverables with the Controls: –  Have to work well on both phones and tablets –  Have to perform well •  We aim for a sub second response time inside Unplugged –  Have to work inside Unplugged and mobile web browsers •  Unplugged is always the primary target, but if a feature doesn’t work in a browser it is a bug –  Have to be easily re-styled •  More on this later 6
  • 12. Installation  The controls are released on OpenNTF: –  Download the latest release –  One template with the controls, and all resources –  Two sample apps that you can use as a guide  Documentation is available as well 7
  • 13. Development  Copy across required XPages, Custom Controls, resources from template: 8
  • 14. Development  Set up your forms and views, we’re using the same app as last month –  Don’t worry you’ll be able to download all this at the end of the session! 9
  • 15. Create Layout  We need a custom control to handle layout, much like any other XPages application  Add 2 stylesheets to the resources 10
  • 16. Create Layout  Next we want to drag in a UnpHeader control 11
  • 17. Create Layout  Drag in a UnpFooter below the UnpHeader 12
  • 18. Create Layout  Between the Header and Footer, drag in a UnpNavigatorComputed  We need to create a JSON object which describes the menu items –  Lots of options, but in this demo we just want two menu items 13
  • 19. Create Layout  Finally for the layout control, we want to add an editable area inside a div with an id of content –  (note the id relates to the menu items we set up earlier) –  Save the custom control 14
  • 20. Create Home Page  Add a new XPage called UnpMain  Drag in our layout custom control  Drag a panel into the editable area in the layout 15
  • 21. Create Home Page  Drag a UnpScrollableArea into the Panel  And then add a UnpFlatView inside the UnpScrollableArea 16
  • 22. Test Home Page  Save and preview the XPage 17
  • 23. Create SecondView  Create an XPage called ByLastName 18
  • 24. Create FormViewer   Create a new XPage called EmployeeRead   Add a document data binding   As before, add layout structure, but this time add a UnpFormViewer 19
  • 25. Create FormViewer  Add all of the other fields to display in the same way 20
  • 26. Create Form Editor  Add a new XPage called Employee  Add the usual structure, with a UnpFormEditor control  Add the fields to the page: –  We use CSS classes to control functionality •  required •  deletable •  autocomplete 21
  • 27. Create Form Editor 22
  • 28. Create Form Editor 23  For a date picker use this format  Remember to set the type to get the correct keyboard  We offer “native” style switch controls
  • 29. Finished App  So we have a (very simple) application that supports viewing and editing data  There’s a whole load more the controls can do, check out the Sampler application for examples  What we’ve done will work in mobile web browsers, but also in Unplugged.  In the Unplugged control panel application, add configuration for our new app 24
  • 30. Sync with Unplugged devices  Unplugged will offer a native experience  Offline support 25
  • 31. Restyler  In the download from OpenNTF we offer three themes:  Light Dark iOS7 26
  • 32. Restyler  But you can also create your own themes  Go to  Over 100 variables allow you to create pretty much any UI needed  Save & Export will allow you to preview the theme on your device  Or you can download an nsf with the custom theme included 27
  • 33. Limitations of the Controls  Early OS versions of webkit (mobile browser) –  E.g. used 3rd party libs for scrolling  Some logic not obvious as developed first for Unplugged product  Limitations due to nature of XPages model and AJAX –  E.g. saving photos or saving docs using xp:button requires full page refresh 28
  • 34. Limitations of Controls  Only one (form) datasource can be updated/saved  Upgrades between major releases (2.x to 3.x etc) not as easy as copying files due to structure changes  Can use with other CSJS mobile libs but not XPages Ext Lib (inc Mobile IBM Dojo Widgets) 29
  • 35. Unplugged Controls User Group  A virtual user group meets first Thursday of each month  Next event tomorrow: – –  Deep dive into the UnpComputedNavigator control –  Demo of a Field Service application built using a mix of the controls and jQuery Mobile including camera integration –  Q&A 30
  • 36. Next Release  Version 3.2 will be release later this month –  JavaScript optimisation –  Fixed several bugs for large tablets on Android –  Improved cross database functionality 31
  • 37. 32