Page Comparison

According to SAP UI5 Experience site, SAPUI5 provides a “content density” factor, which allows the size of the controls to be adjusted depending on the interaction style.

1. The cozy factor displays controls with dimensions large enough to enable fingertip interaction. This factor is ideal for devices operated by touch.

Image Modified

1. The compact factor reduces the dimensions of the controls, allowing more information to be displayed on the UI. This factor is ideal for devices operated by mouse and keyboard.

Image Modified

This can be implemented in IQX FAB as following:

For Cozy Factor:

thisFormsController.getView().addStyleClass("sapUiSizeCozy");

For Compact Factor:

thisFormsController.getView().addStyleClass("sapUiSizeCompact");

Determine the content density by the type of device:

if (!sap.ui.Device.support.touch) {
	"If device is not touch supported - KEYBOARD & MOUSE interaction
	thisFormsController.getView().addStyleClass("sapUiSizeCompact");
} else {
	thisFormsController.getView().addStyleClass("sapUiSizeCozy");
}