Your SlideShare is downloading. ×
##dd12 sviluppo mobile XPages
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×

Saving this for later?

Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime - even offline.

Text the download link to your phone

Standard text messaging rates apply

##dd12 sviluppo mobile XPages

741
views

Published on

Xpages, Extension Library and more...

Xpages, Extension Library and more...

Published in: Technology

0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
741
On Slideshare
0
From Embeds
0
Number of Embeds
3
Actions
Shares
0
Downloads
0
Comments
0
Likes
0
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. Sviluppo mobile XPages XPages ExtensionLibrary and more…Giuseppe Grasso
  • 2. Chi sono• My twitter bio:• Technologist, Italian LUG leader, unable to bio himself... and an IBM Champion!• Follow me as @grassog
  • 3. Agenda• Xpages mobile controls• Single page design• Mobile controls components• Some more projects• tools
  • 4. Extension Library• Provide Mobile Controls• Mobile themes for iOS, Android now and Blackberry in the future• Mobile renderType for Outline, DataView, FormTable
  • 5. Xpages mobile controls• Page Heading• Rounded List• Mobile Switch• Mobile Page• Single Page Application• Static Line Item• Tab Bar• Tab Bar Button
  • 6. Single page application• The whole application contained into a single XPage• Each app “screen” is a corresponding mobile Page control singlePageApp appPage1 appPage2 appPage2
  • 7. xe:singlePageApp control• xe:singlePageApp contains the whole application and controls page transitions• xe:appPage contains each app “screen”• SelectedPageName property (on singlePageApp) and pageName property (on appPage) controls witch page is shown to the device• Anchor URLs are used to navigate between pages ie: http://...db.nsf/mobileapp.xsp#page2 pageName
  • 8. xe:appPage• The container for the a page “screen”• pageName property when used with xe:singlePageApp to identify the page within the single page application• If resetContent property is true the appPage content is reloaded from the server every time (HTTP GET)• Set Preload property to force mobile page to load when the XPage loads
  • 9. xe:djxmHeading• The header area of the page, provides title, back button and actions facet• back property for the back button label• moveTo for the back button target (use #pageName to target another xe:appPage in the same XPage)
  • 10. xe:djxmRoundRectList• Display a rectangle with rounded corners• A container for your mobile app pages, think of it as an <xp:panel> for mobile
  • 11. xe:djxmLineItem• A way to implement mobile application links• moveTo property to set the target• transition to set the transiton effect (same html page)• icon to add an image• label link text• rightText text aligned to the right
  • 12. xe:djxmSwitch• A mobile “checkbox” (not data-aware)• event onStateChanged triggered when switching state ( current design property editor has a bug on and will generate a wrong tag xe:eventhandler instead of xp:eventhandler )
  • 13. xe:tabBar• a container tab bar buttons• Set barType property to “segmentedControl” to display buttons “together”
  • 14. xe:tabBarButton• icon1 and icon2 to select an image for normal and selected state• iconPos1 and iconPos2 to set icon position• Icons do not display on iOS if tabBar is segmentedControl to conform with platform conventions
  • 15. xe:outline• renderType set to “com.ibm.xsp.extlib.MobileOutlineNavigator”
  • 16. xe:formTable• Tipically used with formRow to build mobile forms• Mobile style used
  • 17. xe:dataView• categoryColumn to set one or more categorized columns• summaryColumn to set one or more data column• pageName to set with what page open the document
  • 18. Mobile ThemeActivated by XPage(s) name prefix• WebContentWEB-INFxsp.properties• xsp.theme.mobile.pagePrefix=m_• Pages with name beginning with m_ will be rendered with mobile theme and renderkitOverride detected platform theme with url parameter:• m_app.xsp?platform=iphone#pagename
  • 19. What else can you need?• Other interesting projects from OpenNTF…
  • 20. Mobile Value Picker• http://www.openntf.org/internal/home.nsf/project.xsp?actio n=openDocument&name=Mobile%20Value%20Picker
  • 21. Auto Logins for IBM Domino/ XWork server• http://www.openntf.org/internal/home.nsf/project. xsp?action=openDocument&name=Auto%20Logins% 20for%20IBM%20Domino/%20XWork%20server
  • 22. Adobe Shadows• Remote debug to your *actual* mobile device
  • 23. Adobe Shadow: connecting
  • 24. Adobe shadows: remote debug
  • 25. Grazie agli sponsor per aver reso possibile i Dominopoint Days 2012! Main Sponsor Vad sponsor Platinum sponsor Gold sponsor