Monday, December 4, 2017

PeopleSoft - Fluid Group Box

As my earlier post says the Group boxes plays major role in the Fluid UI. If the Group boxers are not placed properly it tends to go out of alignment and turn into the random jumbles. Mostly this alignment issue happens when we have more fields on the page placed closely together.

Group boxes can be placed one after the other (stacked), nested, or placed side by side.
Design side-by-side group boxes so that once users access the page on the small-form
factor, the group box on the right moves below the one on the left.

  • Any fluid page must have at least one over-arching group box to contain all other elements of the page.
  • Depending on the number of controls and complexity of the page, additional group boxes can be added.
  • The group box can be used to indicate visual cues but it can also act as a logical grouping of related controls. 
  • Using the fluid properties for a group box, you can override or customize the style at each group box layer.


As per the above picture, to have the employee image on the screen the peoplesoft delivered page has these many group boxes. This says that the group box plays major role in the Fluid UI.

Thanks,
VPNPS Team