Skip to main content

WeatherApp with MAF using MCS

Pre-requisites/Assumptions :
  1. MAF version : 2.1.3
  2. mafmcsutility.jar exists in the classpath of the application.
  3. Two REST API build and exposed from Oracle Mobile Cloud Service(MCS).
    • This application is available on GitHub and can be downloaded and run from your own machine.
    • This application uses 2 APIs created and exposed in MCS
      • /mobile/custom/WeatherAPI/getweather?country=<CCC>&city=<AAA>
      • /mobile/custom/WeatherAPI/getCities?country=<CCC>
  4. Part 1 : talks about creating the Mobile Backend on MCS :
GitHub application can be found on :

 Following sections, I will talk a bit about

  • maf-application.xml
  • Datacontrol 
  • Taskflow
  • Javascript to enable device back button
You can download the Github project and check the whole source code in JDeveloper 12.1.3


I have defined the MCS connection details in this xml.

Datacontrol :

getMobileBackend() : Reads the preferences declared in maf-application.xml and prepares an MBE object to communicate with MCS.
MBE object comes from mafmcsutility.jar. It is a single point entry for all MCS communication.

anonymousLogin() :  Logs the mobile app user to the MCS backend, so that the app can call the API defined/exposed via MCS.
Uses MBE object and the MBE Anonymous Key defined in the maf-application.xml.

invokeGetCitiesAPI() : This is the first method invoked from the app, so this one does the "anonymousLogin" first. Then it invokes "getCities" MCS API in a thread.
The JSON response of the API contains XML data as well, so it also uses a SAX Parser to parse the XML content and populate the "citiesForCountry" List.

invokeGetWeatherAPI() : This invokes "getWeather" MCS API in a thread. The JSON response from API contains the information in XML, so it uses a SAX Parser to parse and populate the "currentWeather" object.

TaskFlow : cities-task-flow


First taskFlow of the app. SearchCities is an AMX page to search for cities for a country.
The filter button on the below image calls "invokeGetCitiesAPI()".

ShowWeather : is a taskFlow call. It looks like :

invokeGetWeatherAPI : Is a method call activity and it calls  "invokeGetWeatherAPI()".
showCurrentWeather : Is an AMX page to display the current weather details.

Javascript to enable device back button :

I have also added a custom JS to make use to Android device's back button. It has been added as a file to the taskflow defined in maf-feature.xml

That's it. Please feel free to comment if you have any questions.

A small video on how the app works runtime :


  1. This comment has been removed by the author.

  2. Hi,
    I wanted to consume a dummy rest service created in MCS admin console in MAF app . For that i am trying to create rest client and proxy from new wizard in JDEV.
    I gave the WADL url but it is giving error that 'The specified WADL URL doesn't return a WADL for either a GET or an OPTIONS.'

    Thanks in advance.

    1. I am not sure what you mean by "new wizard in JDev". The only way I know to consume MCS published rest api is to use "mafmcsutility.jar". You need 4 details, e.g. backend id, anonymous key etc and you can connect to the rest api you want on MCS.

  3. Hello,
    I tried to build the app available in GitHub but had errors because all the imports of the mafmcsutility library were on error. I checked that the mafmcsutility.jar exists in the projet properties classpath.
    Is there anything that I should do before building the app that might help jdeveloper recognize the library ?

    Thanks in advance.

    1. Hi Yosra,

      Not sure why, but the imports and usages of classes from mafmcsutility shows error in Jdev, I have updated the sources and references to the latest MAF version. Please do a fresh check out from Github. And change the path of mafmcsutility in jws/jpr.

      - Soham

    2. Hi,
      Thanks for your answer. I updated the path to all the libraries used in the project according to where they are on my jdev home.
      The weather app works fine. This will help me work on my own application.
      Thanks for your help again.


  4. This comment has been removed by the author.


Post a Comment

Popular posts from this blog

ADF Utility : Find UIComponent from Managed Bean

Many a times, it is required to find an UIComponent from ADF managed bean, to do something with it, for example : change the value of an af:outputText, change readOnly property of an af:inputText etc.     private UIComponent getUIComponent(String id) {                  FacesContext facesCtx = FacesContext.getCurrentInstance();          return findComponent(facesCtx.getViewRoot(), id);     }          private UIComponent findComponent(UIComponent base, String id) {                 if (id.equals(base.getId())) {             return base;         }         UIComponent children = null;         UIComponent result = null;         Iterator childrens = base.getFacetsAndChildren();         while (childrens.hasNext() && (result == null)) {             children = (UIComponent);             if (id.equals(children.getId())) {                 result = children;                 break;             }             result = findComponent(children, id);             if (result != nu

Font Awesome with ADF

For people who are not aware of Font Awesome , it  gives you scalable vector icons that can instantly be customized — size, color, drop shadow, and anything that can be done with the power of CSS. Their whole icon library is based on CSS not Images. Recently, we had to build a tree table based on Webcenter content's folder and file structure. And we needed to show proper icons for files (pdf, word etc.) and folders. Which should look like this   We choose Font Awesome, because it is scalable and easy to use. But front-end was ADF, so we were a bit sceptical  about how to integrate both. Turned out it was quite easy. Special thanks for Casper Overweter to do the implementation. 1. Create an ADF Skin : Create a custom skin, via New > Gallery. Base it on alta-v1 skin. 2. Download Font Awesome : Download the zip form their website . It's free. Unzip it inside the "customSkin" folder. Next to your CSS. 3. Extend Font Awesome to your c

Exception Handling in ADF

This blog will give you an overview on how you can successfully deal with unhandled Runtime exceptions in an ADF application. This will give you an idea of: How to catch the unhandled exceptions. Write a separate log file with stacktrace and thread dumps. Redirect the user to an static error page #1. Catch unhandled exceptions :  Create a class "MyExceptionHandler" which extends : Override handleException() method.     public void handleException(FacesContext facesContext, Throwable throwable, PhaseId phaseId) throws Throwable {         // this method is going to create a separate file with stacktrace and thread dumps         writeException(throwable);         // redirect to error page         redirectToErrorPage(facesContext);     }  Create a folder "services" inside : ViewController\src\META-INF and then create a file named "". In the file, add