Browse Category by ADF 12c

ADF: Display Map values in af:table

When we want to populate an af:table programatically we usually use a collection based on a java bean (e.g. List<MyObject>) but in this post of JDeveloper & ADF the developer required to populate the table with Map values.
First we need to create a Map in our bean and add the values that we are going to show in the table.

If we try to populate the table we can see tat we need to know the keys of the Map to get the values.

As you can see Value Columns displays the value in the Map for ‘Key 1’ key, but using this method we can not dynamically display all values.

To solve this issue we need to create an array in our bean where we will have all keys of the Map.

Now that we have created in our bean all that we need, we can start building the table structure.

On the table of the second image we need to make some changes. First, instead of using Map property, we have to use the key array we have just created as value property of the table.

And, as we have to access Map values, we have to add an af:iterator inside the table and add the columns we need inside this iterator. The value property of this iterator is the Map property in the bean.

This way, to retrieve keys we are going to use #{row} and to retrieve values asociated to a key we are going to use #{var[row]}.

Oce we have finished with the changes, if we run the application we can see that all the values of the Map are displayed in the table without the need of knowing the keys of the Map.

ADF: Switching between skins on runtime based on the url

Andrejus posted a couple of months ago how to switch between alta and skyros in ADF 12c. This is a cool way to start the migration from 11g to 12c and Alta UI. I am going to show you another way to use one skin or other based on the page you are.

Firstly we have to create a bean and a property inside it where we are going to store the current skin. We have to set this bean as sessionBean.

After that we have to set a bean property in skin-family in our trinidad-config so we can set the skin dynamicaly.

The next step is to create a filter. In doFilter we are going to evaluate the URL and set the skin based on that value. We also have to instantiate the bean and add it to sessionScope becasuse the first time it will be null.

Once we have the filter created we have to add it to web.xml

Now that we have all setup, having multiple pages, if we test it we can see that the the page “alta” will display AltaUI skin and “skyros” page wil dispklay Skyros skin,

ADF 12.2.1: Using the Theme Editor

A couple of weeks ago Oracle released ADF 12.2.1 with many cool features and one of them is the Theme Editor. With this new tool you can change the look and feel of you application by selecting the desired style of the components and see the changes automatically right in the browser. This tool can help developers who are not experts in CSS to build applications with a great look and feel.

We have to make a couple of things in order to use the theme editor.
First we have to create a new application based on an existing EAR file.

The EAR file we are going to use is located inside our 12.2.1 Middleware Home, in my installation this path is:

After that we just have to click on Finish to create the skin editor application.
To start the Theme Editor we have to run that application by runing index.html file.

Once the application is runing we will see this:

We are going to create a new skin so we have to click on ‘Create Theme’ button. A popup will appear where we have to put the name of the theme and also select the skin we want to use. We can choose Skyros or Alta as our base skin.

Click on ‘Save and Close’ and we will have our theme created. By clicking on the right button we can for example edit, delete, duplicate or export our theme. We will come back later to export the theme but at the moment we are going to edit it.
Once you click on edit, we can see some tabs in the top of the page where wecan change property values of some components, and in the bottom of the page we have a real time preview of our skin.
A quick example of what can we do is change our buttons style.

When we have finished our skin work we have to click ok ‘Save and Close’ in the top right of the page.
Now we can use this skin in our application by exporting the theme.
After exporting the skin we can use it by importing the jar file we have just generated in our application.
We also have to select this skin as default skin by selecting it as ‘Default Skin Family’ in ‘ADF View’ menu in project proeprties.

Now if we run the application we can see that the skin that we applied in the theme editor applies to our application.
If we don’t get the look and feel that we expected using the Theme Editor we can also extend the skin we have just created and add our custom CSS rules to skin our application.
You can get more information about the Theme Editor and about using skins in an ADF Library JAR file in these links:

It has been a long wait, but ADF 12.2.1 has been released

One year and a half after the last Oracle ADF 12c version (12.1.3), last Friday Oracle released Oracle ADF 12.2.1. This release is part of a major Oracle Fusion Middleware release, including WebLogic Server 12c, SOA 12c and WebCenter 12c.
If you want to use MAF you will still have to use JDeveloper 12.1.3.

As we were so much time without a new release, Oracle ADF 12.2.1 brings us lots of new features and also a lot of bugs fixed. These are some of them:

  • Java SE 8

JDeveloper 12.2.1 runs on JDK8 and provides development support for JDK8.

  • JCS and DCS integration

We are now able to integrate JDeveloper with Java Cloud Service and Developer Cloud Service.

  • Alta Skin

Alta UI is not a new feature, but this is the new default skin in every ADF application instead of Skyros. There is also a new Oracle Alta UI website where you can find some advices and a demo.

  • Theme Editor

We also have a new feature that will help developers who don’t have a lot of knowledge in CSS to build and edit a skin.

  • Masonry Layout

Masonry Layout help us to build responsive pages that will automatically adjust its children to fit the available space. There is also a new three columns responsive template.

  • DVT components iimprovements

Some components that were already available have been improved such as Funnels and Pie Charts. Polar coordinate system is also now supported by some types such as bar, line, bubble, etc.

We have also a new component ‘NBox’ that is usually used to compare data across two dimensions, for example to compare employees performance.


If you want to know more about the new version, the full list of improvements or know all the bugs that has been fixed click on this link.