g-on-prepare
event¶
Description: Called so you can prepare and/or adjust the interface for different screen sizes.
Allows breakdown by screen size: Yes
Arguments:
Argument |
Description |
---|---|
|
The screen size the interface needs to be prepared for.
Learn more about screen size breakdowns here. |
The event is called whenever an interface needs to be prepared and/or adjusted for a different screen size. It is called at the first layout organization and whenever the screen size class changes.
Example:
<form>
<layout g="container">
<layout name="leftMenu" g="block" width="60" g-vert-tile="true">
<!-- Left menu content here -->
</layout>
<col g-width="12" g-vert-tile="true">
<!-- Center content here -->
</col>
<event name="g-on-prepare-xs">
self.leftMenu.visible = false;
</event>
<event name="g-on-prepare-lg">
self.leftMenu.visible = true;
</event>
</layout>
</form>
The example will hide a left menu on screen sizes "xs"
, "sm"
, "md"
and show it on screen sizes "lg"
and "xl"
.