iphone / Mobile Application Development using Oracle ADF

Jon Gooding – Solutions Architect

<Insert Picture Here>

Session Agenda

• Framework• ADF Mobile Components • iphone App Build and Demo• Questions and Answers

<Insert Picture Here>

Session Agenda

• Framework• ADF Mobile Components • iphone App Build and Demo• Questions and Answers

Provide a single, integration environment to build variety of mobile applications

Mobile Application Development FrameworkKey Requirements

• Support development of mobile application as a natural extension of Oracle Applications and Technologies

Support choices of client types and platforms

Provide a framework to Extend Oracle Tech/App to Mobile Clients

• One unified development framework and tool for multiple mobile platforms

• Quick integration with enterprise applications

• Process orchestration and integration for collaboration via mobile devices

• Allow developer to pick and choose the appropriate channels and mobile platforms for their scenario

Oracle Fusion Middleware

Extending Oracle Fusion Middleware to Mobile ClientsApplication

Development Framework

JDeveloper

JDeveloperSingle, Integrated Enterprise IDE

DBMS DBMS ModelingModeling

Java Dev.Java Dev. BPM Dev.BPM Dev.Java EE Java EE Dev.Dev.

ESB Dev.ESB Dev. Business Business RulesRules

Portal Dev.Portal Dev. Desktop & Desktop & MobileMobile

Common Metadata ManagerCommon Metadata Manager

Common Application Lifecycle ManagementCommon Application Lifecycle Management

Common Business CatalogCommon Business Catalog

Common Modeling FrameworkCommon Modeling Framework

Common IDE FrameworkCommon IDE Framework

Application Development FrameworkMVC Development for the Enterprise

• Mobile Device & Browser Optimization

• JSF Components • Mobile Components

• Ajax & DHTML• Flash

• JSF Page Flow• JSR 227 Data Binding

• O-R Mapping• EJB 3, JPA• WebServices

DeviceDevice ViewView ControllerController ModelModel

Struts

Relational Data XML Data Legacy Data

Business Services

Data Services

Model

Controller

JSP View

Desktop Browser and Mobile Devices

Me

tad

ata S

ervic

es

ADFm (JSR 227)

Mobile JSF/ADF Faces

JSF/ADFc

Java EJB BAM BPEL ADF BC BI XML

OfficeSwing

Web Services

Portlet Toplink JMXJCR

Ent. Apps

Complete/Standards-based Framework

ADF and JDeveloperTarget Developers and Communities

• One development environment and platform – For server/web-based and on-device applications– Covering both desktop and mobile clients

• Used by developers to– Build custom applications and modules– Configure/develop/integrate Fusion Middleware

components– Extend integrated applications to end users

• Used by Internal Oracle teams to build products:– Oracle Fusion Applications– Oracle Applications Unlimited– WebCenter Suite (Enterprise 2.0)– Oracle Enterprise Manager

<Insert Picture Here>

Session Agenda

• Framework• ADF Mobile Components • iphone App Build and Demo• Questions and Answers

Breaking Through Common Mobile Platform Limitations

Limitations of current solutions:– Duplicating development efforts • Different tools and environment for different mobile

devices and channels (on-device vs. web)• Different frameworks for native/on-device vs. web

based mobile applications

– Code-driven development paradigm• Java (ME and SE), Objective C, C++, etc.

– (Re)build all application services from the ground up• For application logic services, view services, etc.

– Proprietary frameworks and technologies

–Mobile Browser: Support for broad range of devices• Automatically leverages AJAX features in smartphone

browsers• Degrades gracefully to support plain HTML/WAP browsers

–Mobile Client: Develop one application, and deploy to many smartphone platforms• Native UI controls and complete on-device framework

– Single set of application logic components can be extended to desktop browser, mobile browser, and native mobile clients

ADF Mobile Enables Rapid and Scalable Mobile Application Development

Steps to Create Mobile Extensions using ADF

1. Ideally have existing Business Components to reuse

2. Create (or acquire) Mobile templates and css files.

3. Add to trinidad-config.xml

4. Add to trinidad-skins.xml

5. Build out View / Controller components with faces-config.xml

6. Apply mobile features to pages

<Insert Picture Here>

Session Agenda

• Framework• ADF Mobile Components • iphone App Build and Demo• Questions and Answers

iphone Native Look and Feel Style Programming

CSS 3.0 features enable our web application to have the same look and feel of the native iPhone applications. So we need to create a new skin in Trinidad for iPhone to include iPhone specific CSS features.

The steps to create a new skin is well documented in the below link

http://myfaces.apache.org/trinidad/devguide/skinning.html

After creating iPhone skin, we can switch between default skin and iPhone skin by using EL like below in Trinidad-config.xml:

<trinidad-config xmlns="http://myfaces.apache.org/trinidad/config">

<skin-family>

#{agentUtil.isiPhone ? 'iphoneFamily':‘minimal’}

</skin- family>

</trinidad-config>

iphone Navigation Panel Lists

iphone Email Client

iPhone Safari browser provides interface to iPhone email client as well. To invoke the email client with an email destination filled out, developer would use a tr:goLink component to display the email field, and add mailto: to the destination attribute of the component, such as:

<tr:goLink styleClass="messageLink"

destination="mailto:#{sessionScope.houseDetails.AgentEmail}"

text="#{sessionScope.houseDetails.AgentEmail}"/>

When a user links on this goLink, iPhone Email client will be started, and the To: field would be populated with the content of the AgentEmail variable.

iphone Google Maps

For example, the following will drop a pin at a location specified by session variables houseDetail.Street, houseDetail.City, and houseDetail.PostCode.

<tr:goLink styleClass="messageLink"

destination="http://maps.google.com/maps?q=#{sessionScope.houseDetails.Street},

+#{sessionScope.houseDetails.City},

+#{sessionScope.houseDetails.PostCode}"

text="#{sessionScope.houseDetails.Street}"/>

It is also possible to program driving directions using this feature. The format of the Google Maps URL would be:

http://maps.google.com/maps?saddr=<Start_Address>&daddr=

iphone specific tips

• Not Quite Apps Store– Can Still have users have an icon on the desktop– Create a PNG format graphic file (45x45 pixels in size)

named apple-touch-icon.png and place it in the root directory of the site.

A lot of Apps Store applications are browser based, with a application wrapper.

Roadmap – ADF Mobile Platform

• ADF Mobile Browser– Version 11gR1 is available today– Version 11g PS1 (11.1.1.2.0) will add better

narrow screen support, style sheet samples, and browser detection support

• ADF Mobile Client – Technical Preview planned for 2009

• Will be delivered as an Extension/Update for JDeveloper 11g PS1

– Production Release planned for 2010• Including:

– Developer feedback – Performance optimization

• Dependent on BlackBerry OS Updates

Resources for ADF Mobile

•Product Information:

http://www.oracle.com/technology/tech/wireless/adf_mobile.html•Demo Site:

http://stshld.oracle.com:8888/demo/faces/main.jspxADF Mobile Browser Demos

Mobile Banking Demo (New)Demo of Mobile Banking site for commercial/retail banking. Supports all major smartphone and feature phone browsers.

Service Manager Demo (New)Link to Service Manager application in the Oracle OpenWorld 09. Supports BlackBerry 4.6 and above, iPhone Safari browser, and consumer phone running plain HTML browsers.

Pharma App (New)Demo of a Pharma Sample Drop application. Basic (no mobile CSS optimization) user interface. Supports all major smartphone and feature phone browsers.

HR Demo App (New)Demo of Mobile Banking site for commercial/retail banking. Supports all major smartphone and feature phone browsers.

Mobile FOD Demo (Enhanced)Running demo of the tutorial for building the mobile version of Fusion Order Demo (FOD). Now with ADF Security enabled. Supports all major smartphone and feature phone browsers\

<Insert Picture Here>

More Information on Oracle JDeveloper

• http://oracle.com/technology/jdev

• Tutorials and How-To’s• Samples• Demos• Books and Training• Discussion forum• Blogs• More…

<Insert Picture Here>

Session Agenda

• Framework• ADF Mobile Components • iphone App Build and Demo• Questions and Answers