Posts Tagged ‘Alta UI’

 

clip_image002Alta UI in ADF 12c provides great options for dashboard implementation. You can use so called ‘info tiles’ as blocks displaying summary information. These blocks are clickable and based on active tile, content can be rendered. It looks not only modern, but also user friendly.
I have implemented sample application – ADFAltaApp_v11.zip with Alta UI dashboard, based on code examples from Oracle WorkBetter application. You could download and run my sample, it renders two vertically aligned info tiles with summarised information:

Click on second info tile, main content will be changed:

Info tile block is implemented as ADF declarative component with a set of properties to make it generic and reusable: Read the complete article here.

WebLogic Partner Community

For regular information become a member in the WebLogic Partner Community please visit: http://www.oracle.com/partners/goto/wls-emea ( OPN account required). If you need support with your account please contact the Oracle Partner Business Center.

Blog Twitter LinkedIn Forum Wiki

clip_image002

ADF 12c and Alta UI change the way how we used to implement UI in ADF. Let’s take a look into Master-Detail. Before Alta UI usual implementation for Master-Detail would be based on vertical layout with master on the top and details below. Alta UI provides different patterns like left-right, bottom-top for Master-Detail implementation – Oracle Alta UI Patterns. I would recommend to watch a demo from Shay Shmeltzer, he explains how to build left-right Master-Detail – Developing Your First Oracle Alta UI page with Oracle ADF Faces. In my post I’m taking a step further and explaining how to manage Master-Detail relationship between different regions.
Here you can watch a demo of sample application developed for today post: Watch the video here.

WebLogic Partner Community

For regular information become a member in the WebLogic Partner Community please visit: http://www.oracle.com/partners/goto/wls-emea ( OPN account required). If you need support with your account please contact the Oracle Partner Business Center.

Blog Twitter LinkedIn Forum Wiki

clip_image002

Alta UI in ADF 12c with combination of Tablet First template provides support for responsive UI. Often you would like to implement extra functionality for responsive layout, not available out of the box. I’m going to describe in this post, with very practical example, how this can be achieved. I will implement desktop and tablet view support with adjusted menu structure and header.
Tablet First template is shipped with ADF 12c and provides different facets (UI blocks) where developer could implement menu, content, header and footer. We could use CSS media query to dynamically react to the screen changes and adjust facets accordingly. In order to use CSS media query in the template, we need to have access to the Tablet First template code. This is easily achievable by creating custom UI template, based on out of the box Tablet First template. In the template creation wizard select Copy Existing Template option, this will copy template source code and you could adjust it:

This allows to save time and implement CSS media query in the template. If screen size is less than 950px, we are going to render narrow layout and vice versa: Read the complete article here.

WebLogic Partner Community

For regular information become a member in the WebLogic Partner Community please visit: http://www.oracle.com/partners/goto/wls-emea ( OPN account required). If you need support with your account please contact the Oracle Partner Business Center.

Blog Twitter LinkedIn Forum Wiki

 

clip_image002This post is next in series of "Working with ADF Faces Components programmatically"
So this post is about creating client Attribute, applying it to component and setting it’s value programmatically
this requirement comes in picture when user is dealing with dynamic layout means components are created programmatically at run time and it is not possible to apply clientAttribute and other properties declarative
In this i am extending my previous post –
Apply Client/Server listener to programmatically created components, apply JavaScript to ADF Faces components at run time
In previous post i have described about applying client listener and server listener programmatically
here we will see how to pass a variable value to java script function using client attribute
You can read more about af:clientAttribute here
From oracle docs-
The clientAttribute tag specifies the name/value for an attribute which will both be made available both on the server-side (Faces) component as well on on the client-side equivalent. This tag will be ignored for any server-rendered components, as it is only supported for the rich client. ClientAttributes are not synchronized to the server since unknown attributes from the client are not synchronized to the server.
Lets’ see how we can do this ,It’s simple just check this code Read the complete article here.

WebLogic Partner Community

For regular information become a member in the WebLogic Partner Community please visit: http://www.oracle.com/partners/goto/wls-emea ( OPN account required). If you need support with your account please contact the Oracle Partner Business Center.

Blog Twitter LinkedIn Forum Wiki

 

clip_image002It 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: Read the complete article here.

WebLogic Partner Community

For regular information become a member in the WebLogic Partner Community please visit: http://www.oracle.com/partners/goto/wls-emea ( OPN account required). If you need support with your account please contact the Oracle Partner Business Center.

Blog Twitter LinkedIn Forum Wiki

clip_image002

 

Since a few years, Mobile is an up-and-coming trend in digital evolution and a key factor for digital transformation. Together with Social, Cloud and Information, Gartner named Mobile as one of the 4 driving forces for new business scenarios and even goes as far as to call this “nexus of forces” out as the new basis of the technology platform of the future.[1]

Yet, not many businesses seem to deal with these technology trends properly and it is hard to blame them, considering the lack of proven concepts especially for internal applications such as Siebel CRM. However, this does not mean, that there is no way for you to use these trends and take an early step into the future. And this future is built on a better mobile user experience not only for your customers but for some of your employees as well. Read the complete article here. For more information on Alta UI please visit our Community Alta tag here. (WebLogic Community membership required)

WebLogic Partner Community

For regular information become a member in the WebLogic Partner Community please visit: http://www.oracle.com/partners/goto/wls-emea ( OPN account required). If you need support with your account please contact the Oracle Partner Business Center.

Blog Twitter LinkedIn Forum Wiki

 

clip_image002I was inspired by recently published WorkBetter application with ADF 12c Alta UI demo (you can read more about Alta UI and download WorkBetter application from here – Oracle Alta UI). I have decided to create my own application, using the same guidelines as described by Alta UI. While WorkBetter application is based on EJB, my application is using regular ADF BC model. Right now it displays a list of employees from HR schema and allows to edit selected employee data. In the future, I plan to add CRUD support and more advanced UI features. I would recommend to watch a video from Shay Shmeltzer, he describes how to build your first Alta UI application in ADF.
Here you can download my sample application, implemented with Alta UI – ADFAltaUI.zip. This application implements ADF task flow with employees data. By default, employees data is displayed as a list (you should see how it differs comparing to pre-Alta ADF UI, now UI is much cleaner and only essential data is displayed):
According to Alta UI guidelines, user should be given an option to switch to a grid view. This is useful and gives different perspective for the data view: Read the complete article here.

WebLogic Partner Community

For regular information become a member in the WebLogic Partner Community please visit: http://www.oracle.com/partners/goto/wls-emea ( OPN account required). If you need support with your account please contact the Oracle Partner Business Center.

Blog Twitter LinkedIn Forum Wiki