How to format the DATE and display in the AMX page uisng ADF Mobile.

The Date to be displayed in the format MM-DD-YYYY in the AMX page. To achieve this we need to use the <amx:convertDateTime> with in the OutputText as shown below –

<amx:panelLabelAndMessage label=”#{viewcontrollerBundle.LAST_UPDATE_DATE}” id=”plam5″    inlineStyle=”font-weight:bold;”>

<amx:outputText value=”#{bindings.lastUpdateDate.inputValue}” id=”ot6″>

<amx:convertDateTime pattern=MM-dd-yyyy“/>

</amx:outputText>

</amx:panelLabelAndMessage>

The output is displayed as below –

Date1

 

 

Advertisements
Posted in ADF Mobile | Tagged , , , | Leave a comment

How to implement the selectOneButton (or) Tabs in the UI using ADF Mobile.

To implement the Tab functionality we need to use the “selectOneButton” component as below

<amx:selectOneButton value=”#{preferenceScope.application.Customers.perfCustomerDefaultPanel}”

simple=”true” inlineStyle=”width:100%;” >

<amx:selectItem label=”#{viewcontrollerBundle.BY_Value1}” value=”P” />

<amx:selectItem label=”#{viewcontrollerBundle.BY_Value2}” value=”N“/>

</amx:selectOneButton>

With the above component the tab will appear in the UI as

select_button1

Based on the selection the content in the UI will be changed. This is configured using the Preferences tab in the adfmf-application.xml file.

select_button2

The Preference is referred in the “selectOneButton” component and each selection value is defined in the “selectItem” within the “selectOneButton” component as

<amx:selectItem label=”#{viewcontrollerBundle.BY_Value1}” value=”P” />

So we have defined the default tab as “P” in the Preferences tab in the adfmf-application.xml file. So when we accessed the UI the “Value 1” tab is selected and the corresponding contents are displayed. If we do not set the default tab option in the Preferences, when we access the UI no contents will be displayed. Only when we select any Tab the corresponding contents are displayed.

To display the contents we need to provide the Rendered condition for the component as below –

<amx:panelFormLayout id=”pfl1″  rendered=”#{preferenceScope.application.Customers.perfCustomerDefaultPanel eq ‘P‘}”></amx:panelFormLayout>

 

 

Posted in ADF Mobile | Tagged , , , , | 1 Comment

How to Set Up and Configure an Android and iOS Environment using Android SDK for mobile development.

Setup and Configure an Android Environment

http://docs.oracle.com/cd/E18941_01/tutorials/setupmobileapps/jdtut_11r2_54_2.html

Setup and Configure an iOS Environment

http://docs.oracle.com/cd/E18941_01/tutorials/setupmobileapps/jdtut_11r2_54_1.html

 

Posted in ADF Mobile | Tagged , , , , | Leave a comment

How to implement Custom Navigation bar when Unable to display the Images for the Features in the Navigation bar.

When I configure the image for the Feature in the adfmf-feature.xml file as below, the image will be displayed as very smaller than its original size when executed in the Emulator or in the mobile device.

CustomNavigationBar1So I did not use the default settings in the adfmf-feature.xml file. As I want to display the image with its actual size, I have to use the gotoFeature() method and use the images in the Footer facet in all the AMX pages.

<amx:facet name=”footer“>

<amx:commandLink inlineStyle=”float:left; margin:0px; padding:0px;” text=”” id=”glCustomer”

actionListener=”#{pageFlowScope.SearchHomeBean.goToCustomerFeature}”>

<amx:image id=”navCustomer” source=”/images/nbtn_a_customers.gif

inlineStyle=”float:left; height:50px; width:80px; margin:0px 0px 20px 0px;”/>

</amx:commandLink>

<amx:commandLink inlineStyle=”float:left; margin:0px; padding:0px;” text=”” id=”clServices”

actionListener=”#{pageFlowScope.SearchHomeBean.goToServiceFeature}”>

<amx:image id=”navServices” source=”/images/nbtn_a_services.gif

inlineStyle=”float:left; height:50px; width:80px; margin:0px 0px 20px 0px;”/>

</amx:commandLink>

<amx:commandLink inlineStyle=”float:left; margin:0px; padding:0px;” text=”” id=”clNews”

actionListener=”#{pageFlowScope.SearchHomeBean.goToNewsFeature}”>

<amx:image id=”navNews” source=”/images/nbtn_a_news.gif

inlineStyle=”float:left; height:50px; width:80px; margin:0px 0px 20px 0px;”/>

</amx:commandLink>

<amx:commandLink inlineStyle=”float:left; margin:0px; padding:0px;” text=”” id=”clSetting”

actionListener=”#{pageFlowScope.SearchHomeBean.goToSettingsFeature}”>

<amx:image id=”navSetting” source=”/images/nbtn_a_setting.gif

inlineStyle=”float:left; height:50px; width:80px; margin:0px 0px 20px 0px;”/>

</amx:commandLink>

</amx:facet>

Method Reference:

public void goToCustomerFeature(ActionEvent actionEvent){

try {

AdfmfContainerUtilities.gotoFeature(“mobile.searchassist.Customers“);

}catch(AdfException e) {

// handle the exception

e.printStackTrace();

}

}

Here ‘mobile.searchassist.Customers’ is the Feature ID from the adfmf-feature.xml file.

Now you will view the full image for each feature in the mobile application when executed in the Emulator or in the mobile device.

 

Posted in ADF Mobile | Tagged , , , , , | Leave a comment

How to apply the Images in the AMX page buttons.

When the Images are added as part of the CSS file and referred the style CLASSES for the Image tags (<amx:image>) or Command Buttons it did not worked as expected, that means the images referred in the CSS is not applied to Image tags (<amx:image>) or Command Buttons. So we need to add the Images as inline style to the components where it did not worked as shown below –

Sample 1:

<amx:commandLink text=”” id=”cl2″   actionListener=”#pageFlowScope.SearchServiceBean.ClearSearchSelections}”>

<amx:image id=”i3″ source=”/images/reset.png” inlineStyle=”height:30px; width:96px; margin-left:0%;”/>

</amx:commandLink>

Sample 2:

<amx:image id=”navCustomer” source=”/images/nbtn_a_customers.gif

inlineStyle=”float:left; height:50px; width:80px; margin:0px 0px 20px 0px;”/>

The “reset.png” and “nbtn_a_customers.gif” images need to be available in the ‘images‘ folder in your ADF Mobile application.

Now the images will be displayed for Image tags (<amx:image>) or Command Buttons.

Posted in ADF Mobile | Tagged , , , | Leave a comment

How to Setup of AndroVM Emulator to speed-up the mobile development process.

I used Jdeveloper 11.1.2.4 to develop the application and ‘androVM_vbox86p_4.1.1_r6.1-20130222-gapps-houndini-flash’ (VM Image) to test the application. To use this VM Image, you need to install the Virtual Machine (I used version 4.2.16 r86992).

Installation

The AndroVM can be downloaded as an “OVA” file. Once dowloaded, you just have to import it in VirtualBox.

Please note AndroVM comes in 3 different versions :

  • vbox86p : Built for a “phone”, 480×800 default resolution
  • vbox86t : Built for a “tablet”, 1024×600 default resolution
  • vbox86tp : Built for a “tablet” with phone capabilities, 1024×600 default resolution
  • I will assume that you already have VirtualBox installed and working.

Network Adapter

  • To run with hardware acceleration, as for using the ADB with AndroVM, you’ll need an “Host Only” network adapter. To create one, open VirtualBox, get to the “File” menu, “Preferences…”, “Network”.

AndroVMSetup1

  • Don’t forget to enable DHCP Server for this network adapter.

AndroVMSetup2

Importing VM

Now, you can import the VM into VirtualBox. Just double-click on the OVA file, or use “File” menu, “Import Appliance”.
It can be a good idea to rename the VM into something more friendly.

AndroVMSetup3Setting-up VM

AndroVMSetup4By default, AndroVM has its first network adapter set to disable. Go to the VM network settings and set it to “Host Only Adapter”.

AndroVMSetup5

Then, start the VM. Now, you’ve got a fully functional software-rendered AndroVM. Now, open the AndroVM Config app, and check the box to enable hardware OpenGL.

AndroVMSetup6

To deploy the applications into AndroVM image from Jdeveloper, you need to configure the VM Image as provided the detailed steps below

AndroVMSetup7

Note: You can very well use the Android SDK too (http://developer.android.com/sdk/index.html), only issue I found with SDK is, it is very slow to deploy and to test the application. So I preferred the androVM.

Posted in ADF Mobile | Tagged , , , , | Leave a comment

How to redirect Webcenter Content Server or UCM to Remote Database

Inorder to redirect the Webcenter Content Server or UCM to Remote Database, both Remote Database & RCU should be compatible versions and remote DB machine should be reachable from Content Server (CS) machine.

Pointing can be changed from Weblogic Server (WLS) console:

1) Please take backup of config.xml & cs-ds-jdbc.xml

  •  Oracle\Middleware\user_projects\domains\base_domain\config
  •  Oracle\Middleware\user_projects\domains\base_domain\config\jdbc

2) Login to WLS console as admin user (weblogic) and browse through (  Home >Summary of JDBC Data Sources >CSDS >Summary of JDBC Data Sources >CSDS )

3) Click on Connection Pool tab

4) Change hostname, service id, port, user & passwords.

5) Just restart the managed servers first & monitor logs for errors if any.

6) Shutdown managed & admin server & start.

Now the WebCenter Content server or UCM will use the schema available in the remote database.

 

 

Posted in Oracle WebCenter Content, UCM | Tagged , , , , | 1 Comment