It doesn't seem to be announced, but newly released ADF 11.1.1.9 is shipped with Alta UI support. All you need to do, is to set alta skin name in trinidad config file. This enables applications running on ADF 11g platform to leverage new Oracle UI layout and to be prepared for ADF 12c upgrade. Besides Alta UI, there are several new UI components, one of them is Scrollable Bar (ConveyorBelt) - Displaying Components in a Scrollable Bar. This is simple, but quite useful component - I'm going to demonstrate how it works.
Conveyor Belt is able to render elements horizontally or vertically. This is perfect component to render key information, user could select one of the items available on the belt and get more info fetched. This is how it looks like - conveyor of employee pictures with first/last names, rendered in the vertical belt on the left:
If there are more items in the conveyor belt, than could fit into visible UI part - user could scroll (right/left and down/up). Here I scroll down and select another employee, his detail data is displayed in the main section:
As you could notice, UI is displayed using Alta skin. This is configured in trinidad file:
Here is the structure for implemented conveyor belt, items in the conveyor are stamped dynamically through ADF UI iterator component. Java Script client/server listeners are responsible to process item selection and keep detail info in synch for the selected employee:
This is the source code structure for conveyor belt UI implementation, based on the structure from above:
Conveyor item selection is processed in the server listener method, VO current row is set based on the selected key:
If you want to try it yourself, download sample application - ConveyorBeltApp.zip.
Conveyor Belt is able to render elements horizontally or vertically. This is perfect component to render key information, user could select one of the items available on the belt and get more info fetched. This is how it looks like - conveyor of employee pictures with first/last names, rendered in the vertical belt on the left:
If there are more items in the conveyor belt, than could fit into visible UI part - user could scroll (right/left and down/up). Here I scroll down and select another employee, his detail data is displayed in the main section:
As you could notice, UI is displayed using Alta skin. This is configured in trinidad file:
Here is the structure for implemented conveyor belt, items in the conveyor are stamped dynamically through ADF UI iterator component. Java Script client/server listeners are responsible to process item selection and keep detail info in synch for the selected employee:
This is the source code structure for conveyor belt UI implementation, based on the structure from above:
Conveyor item selection is processed in the server listener method, VO current row is set based on the selected key:
If you want to try it yourself, download sample application - ConveyorBeltApp.zip.
Hi Andrejus,
ReplyDeleteDoes that mean that in 11.1.1.9 version can develop Alta UI applications in the same way as in the 12c?
And if not, what is differences?
Yes, it seems it can.
ReplyDeleteRegards,
Andrejus
Hi,
ReplyDeleteIs there 11.1.1.9 essentials version of ADF?
You should check on Oracle site.
ReplyDeleteAndrejus
Hi Andrejus,
ReplyDeleteThanks for the post. Can you confirm if 11.1.1.9 version can develop Alta UI applications. I just came across a project that its been developed still in 11. So this would be great news for my team. They were all excited when they saw Alta UI and thought for a second that this would make our cliente happier. But I've been reading and nobody actually confirms this. Can you confirm that you can actually get the same applications as the ones seen in the 12c versions? I mean in terms of appearance and UI design. Thanks in advance
Doug
Hi,
ReplyDeleteYes, in 11.1.1.9 we can use Alta UI skinning.
Regards,
Andrejus