« Quay lại

Oracle ADF Java for Mobile (Andoid & iOS)

Toggle
Oracle ADF Java for Mobile (Andoid & iOS)
Câu trả lời
00:12 17/11/2012
http://docs.oracle.com/cd/E18941_01/tutorials/MobileTutorial/jdtut_11r2_54_1.html
Part 1: Set Up and Configure an iOS Environment

This tutorial walks you through the process of developing an on-device ADF Mobile application using JDeveloper. In this tutorial, you deploy the application to an iPhone simulator. However, the developed application can also be deployed to an actual iOS device/simulator.

If you are interested in the setup and deployment to an Android emulator start with Part 2: Setup and Configure an Android Environment.


show more or lessRead more...









hello world app in simulatorhello world app in simulator


Purpose

Duration

Application


In this part of the tutorial, you configure JDeveloper and the environment to support designing and running an Oracle ADF Mobile application. The tasks to perform in this part include: installing ADF Mobile extension in JDeveloper, installing the Apple iOS SDK and simulator, and deploying and testing a Hello World page.

To complete the tutorial, you need to download a zip file (mobilelabs.zip). The file contains a starter application (webservice.zip), which is used in the section entitled Develop and Consume a WebService Application, and an application that contains the solution (MyMobileApp.zip).
2 hours Download applicationname.zip



Step 1: Download and Install the Required Components
1.
Get access to a Mac that is running OSx 10.7 (Lion) or above. iOS development is only supported on a Mac. Mountain L:ion (10.8) is compatible but does not support JavaScript debugging.

2.
Download and install Xcode version 4.4.x or above, along with the iOS SDK.



The Xcode and iOS SDK are available from Apple. Show more or lessRead more...





3.
Install the ADF Mobile extension by using the JDeveloper Update Center. Start JDeveloper, then select the menu item Help > Check for Updates.

check for updates

4.
If you are installing from a local file, click the Install From Local File radio button, and browse to the location where you downloaded the ADF Mobile extension zip file.

If you are installing from an Upadte Center, ensure the Search Update Center radio button is selected and click Next.

step 1 in check for updates

5.
Click Next and then Finish.

step 2 in check for updates

6.
Restart JDeveloper as instructed.

restart jdevloper message

7.
When JDeveloper is restarted, select Studio Developer (All Features) to be able to use the ADF Mobile extension.

After JDeveloper is restarted, set the device SDK preferences as follows:

Select the menu item Tools > Preferences.

preferences menu

8.
On the left side of the Preferences screen, click the ADF Mobile node. If you are using the ADF Mobile extension for the first time, click the Load Extension button.

mobile preferences


9.
Next, expand the ADF Mobile node, and select Platform SDKs.
In the Supported Platform list box, ensure iOS is selected.

Update all entries with the correct directory locations. If you have installed Xcode to its default location, then you can click on the magnifying glass next to the input list, and navigate to the iOS SDK Directory as recommended in the hint. In general the hinted value should work.

Set the remaining properties to their suggested values (assuming you've installed iTunes to it's default directory).

platform sdk location

Click OK to dismiss the Preferences pane.



Step 2: Create an ADF Mobile Application
1.
In this part, you first create a “Hello World” ADF Mobile application, and then deploy this starter application to the iPhone simulator.



Preparing ADF Mobile Framework applications for deployment is primarily comprised of creating platform-specific deployment profiles. Show more or lessRead more...











In the Application Navigator click New Application to start the New Gallery dialog box.

New Application

2.
In the New Gallery expand the General - Applications nodes and select Mobile Application (ADF).
Then click OK.

new gallery mobile application item

3.

In the Name your application page, enter MyMobileApp in the Application Name field, and click Next.

name mobile application


4.
Click Next, and examine the Project Features for your second project, ApplicationController. The project includes the ADF Mobile Framework.

features of application controller project

5.
Click Next twice and in the Name your project page, leave the default project name. Examine the Project Features for the ViewController project. Notice that the project uses ADF Mobile Framework, HTML and CSS, Java, and JavaScript project features.

project features in view controller project


6.
Click Next and Finish. You should see a new ADF Mobile application created in JDeveloper.

application navigator files after mobile app creation

7.
Right-click on the ViewController project and select New
In the New Gallery, select Web Tier - HTML and then the HTML Page item.

application navigator files after mobile app creation

8.
Accept the default File Name and Directory, then click OK.

application navigator files after mobile app creation

9.
In the Editor, type the following text "Deployment Successful".

Then, highlight the text and then in a fourth drop down from the left, select 7. It might seem large, but it will appear smaller when running in the simulator.

Save all your work.

application navigator files after mobile app creation




Step 3: Add UI Access to the Pages
1.
In this section, you configure a new feature so the user can access the newly defined AMX pages from the native application container. You will need to perform this task when ever you add pages or task flows to your application.

After you complete an ADF Mobile Framework application project, JDeveloper adds both project and application level artifacts.Show more or lessRead more...








In the Application Navigator, expand the ViewController project. Locate and expand the Application Sources folder. Then expand the META-INF folder. You will see the adfmf-feature.xml file as shown.

adfmf-feature,xml selected in the applications navigator

2.
Double click on the adfmf-feature.xml file to launch the Feature editor.

adfmf-feature.xml in editor

3.
Add a new feature by clicking the green plus sign on the Features table near top of the editor. If you cannot see the plus sign, scroll the Feature editor to the right (the plus sign is on the far right side of the Feature editor).

adfmf-feature.xml with create adf mobile feature pane displayed with default values

4.
In the Create ADF Mobile Feature dialog, modify the following values:

- Name: Success
- Feature ID: oracle.success
- Confirm the Add a corresponding feature reference to adfmf-application.xml check box is selected, and then click OK.

adfmf-feature.xml with create adf mobile feature pane displayed with correct values

5.
In the Features table, select the newly created feature oracle.success. Under the Features table, click the Content tab, and locate the Content table. Notice that the content item oracle.success.1 is created by default.

Save your work.

adfmf-feature.xml with content tab displayed with correct values

6.
Confirm the Id field of the content item is set to oracle.success.1.

content tab with correct id displayed

7.
In the Content area, ensure the Type property is set to Local HTML .

content tab with correct type displayed

8.
In the Content section, find the URL text box.

On the right side of the URL text box, click the magnifying glass icon.

task flow selected when green plus sign is clicked

9.
In the Open window, select the html page you created earlier. In this case, untitled1.html. Then click Open.

view controller rask flow option selected in content tab


10.
The resulting definition should look like the image below.

Save all your work.

completed feature displayed in the editor






Step 4: Deploy and Test the Page
1.
In the Application menu, select Deploy - New Deployment Profile to start the Create Deployment Profile dialog box.

deploy - new deployment profile menu option

2.
In the Profile Type drop-down list, ensure ADF Mobile for iOS is selected and then click OK.


name of deployment profile

3.
In the ADF Mobile for iOS Deployment Profile Properties dialog box, examine the deployment options.

deployment profile properties


4.
Select the iOS Options node and set the Simulator Target Version to the version of the simulator you are using. In this tutorial, we are using version 5.0 of the simulator.

setting simulator target version to 5.0

Click OK, and then save all your work.

5.
Before deploying the application, confirm the iOS Simulator is working correctly by clicking on the icon on the desktop. Once it has started, you can leave it alone.

deploy menu option

6.
In the Application menu, select Deploy > iOS_Native_Mobile_archive1 deployment profile.

deploy menu option

In the subsequent dialog box, select Deploy application to Simulator, and click Finish.

deploy profile to simulator window



There are two approaches to testing an ADF Mobile application: Show more or lessRead more...










7.
Watch the Deployment Log window for any errors. If the compilation and deployment process completes as expected, you should see the Deployment Log window as shown below.

The next step in the process is to start the iOS Simulator.


deployment log window - deployment finished

8.
After the simulator is started, use your mouse to swipe from right to left exposing a second page of applications in the iPhone simulator. You should see the MyMobileApp application we have just created and deployed.

application in iOS simulator
Click the MyMobileApp icon to start the application.

application in iOS simulator

Click OK in the popup asking if MyMobileApp Would Like to Use Your Current Location.
application in iOS simulator



9.
The MyMobileApp application currently contains your HTML page running inside the ADF Mobile application. Because there is only one feature in the application currently, you'll only see one feature.
.

hello world application in simulator

To show and hide the tab bar, click the up or down arrow on the lower right side of the simulator.


10.
To clear out the application from the simulator, select iOS Simulator - Reset Content and Settings... from the menu. Then click Reset to confirm.

quit ios simulator menu option

To clear the settings, click OK in this pane.

quit ios simulator menu option


11.
Shut down the iPhone simulator by clicking the iOS Simulator menu item (on the top of the Mac desktop), and selecting Quit iOS Simulator.

quit ios simulator menu option
false

RE: Oracle ADF Java for Mobile (Andoid & iOS)
Câu trả lời
00:12 17/11/2012 gửi bài phản hồi tới Trí Võ.
Part 2: Set Up and Configure an Android Environment

This tutorial walks you through the process of developing an on-device ADF Mobile application using JDeveloper. In this part of the tutorial, you deploy the application to an Android emulator. However, the developed application can also be deployed to an actual Android device.
show more or lessRead more...









hello world app in simulatorhello world app in simulator


Purpose

Duration

Application


In this part of the tutorial, you configure JDeveloper and the environment to support designing and running an Oracle ADF Mobile application. The tasks to perform in this part include: installing ADF Mobile extension in JDeveloper, installing the Android SDK and emulator, and deploying and testing a Hello World page.

To complete the tutorial, you need to download a zip file (mobilelabs.zip). The file contains a starter application (webservice.zip), which is used in the section entitled Develop and Consume a WebService Application, and an application that contains the solution (MyMobileApp.zip).
2 hours Download applicationname.zip



Step 1: Download and Install the Required Components
1.
Get access to a Mac that is running OSx 10.7 (Lion) or above. iOS development is only supported on a Mac. Mountain L:ion (10.8) is compatible but does not support JavaScript debugging.

2.
Download and install the Android SDK from http://developer.android.com/sdk/index.html.

check for updates

3.
To keep it simple, create a new folder on the desktop and name it Android.

check for updates

4.
Drag and drop the file from the downloaded location into the new Android folder.
Then unzip it.

check for updates

5.
In the Android folder, expand the android-sdk-macrosx - tools folders.
Double-click the android application.

check for updates

6.
The Android SDK Manager is then invoked. This is where you install all packages and emulators you use.

Select the Android 4.0.3 (API15) node and install all the packages. This process may take a while to complete depending on you internet connection. For some packages, you will be prompted for a username and password. You may cancel those installations and continue.

check for updates

7.
Install the ADF Mobile extension by using the JDeveloper Update Center. Start JDeveloper, then select the menu item Help - Check for Updates.

check for updates

8.
If you are installing from a local file, click the Install From Local File radio button, and browse to the location where you downloaded the ADF Mobile extension zip file.

If you are installing from an Upadte Center, ensure the Search Update Center radio button is selected and click Next.

step 1 in check for updates

9.
Click Next and then Finish.

step 2 in check for updates

10.
Restart JDeveloper as instructed.

restart jdevloper message

11.
When JDeveloper is restarted, select Studio Developer (All Features) to be able to use the ADF Mobile extension.

After JDeveloper is restarted, set the device SDK preferences as follows:

Select the menu item Tools > Preferences.

preferences menu

12.
On the left side of the Preferences screen, click the ADF Mobile node. If you are using the ADF Mobile extension for the first time, click the Load Extension button.

mobile preferences


13.
Next, expand the ADF Mobile node, and select Platforms.
In the Supported Platform list box, ensure Android is selected.

Update all entries with the correct directory locations. If you have installed the SDK to its default location, then you can click on the magnifying glass next to the input list, and navigate to the Android SDK Directory as recommended in the image or you install location.


platform sdk location

Click OK to dismiss the Preferences pane.



Step 2: Create an ADF Mobile Application
1.
In this part, you first create a “Hello World” ADF Mobile application, and then deploy this starter application to the Android emulator.



Preparing ADF Mobile Framework applications for deployment is primarily comprised of creating platform-specific deployment profiles. Show more or lessRead more...











In the Application Navigator click New Application to start the New Gallery dialog box.

New Application

2.
In the New Gallery expand the General - Applications nodes and select Mobile Application (ADF).
Then click OK.

new gallery mobile application item

3.

In the Name your application page, enter MyMobileApp in the Application Name field, and click Next.

name mobile application


4.
Click Next, and examine the Project Features for your second project, ApplicationController. The project includes the ADF Mobile Framework.

features of application controller project

5.
Click Next twice and in the Name your project page, leave the default project name. Examine the Project Features for the ViewController project. Notice that the project uses ADF Mobile Framework, HTML and CSS, Java, and JavaScript project features.

project features in view controller project


6.
Click Next and Finish. You should see a new ADF Mobile application created in JDeveloper.

application navigator files after mobile app creation

7.
Right-click on the ViewController project and select New
In the New Gallery, select Web Tier - HTML and then the HTML Page item.

application navigator files after mobile app creation

8.
Accept the default File Name and Directory, then click OK.

application navigator files after mobile app creation

9.
In the Editor, type the following text "Deployment Successful".

Then, highlight the text and then in a fourth drop down from the left, select 7. It might seem large, but it will appear smaller when running in the emulator.

Save all your work.

application navigator files after mobile app creation




Step 3: Add UI Access to the Pages
1.
In this section, you configure a new feature so the user can access the newly defined AMX pages from the native application container. You will need to perform this task when ever you add pages or task flows to your application.

After you complete an ADF Mobile Framework application project, JDeveloper adds both project and application level artifacts.Show more or lessRead more...








In the Application Navigator, expand the ViewController project. Locate and expand the Application Sources folder. Then expand the META-INF folder. You will see the adfmf-feature.xml file as shown.

adfmf-feature,xml selected in the applications navigator

2.
Double click on the adfmf-feature.xml file to launch the Feature editor.

adfmf-feature.xml in editor

3.
Add a new feature by clicking the green plus sign on the Features table near top of the editor. If you cannot see the plus sign, scroll the Feature editor to the right (the plus sign is on the far right side of the Feature editor).

adfmf-feature.xml with create adf mobile feature pane displayed with default values

4.
In the Create ADF Mobile Feature dialog, modify the following values:

- Name: Success
- Feature ID: oracle.success
- Confirm the Add a corresponding feature reference to adfmf-application.xml check box is selected, and then click OK.

adfmf-feature.xml with create adf mobile feature pane displayed with correct values

5.
In the Features table, select the newly created feature oracle.success. Under the Features table, click the Content tab, and locate the Content table. Notice that the content item oracle.success.1 is created by default.

Save your work.

adfmf-feature.xml with content tab displayed with correct values

6.
Confirm the Id field of the content item is set to oracle.success.1.

content tab with correct id displayed

7.
In the Content area, ensure the Type property is set to Local HTML .

content tab with correct type displayed

8.
In the Content section, find the URL text box.

On the right side of the URL text box, click the magnifying glass icon.

task flow selected when green plus sign is clicked

9.
In the Open window, select the html page you created earlier. In this case, untitled1.html. Then click Open.

view controller rask flow option selected in content tab


10.
The resulting definition should look like the image below.

Save all your work.

completed feature displayed in the editor





Step 4: Deploy and Test the Page in an Android Emulator
1.
Unlike iOS Simulator which gets started during the deployment process in JDeveloper, for Android, the Emulator must be running prior to deployment.

Reopen the android application, from Finder.

check for updates



2.
In the Android SDK Manager menu bar, select Tools - Manage AVDs...

The Android Virtual Device Manager dialog is displayed.

check for updates



3.
Click the New button and specify the following values to the properties.

check for updates

Name = ADFmf
Target = Android 4.0.3 - API Level 15
CPU/ABI = ARM (armeabi-v7a)
SD Card - 500

For the remainder, keep the defaults and click the Create AVD button.

check for updates


4.
A notification of the new AVD is displayed. Click OK to dismiss it.

check for updates

You should now see you new AVD in the list.

check for updates


5.
Select the new AVD and click the Start button.

check for updates

Accept the default values in the Launch Options pane, and click Launch.

check for updates

6.
It may take a while for the emulator to be invoked and start running. Depending on the speed of your CPU, 2 minutes is possible.

check for updates

7.
Click the OK button to see the Home screen.

check for updates


8.
On the bottom of the emulator, click the Applications icon and all the installed applications will be visible.

Keep the emulator open and return to JDeveloper and your MyMobileApp

check for updates



9.
In the Application menu, select Deploy - New Deployment Profile to start the Create Deployment Profile dialog box.

deploy - new deployment profile menu option

10.
In the Profile Type drop-down list, ensure ADF Mobile for Android is selected and then click OK.


name of deployment profile

11.
In the ADF Mobile for Android Deployment Profile Properties dialog box, examine the deployment options.

deployment profile properties


12.
Select the Android Options node and confirm your values look like the ones below.

setting simulator target version to 5.0

Click OK, and then save all your work.

13.
In the Application menu, select Deploy - New Deployment deployment profile.

deploy menu option

In the subsequent dialog box, select Deploy application to emulator, and click Finish.

deploy profile to simulator window



There are two approaches to testing an ADF Mobile application: Show more or lessRead more...










14.
Watch the Deployment Log window for any errors. If the compilation and deployment process completes as expected, you should see the Deployment Log window as shown below.


deployment log window - deployment finished

15.
Navigate back to the emulator. Click the Home button...

application in iOS simulator

...and then the Application icon to refresh the applications.

application in iOS simulator

You should see the MyMobileApp application we have just created and deployed.


Click the MyMobileApp icon to start the application.

application in iOS simulator



16.
The MyMobileApp application currently contains your HTML page running inside the ADF Mobile application.
.

hello world application in simulator


17.
Keep the emulator running if you intend to work on the WebService Mobile application.

If you are finished, then close the emulator, but remember to restart it before you want to deploy to it again.
false

RE: Oracle ADF Java for Mobile (Andoid & iOS)
Câu trả lời
00:13 17/11/2012 gửi bài phản hồi tới Trí Võ.
Part 3: Develop and Consume a Web Service for a Mobile Application



In this part of the tutorial, you convert a POJO into a web service, create data controls from the web service, and then consume the web service in a mobile page. In the first section, you start with an existing application that contains plain old Java classes. Then you add a method to return employee and department information. You also add a web method annotation to define a method as part of the web service.

Then you modify the method properties using the Code Editor, Property Inspector, and Structure window. After you compile the web service and deploy it to the integrated server, you run it in the HTTP Analyzer, which returns the result of the method.

In the second section, you use your MyMobileApp application and create data controls from the running web service. This process then allows you to consume the data controls in two ADF Mobile pages you later create.

Then in the next section, you create a new Feature for the application, as another entry point. This Feature's content will be a new task flow that is created when you specify the feature. While creating the Feature's content, you'll specify a new task flow as the entry point to the Feature.

In the fourth section, you modify the task flow and add two pages. In the first page you include a parameter to be passed to the web service, and a button to execute the web service. In the second page, you display the results that are returned from the web service.

The fifth and final section, is where you deploy the application to the iOS simulator and test it.



show more or lessRead more...




enter alt text hereenter alt text here

Step 1: Build a POJO Annotation-Driven Service
1.
Navigate to the mobilelabs.zip application you downloaded earlier and unzip it onto your machine. Within the zip are two additional zip archive files (webservice.zip and MyMobileApp.zip). Unzip the webservice.zip file to your machine.

Then in JDeveloper, open the WebService application.

Select the Applications Navigator tab and click Open Application (alternatively, you can select File- Open)

open application menu option


The most common way of using web services in a feature developed with local ADF Mobile XML is to create a data control for a SOAP web service. Show more or lessRead more...










2.
In the Open Application dialog box, locate the WebService directory that was created when you unzipped the WebService.zip file. Select WebService.jws, and then click Open.

When prompted, click OK to migrate application. Let that process complete and dismiss the window.
select webservice.jws file


3.
The Applications Navigator now displays the WebService application, which contains an Annotation project.
annotation project selected in applications navigator

4.
In the next couple of steps you add a method to return the employees and department information. You annotate a class to define it as a web service. You also add a web method annotation to define a method as part of the web service. This section shows how to modify the method properties using the Code Editor, Property Inspector, and Structure window.

In the Applications Navigator, expand the Annotation project nodes to show the POJO classes:

- Dept.java describes the department structure.
- Emp.java describes the employee structure.
- MyCompany.java populates information about department and employees.
- TestClient.java used as a test client to print department information.
annotation package expanded


5.
Double-click MyCompany.java to edit it.
my company . java selected


6.
Notice the existing data for departments and employees. Add a @WebService annotation after the import statements. This annotation denotes that the class contains a method to be used by a web service.



Web service annotations have been defined in a few JSRs.Show more or lessRead more...




When prompted to 'Select Import from WebService' select the 'WebService (javax.jws)' option.
mycompany.java in code editor with @WebService added to code


7.
In the margin, click the Quick Hint (light bulb icon) and select the Configure Project for Web Services option
configure project for web service selected in menu


8.
In the Select Deployment Platform dialog box, ensure that Java EE 1.5, with support for JAX-WS Annotations is selected.

Then click OK. This step adds the javax.jws.WebService import statement to the Java class and creates a web.xml file.
java ee 1.5 with support for jax-ws annotation radio button selected


9.
The Applications Navigator should now look like the following image. Notice that the icon for MyCompany.java class is changed to represent a WebService class, and the web.xml file has been added to your project
web.xml added to project and icon for mycompany.java changed in applications navigator


10.
Back in the Code Editor, scroll down to the bottom of the MyCompany.java class and define the following method, which returns information about all employees working in a specific department.

Then save all your work.



public Dept getDeptInfo (int id) {
for (Dept a: this.getMyDepts() ) {
if (a.getId() == id) {
return a;
}
}
return null;
}

code editor with new code added

11.
Create a second annotation before the getDeptInfo() method. The annotation signifies that the method will be exposed from the web service. Add a blank line above the getDeptInfo() method, and insert @WebMethod.

.@webMethod added to code

When prompted, add the import javax.jws.WebMethod; statement.

The class should look like the image below.

image after the import statement is included. no red line below @WebMethod


12.
Click Save All to save your work.

13.
You can use the Property Inspector to modify the characteristics of the class. In the menu bar, select View - Properties. The Property Inspector opens as a tab in another area (right side or bottom) of the IDE. Note: If the Property Inspector opens in a different part of the IDE, you can drag its tab and drop it on the bottom panel if you would rather work with it there.
Window - Properties menu optio selected


14.
To display the properties of the MyCompany class in the Property Inspector, select the Source tab at the bottom of the Structure window, then select the top level MyCompany class name.
MyCompany selected in application navigaotr and structure panemycompany in the property inspector


15.
The Property Inspector displays a few expandable nodes on the left side of the window. Expand the JAX-WS tab and notice that the Service Name has the word 'Service' appended to the class name. If you don't want to have the service named "MyCompanyService", you can change it, and the class reflects the change.

Change the Service Name to MyCompanyWS.

Then save all your work.
service name property set to MyCompanyWS


16.
In the Code Editor you can see that the @WebService annotation updates to reflect the new service name. Likewise, changes in the Code Editor are synchronized in the Property Inspector. This functionality is available at the method level also.

You now have a class, defined as a web service, that contains an exposed method. In the next few steps you test the web service.
mycomapny.java in coe editor with @WebService(serviceName = "MyCompanyWS") hightlighted


17.
Before testing the web service, check that your web browser settings are correct. Select Tools - Preferences and then scroll down the list on the left to select the Web Browser and Proxy page. On the Proxy Setting tab, ensure that the Manual Proxy Settings radio button is not selected, then click OK.
Web Server and Proxy node selected in Preferences and Use System Default Proxy Setting radio button selected


18.
In the Applications Navigator, right-click the MyCompany.java node, and in the context menu, select Test Web Service.

This option invokes the integrated WebLogic Server, deploys the service, and then starts the analyzer. It might take a few seconds to start WebLogic Server if you are running it for the first time.

Test Web Service menu item selecte

If you are testing a service for the first time, you need to enter a password for the WebLogic Server. This password is defined by you for this embedded version of WLS and is not to be confused with any external WLS instance that you might have running.

Insure the Listen Address is set to <All Available Addresses>.
create default domain pane


19.
The top portion of the HTTP Analyzer editor window displays the URL for the web service, the WSDL URL, and the exposed operations. Select the MyCompanyPort.getDeptInfo(,) operation from the list.

Copy the URL and paste it into a text document for use later.

Do not close the project or shutdown the Web server. The deployed service needs to be running while we test it. If it does get shut down, rerun it.

HTTP anayzer showing url being used to access the web service



The HTTP Analyzer allows you to examine the content of HTTP request/response package pairs. You can edit the content of a request package, resend it and observe the response packet returned.Show more or lessRead more...











Step 2: Create Data Controls from the WebService
1.
Now that the web service is up and running, let's go back to the mobile application you created earlier and create some data controls. Reopen the MyMobileApp application in the Applications Navigator.

Note: Do not use the WebService application from the earlier step. All the following work should be done in the Mobile application you created earlier.

MyMobileApp in the application navigator with view controller project selected


2.
Before we consume the web service in a page, the project must be able to support creating data controls. To confirm this, open the ViewController project properties, and examine the list of Features to make sure it contains the SOAP Web Services technology.

Close the Project Properties window, and save your work.
features node in project properties selected and a displayed list of features being used by the project


3.
Because the project contains the Web Services technology, we can create data controls to access our web service.

Right click the ViewController project and select New. In the gallery select the Business Tier - Data Controls category and then double click Web Service Data Control.
new gallery - business tier - data controls selected - web service data control item selected


4.
In the first step of the Web Service Data Control wizard, set the Name property to MyDeptWS.

To access the web service, set the URL property to the url that you earlier copied into a text document. For example: http://localhost:7101/WebService-Annotation-context-root/MyCompanyPort.

The mobile runtime simulator cannot resolve localhost. Therefore, you must replace the URL value for localhost with a valid IP address.

To find a valid IP address, open a command window and enter the command ipconfig. Replace the URL value for localhost with a valid address and then append the string ?WSDL to complete the value.

The completed value should look something like the following (with your IP address):
http://101.155.1.67:7101/WebService-Annotation-context-root/MyCompanyPort?WSDL
step 1 of 5 - url property filled in with http analyzer value plus ?WSDL selected


5.
The WSDL is then read, and the Service property is populated with a list of available services. In this tutorial, the MyCompanyWS service should be available.

Ensure the Copy WDSL Locally checkbox is selected. Having the WSDL local will make the application start quicker, since the web service definition is available and does not have to be remotely read.

Click Next.
step 1 of 5 - service property populated with {http://annotation/}MyCompanyWS


6.
The Data Control Operations page shows all the methods that the web service supports. Shuttle all the methods to the Selected side.

Click Finish.
step 2 of 5 - all of the available operations are shuttled to the right - they will be the ones the data controls will support


7.
When you refresh the Data Controls pane, the new web service control is displayed.

Expand the MyDeptWS node to see all the available methods.
If you expand the DeviceDataControl, you'll see all the pre-build methods used to access platform specific functionality.



In the Data Controls panel, each data control object is represented by an icon. Show more or lessRead more...































data controls pane displaying all the new controls





Step 3: Create a Feature to Access the Application
1.
In this section, you configure a new feature so the user can access the newly defined AMX pages from the native application container.


In the Applications Navigator, expand the ViewController project. Locate and expand the Application Sources folder. Then expand the META-INF folder. You will see the adfmf-feature.xml file as shown.

adfmf-feature,xml selected in the applications navigator
2.
Double click on the adfmf-feature.xml file to launch the Feature editor, where you will see the feature you added earlier.

adfmf-feature.xml in editor

3.
Add a new feature by clicking the green plus sign on the Features table near top of the editor. If you cannot see the plus sign, scroll the Feature editor to the right (the plus sign is on the far right side of the Feature editor).

adfmf-feature.xml with create adf mobile feature pane displayed with default values

4.
In the Create ADF Mobile Feature dialog, modify the following values:

- Name: Dept
- Feature ID: oracle.dept
- Confirm the Add a corresponding feature reference to adfmf-application.xml check box is selected, and then click OK.

adfmf-feature.xml with create adf mobile feature pane displayed with correct values

5.
In the Features table, select the newly created feature named Dept. Under the Features table, click the Content tab, and table. Notice that the content item oracle.dept.1 is created by default.

Save your work.

adfmf-feature.xml with content tab displayed with correct values

6.
Click in the Id field of the content item oracle.list.1. Make sure the content is highlighted as shown below before proceeding to the next step.


7.
In the Content table, click the newly created oracle.list.1 entry, and ensure the Type is set to ADF Mobile AMX.

content tab with correct type displayed

8.
In the Content section, find the File text box.

On the right side of the File text box, click the green plus sign icon, and select Task Flow.

task flow selected when green plus sign is clicked

9.
You are then prompted with a Create Task Flow pane. Use the default value (ViewController-task-flow.xml) and click OK. This will add a new, empty task flow to your application and bring you to it. Next you'll add the pages and control flows.

view controller rask flow option selected in content tab


10.
Click the adfmf-feature.xml file to confirm it is correct and matches the image below.

Then Save all your work.

completed feature displayed in the editor






Step 4: Develop the Application's Task Flow and Pages
1.
From the Components tab, create two new views to consume the web service, and name them request and results. Create the request view first, and it will be surrounded by a green circle, signifying it is the entry point to the task flow.


view controller task flow with request and results views


2.
Add one control flows to access the pages.


Control Flow Case Name

Source View

Destination View

results request results

The flow will be used to navigate to the Results page. A default __back option can be used to navigate from the results page to the page that called it.
view controller task flow with controls flows between both pages


3.
Define the request page that will include a call to the web service. In the task flow diagram, double click the request view. In the Create ADF Mobile AMX Page pane, accept the default File Name and Directory.

Notice the Page Facets section. This is a handy way to quickly build standard facets on the page. If you do not do this here, you'll have to manually add them in your page. Create a Header and Primary Action facet, then click OK. In this application there is no need for a Secondary Action or Footer facet.

create adf mobile amx page for request view


4.
Click the Preview tab at the bottom of the editor and then set iPhone Standard as value the first drop down.

iphone standard selected in request.amx


5.
Now we'll add some components to the page. To see all the mobile components, select View - Component Palette.



ADF Mobile pages allow you to develop in the same way as you would for a standard web application. Show more or lessRead more...








6.
From in the Structure Pane, expand the Panel Page - Header Facet and select the Output Text..


In the Property Inspector, set the Value property to Request and the Rendered property to true. Save your work.

output text in property inspector showing changed values

The results in the Structure Pane...

output text item set below panel page in structure pane

,,, and the Editor Preview tab.

output text in property inspector showing changed values


7.
In the Data Controls pane, expand the MyDeptWS - getDeptInfo(integer) - Parameters node, and select arg0. Drag arg0 onto the Panel Page (in the Structure pane), and release the mouse. In the context menu, select Text - ADF Mobile Input Text w/ Label.
adf mobile input text w/ lable selected in context menu


8.
With the new input item still selected, find the Property Inspector and set the Label property to Department Id.

input item in property inspector

The results in the Editor Preview tab.

input item in property inspector

Expand the Behavior node and ensure the Required and Maximum Length properties are null.

input item in property inspector



9.
In the Structure Pane, expand the Primary facet and select the Button component. It was automagically created when you selected to create the Primary facet.

button selected in general controls of component tab


In the Property Inspector, set the Id and Text properties to RunWS and the Action property to results.

button displayed in property inspector


10.
From the Operations section of the component palette, drag and drop a Set Property Listener onto the RunWS button.

set property listener in structure pane

In the Property Inspector, set the From property to #{bindings.arg0.inputValue} and set the To property to #{applicationScope.deptID}. The From property is the source value from the input item, and the To property contains a scoped parameter to use later.

Finally, set the Type property to action. This sets the Property Listener to become and Action Listener.

Save all your work.
set property listener in structure pane


set property listener in property inspector with correct values


11.
Now create the results page and add components to display the returned department information.

From the ViewController-task-flow.xml diagram, double click the results page and accept the default File Name and Directory.

Make sure to only create the Header and Primary Action facets.

create adf mobile amx page for result view

Look at the Preview and set iPhone Standard as the form to work with.

iphone standard option selected

12.
Select the Output Text for the Header and in the Property Inspector, set the following values:

Value to Results
Rendered to true.

Save all your work.

output text in property inspector

The results in the Structure Pane

output text in property inspector


13.
Now add a Form to the Panel Page to display the results returned from the web service.


In the Data Controls pane, select the child Return node of the getDeptInfo(Integer) parent Return node. Drop it on the Panel Page as a Form - ADF Mobile Read-only Form.
Form - ADF Mobile Read-only menu option selected

14.
In the Edit Form Fields pane, for each item, change the Display Label to something short and clear. Then click OK.

edit form fields with all attribute labels updated


15.
The Edit Action Binding pane is then displayed, and you must set the parameter value so that the web service returns the department information.

Set the Value property to #{applicationScope.deptID}. This is the value that you specified earlier in the To property of the Set Property Listener.

edit action binding with value set correctly

Then click OK and the Editor Preview should look like the image below,

edit action binding with value set correctly


16.
In the Structure Pane, expand the Primary facet and set the Button to go back to the Request page.

Set the Id and Text properties to Request and the Action property to __back.
button component shown in the property inspector

button shown in structure pane


17.
One final task must be performed in the results page. We must execute the web service.

In the Bindings tab, click the green plus sign next to Executables.

binding tab with executable green plus sign highlighted

In the Insert Item pane, select invokeAction and click OK.



An invokeAction executable calls an existing action or method binding defined in the action bindings.Show more or lessRead more...






inser item pane shown with invokeAction selected

18.
In the Insert invokeAction pane, set the id to RunWS and the Binds property to getDeptInfo. Then click OK.

insert invokeAction pane with correct values


19.
Finally, for the RunWS action, in the Property Inspector, confirm that the Refresh property is set to <default>(deferred).
result binding tab with runws properties defined
20.
Save all your work.





Step 5: Run and Test the Web Service from the Simulator
1.
Deploy the application just like you did in the previous section. If you still have the deployment profile from before, then use it and go directly to step 4 and continue from there. The next three steps show you how to create a new deployment profile, if the old one isn't available.


To make the whole development process easier, always test your application in a simulator.Show more or lessRead more...




To create a new deployment profile, in the Application menu, select Deploy - New Deployment Profile.

deploy - new deployment profile menu option selected
2.
In the Profile Type list, select ADF Mobile for iOS. Then click OK.

create deployment profile pane with correct values

3.
In the Deployment Profile Properties, select the iOS Options node and set the Simulator Target Version to the version of the simulator you are using. In this tutorial, we are using 5.0.

profile properties with simulator target set to 5.0

Click OK, and then save all your work.

4.
In the Application menu, select Deploy - iOS_Native_Mobile_archive1 deployment profile.

deploy - ios_mobile_native_archive selected in menu

In the subsequent dialog box, select Deploy application to simulator, and then click Finish.

deploy application to simulator selected in deployment action

5.
Watch the Deployment Log window for any errors. If the compilation and deployment process completes as expected, you should see the Deployment Log window as shown below.


deployment log window

6.
In the iOS Simulator, find and double click the MyMobileApp icon to invoke the application.

If prompted, allow MyMobileApp to use your current location

Then on the bottom of the page, click Dept.

log file after installing schema

The Dept item is visible in the application because the task flow was included as a feature in the adfmf-feature.xml file.


7.
In the Department ID field, enter 30, dismiss the keyboard and then click the RunWS button.

log file after installing schema

8.
The results page is displayed, and you should see information for department 30 which is named WebLogic and located in New York.

Click the Request button to return to the request page and try department 20. That department should be named JDeveloper and be found in Redwood Shores.

log file after installing schema

9.
Close the simulator. You are now finished with this tutorial.
false

RE: Oracle ADF Java for Mobile (Andoid & iOS)
Câu trả lời
14:59 19/11/2012 gửi bài phản hồi tới Trí Võ.
Trang demo ứng dụng ADF trên Mobile http://jdevadf.oracle.com/amx/ (webkit-based browser : Safari hoặc Chrome)
false

RE: Oracle ADF Java for Mobile (Andoid & iOS)
Câu trả lời
15:42 19/11/2012 gửi bài phản hồi tới Trí Võ.
http://docs.oracle.com/cd/E35521_01/doc.111230/e24475/introappdev.htm#CCHHGHGH
2 Introduction to ADF Mobile Application Development
This chapter describes the development approach for ADF Mobile applications.
This chapter includes the following sections:
2.1 Introduction to ADF Mobile Application Development
To ensure the best design for your ADF Mobile application, Oracle recommends that you follow an iterative, step-by-step development process.
Although you can develop the application features in addition to the ADF Mobile application itself, this workflow is not necessarily the standard case; application development involves creating the ADF Mobile application and embedding the application features that can be created by other developers. In other words, you create an ADF Mobile application by combining content that you create yourself with the content that was developed separately by someone else and then integrated into the ADF Mobile application. Knowing Xcode or Android application development is not a prerequisite for creating either the ADF Mobile application itself or the specific content for an application feature.
For more information, see Chapter 4, "Getting Started with ADF Mobile Application Development."
2.2 Infrastructure Requirements
Although development needs vary depending on the target platform, the minimum requirements for creating, building, and testing an ADF Mobile application are as follows:
  • Oracle JDeveloper
  • Oracle JDeveloper extension for ADF Mobile
  • Platform-specific tools (such as Xcode, Android SDK, and so on)
  • A mobile device or its simulator
For more information on prerequisites, see Section 3.2, "Prerequisites for Developing ADF Mobile Applications."
2.3 Supported Platforms, Devices, and Databases
ADF Mobile supports the following platforms:
  • iOS 5 or later
  • Android 2.2 or later
The following mobile devices are supported:
  • Apple iPhone
  • Apple iPad
  • Android-powered devices
The supported database is SQLite (see Chapter 11, "Using the Local Database").
2.4 ADF Mobile Application Architecture
The following are potential architectures for your ADF Mobile application:
  • A basic connected application: this type of application includes a user interface that is backed directly by a web service data control that, in turn, invokes a web service hosted on a server. Note that only REST-XML and SOAP-based data services can be accessed exclusively through data controls.
  • A connected application that uses moderate or complex data services: this type of application includes a user interface backed by Java bean data controls. In addition, Java classes (POJOs) are used to perform the following:
    • To retrieve and persist data from more complex data sources.
    • To work with data retrieved from a server before the data is passed to the user interface: if the data source is based on REST-XML or SOAP formats, then the application is backed by Java bean data controls, which, in turn, are backed by POJOs that persist data and retrieve data from a web services data control. A typical implementation case would include a Java class that backs the user interface, and another class that hosts the data retrieval logic.
If the application is to consume JavaScript Object Notation (JSON) data, then neither web service data controls nor SOAP and REST-XML web services are involved. Instead, JSON services must be invoked directly, and then JSON data parsed in the application code.
  • A disconnected application: this type of application requires a local database populated with data. Typically, two modules of code are needed:
    • The first code module allows the user interface to retrieve data from the local database. This module is responsible for creating Java beans and Java bean data controls to serve data to the user interface; CRUD operations on the local database are performed using the JDBC code.
    • The second code module contains implementation of the Java classes that retrieve data from the server and populates the local database through JDBC code. This module can even run a background thread if you choose to implement a background data synchronization. These Java classes are responsible for data retrieval either through data controls (if REST-XML or SOAP data is consumed), or directly from JSON data sources.
For more information, see the following:
2.5 Typical Development Stages
Typically, you perform the following activities when building an ADF Mobile application:
  • Gather requirements
  • Design
  • Develop
  • Deploy
  • Test
  • Debug
  • Secure
  • Enable access to the server-side data (optional)
  • Redeploy
  • Retest and debug
  • Publish
The steps you take to build your ADF Mobile application will generally occur as follows:
  1. During the design stage, consider the tasks a mobile user will be performing, keeping in mind that hand-held usage is different from that of a laptop or desktop computer. How will your ADF Mobile application help users get their jobs done? How will the users interact with the device? The more streamlined the application, the more they will use it.
The next steps are to determine whether the application is required to work in a connected or disconnected mode; understand the device services integration requirements; determine the server-side data source and protocol.
When designing server-side services, it is critical to provide for optimization for the mobile access: if server-side web services are very complex, it would be difficult for the mobile application to consume them. This is not only due to the amount of data that needs to be passed, but also the amount of the client-side logic that must be written to process the results. It is preferable to expose a set of server-side interfaces provided specifically for mobile. You also need to understand the client business services that must be developed, such as all Java modules and data controls that need to be created. In addition, you should create wireframes for the views and task flow in the application, which can help you to visualize the application functionality and assist in the development process.
As a final design step, you should consider how to partition the application functionality into separate application features that represent a group of functionality and associated views. Then you can start designing the client user interface and task flows by creating wireframes.
  1. When setting up your work environment, download and install the ADF Mobile extension, and then install the necessary components and complete the required setup for development and deployment. For more information, see Chapter 3, "Setting Up the ADF Mobile Environment."
  2. When creating your ADF Mobile application using JDeveloper, you use the ADF Mobile application creation wizard. The artifacts that result from creating the application include descriptor files for the ADF Mobile application and for the application features, default images for icons and tabs for all supported platforms, and a set of data controls used for accessing the services of a mobile device (such as camera, GPS, or email).
For more information, see the following:
  • Chapter 4, "Getting Started with ADF Mobile Application Development"
  • Chapter 5, "Defining an ADF Mobile Application"
  • When implementing the application features, you perform a thorough evaluation of the business need to determine which application features should be included within the ADF Mobile application. Using the overview editors provided by ADF Mobile, your tasks for implementing an application feature include identifying its type (HTML, remote URL, or ADF Mobile AMX, or native UI), its display properties (display name, navigation bar and springboard icon), and its display behavior as dictated by both the mobile device capabilities and the user role.
For more information, see the following:
You then proceed to deploying your application to the mobile device or simulator.
Note:
With ADF Mobile applications, it is required that you deploy to the device or simulator before attempting any testing and debugging (see Chapter 18, "Testing and Debugging ADF Mobile Applications"). The application cannot be run until you deploy it.
For more information, see Chapter 16, "Deploying ADF Mobile Applications."
  1. During the testing and debugging stage, you test, debug, and optimize your application. For more information, see Chapter 18, "Testing and Debugging ADF Mobile Applications."
  2. Enabling and configuring security for the application typically requires configuring the login server, such as the Oracle Identity Connect server, or it can be any web page protected by the basic HTTP authentication mechanism. In addition, you may have to configure the access control server.
For more information, see Chapter 17, "ADF Mobile Application Security."
  1. After ensuring that your application functions as expected at a basic level, you can implement the Java code to access the server-side data:
    • For connected applications, these Java classes should invoke web services directly. If your application uses SOAP or REST XML-based data sources, you invoke web services through data controls, with the assistance of a set of helper classes that you can invoke from your code to invoke the data controls and return data. If your application uses JSON-based data sources, your code should directly invoke the JSON service and return data, after which you need to parse the JSON data from the server and populate the objects holding data collections accordingly.
    • For disconnected applications, your code should populate the local SQLite database. Then, the code that backs the user interface can retrieve data from the SQLite database instead of directly invoking web services.
For more information, see the following:
  • Section 2.4, "ADF Mobile Application Architecture"
  • Chapter 10, "Using Web Services"
  • Chapter 11, "Using the Local Database"
  • During the second round of deployment, you ensure that after adding security to your application and enabling access to the server-side data the application deployment runs as expected and the application is ready for the final testing and debugging.
  • During the final round of testing and debugging, you focus on the security and the server-side data access functionality ensuring that their integration into the application did not result in errors and unexpected behavior.
  • Deploying the application to the production environment typically involves publishing to an enterprise server, the Apple App Store, or an application marketplace, such as Google Play. After you publish the ADF Mobile application, end users can download it to their mobile devices and access it by clicking the designated icon (see Appendix C, "ADF Mobile Application Usage"). The application features bear the designated display icons and display as appropriate to the end user and the user's device.
2.6 The Application Lifecycle
The lifecycle of an ADF Mobile application is driven by events that occur at the levels of the mobile device operating system, the JVM, and ADF Mobile. The application's reaction to these events is enabled through the use of the LifeCycleListener's methods. For more information, see Section 5.6, "About Lifecycle Event Listeners."
2.7 Sample Applications
After setting up your development environment (see Chapter 3, "Setting Up the ADF Mobile Environment"), you can examine ADF Mobile sample applications located in the PublicSamples.zip file within the jdev_install/jdeveloper/jdev/extensions/oracle.adf.mobile/Samples directory on your development computer.
The sample applications demonstrate the following:
  • How to create a basic HelloWorld ADF Mobile application.
  • How to enable the application to react to life cycle events.
  • How to use skinning.
  • How to develop the ADF Mobile AMX application feature, including the user interface, navigation from page to page, managed beans, data change events, and so on.
For more information, see Appendix E, "ADF Mobile Sample Applications."
2.8 ADF Mobile AMX Application Feature
ADF Mobile AMX is basically a subframework within ADF Mobile and provides a set of layout, field, and data components that enable you to create an application feature that behaves appropriately for both the iOS and Android user experience. ADF Mobile AMX supports some of Oracle ADF components, data controls, bindings, and the Expression Language that belong to the following layers:
Differences in every layer exist due to the inherent differences between a mobile application and a web application. For more information, see Section 2.9, "Comparison of ADF Mobile and Server-Based Oracle ADF."
2.9 Comparison of ADF Mobile and Server-Based Oracle ADF
Table 2-1 summarizes the functionality, components, and technologies supported by ADF Mobile and compares them to those supported by a server-based Oracle ADF application.
Table 2-1 Differences Between ADF Mobile and Server-Based Oracle ADF Application
LayerSupported by ADF MobileSupported by Server-Based Oracle ADF
ADF Model
  • SOAP, REST XML, and REST JSON-based data sources and data controls
  • Subset of the model layer Java (for example, there is no support for Java web service proxy)
  • JDBC
Full range of data sources and data controls
View
  • Locally rendered ADF Mobile AMX or custom HTML5 pages.
  • HTML pages rendered on the server.
  • Server-rendered only
  • ADF Faces rich client and Trinidad JSF components
Controller
For ADF Mobile AMX application feature (see Section 2.8, "ADF Mobile AMX Application Feature"):
  • Subset of Oracle ADF task flow components
  • Logic resides on the mobile device
Full ADF task flow
Java Support
JavaME CDC and Java 1.4
Java EE with the latest Java
 
As described in Table 2-1, in the view layer, ADF Mobile provides you with an option of using locally rendered or server-rendered views to present the user interface. ADF Mobile AMX enables the most seamless user experience. For the server-based Oracle ADF, the user interface is rendered on the server and is primarily provided through ADF Faces rich client components or Trinidad components, both of which are based on the JSF technology.
In the controller layer, an abbreviated version of the ADF task flow that supports a subset of components is provided when ADF Mobile AMX contents are used in a mobile application. ADF Mobile task flow supports views, control flow case, wild card control flow case, method calls, and routers, but does not support regions. In ADF Mobile, the page flow logic resides entirely on a mobile device, enabling the page navigation without a round trip to the server.
In the ADF Model layer, ADF Mobile supports SOAP, REST XML, and REST JSON as the server-side data sources. In addition, ADF Mobile supports JDBC connection and APIs to the local database, but it does not support ADF business components. Furthermore, ADF Mobile does not implement all of the Java methods supported by the server-based ADF. For example, you cannot use the programmatic access binding context. Instead, you can access the binding data by invoking the Expression Language (EL) expressions. In addition, since ADF Mobile does not support the Java proxy for web services, to access web services programmatically, you must use data controls in conjunction with the web services invocation helper classes.
For Java support, ADF Mobile's embedded Java virtual machine follows the JavaME CDC specification, which is based on Java 1.4, meaning that you cannot use any Java 1.5 or later features in your Java code.
 
false

Hỏi đáp PL

Hỏi đáp PL

Câu hỏi Trả lời Người hỏi
Tôi là ai? Mày chẳng là ai cả? dsn
1 2 3
$fields.get("cau_hoi").getValue() $fields.get("tra_loi").getValue() $fields.get("nguoi_hoi").getValue()
$fields.get("cau_hoi").getValue() $fields.get("tra_loi").getValue() $fields.get("nguoi_hoi").getValue()

Các hoạt động

tháng chín 11
Trí Võ viết một đoạn tin trên bảng trạng thái, {3}.
tháng mười một 5
Chúc Hà đã trả lời cho RE: Xây dựng site http://thuphongtrien.com trên nền Liferay 6.1.2 đoạn tin trên bảng trạng thái, {3}.
tháng năm 28
Trí Võ đăng tải một tài liệu mới, ptech.png.
Trí Võ đăng tải một tài liệu mới, Pikon.png.
tháng ba 17
Trí Võ viết một đoạn tin trên bảng trạng thái, {3}.
Đăng ký theo dõi tới các hoạt động của vZik. Mở trên cửa sổ mới