Saturday, September 17, 2016

Dynamic Flying Dashboard UI in ADF

I took my old sample application implemented in 2010 - Dynamic Flying Dashboard UI Shell and upgraded it to recent ADF It runs pretty well, without major changes - this proves ADF migration between releases can be smooth (well, not always in practice - but let's be positive).

I have recorded gif to give you an impression how it runs and how UI switch works in ADF UI panel dashboard component:

There are four blocks in the dashboard, user can remove each of the blocks or select predefined group of blocks:

It is possible to maximize selected block to occupy more space:

Some of the blocks can be minimized and only a subset of blocks will be displayed:

Such functionality is implemented with out of the box ADF UI components - af:panelStretchLayout, af:panelSplitter and af:panelDashboard. Depending on selection, block is minimized, displayed or maximized:

Toolbar items (minimize, maximize and restore) are implemented in the separate JSF container and reused in the main page:

Hopefully you will find such use case interesting and will have a chance to apply in the project. Download sample application -

No comments: