Override widget instantiation

Use the widgetFactory section of the theme.config.json file to override the default instantiation of a widget.

When the GBC instantiates a widget, it uses a default class to create that widget. Within the widgetFactory section, you can specify that the GBC use a different class to instantiate that widget.

Consider this example:

{
 "widgetFactory": {
     "DateEdit": "cls.MyDateEditWidget",
     "SpinEdit": "cls.MySpinEditWidget"
   }
 }

This tells the system to use the custom class cls.MyDateEditWidget when instantiating a new DateEdit widget. All new instances of DateEdit are created using the custom class, which can include different rendering logic, styling, validation, or behavior.

Similarly, it tells the system to use the custom class cls.MySpinEditWidget when instantiating a new SpinEdit widget.

For more information on creating a custom class for a widget, go to Widget overrides. For more information on defining the widgetFactory section, go to theme.config.json file.

Revert mobile widget instantiation for DateTimeEdit

In this task, you will modify the theme part for mobile devices regarding widget instantiation. Instead of using the standard mobile widget for DateTimeEdit (cls.DateTimeEditMobileWidget), you will revert to the default GBC DateTimeEdit widget. The GBC DateTimeEdit widget is often preferred because it offers a more ergonomic design and is easier to use, particularly when entering historical dates such as dates of birth.

Steps

  1. Navigate to the theme.config.json file located in the gbc-project-dir/theme/platform/mobile directory
  2. Remove the theme setting for cls.DateEditMobileWidget.
    Before:
    {
  "conditions": ["isMobile"],
  "widgetFactory": {
    "DateEdit": "cls.DateEditMobileWidget",
    "DateTimeEdit": "cls.DateTimeEditMobileWidget",
    "TimeEdit": "cls.TimeEditMobileWidget",
    "SpinEdit": "cls.SpinEditMobileWidget"
  }
}
    After:
    {
  "conditions": ["isMobile"],
  "widgetFactory": {
    "DateEdit": "cls.DateEditMobileWidget",
    "TimeEdit": "cls.TimeEditMobileWidget",
    "SpinEdit": "cls.SpinEditMobileWidget"
  }
}
  3. Save your changes and rebuild your customization: 
    $ gbc build --customization customization-project-dir

    All new instances of the DateTimeEdit widget for mobile will use the default GBC DateTimeEdit widget.