FormLayout

View source
ceramic.Entity → ceramic.Visual → ceramic.Quad → ceramic.Layer → ceramic.View → ceramic.LinearLayout → ceramic.ColumnLayout → elements.FormLayout (Class)
Implements: tracker.Observable

A specialized column layout designed for forms in the Elements UI framework.

FormLayout extends ColumnLayout to provide form-specific styling and behavior:

  • Automatic background rendering for form sections
  • Integrated tab focus navigation
  • Theme-aware styling with proper spacing and padding
  • Support for custom item backgrounds and window backgrounds

The layout automatically divides the form into three background sections:

  • Top background (above first item)
  • Individual item backgrounds (optional, between items)
  • Bottom background (below last item)
See: ColumnLayout, TabFocus

Instance Members

elements
observedDirty: Bool

Default is false, automatically set to true when any of this instance's observable variables has changed.

elements
theme: Theme

Custom theme for this form. If null, uses the global context theme.

elements
tabFocus: TabFocus

Tab focus component for keyboard navigation within the form.

elements
invalidateTheme(): Void
elements
destroy(): Void

Destroys the form layout and all its background components.

Cleans up:

  • All item background quads
  • Top background quad
  • Bottom background quad
elements
new(): Void

Creates a new FormLayout instance.

Initializes the form with:

  • Non-transparent background
  • Tab focus navigation
  • Automatic style and background updates

Private Members

elements
EMPTY_ARRAY: ceramic.ReadOnlyArray<Dynamic>

Empty array constant used for reflection method calls.

elements
unobservedTheme: Theme
elements
backgroundTop: ceramic.Quad

Background quad for the top section of the form.

elements
backgrounds: Array<ceramic.Quad>

Array of background quads for individual form items.

elements
backgroundBottom: ceramic.Quad

Background quad for the bottom section of the form.

elements
emitObservedDirty(instance: FormLayout, fromSerializedField: Bool): Void

Event when any observable value as changed on this instance.

Name Type
instance FormLayout
fromSerializedField Bool
elements
emitThemeChange(current: Theme, previous: Theme): Void

Event when theme field changes.

Name Type
current Theme
previous Theme
elements
layout(): Void

Performs form layout, positioning all backgrounds and items.

The layout process:

  1. Calls parent layout to position items
  2. Updates background components
  3. Positions top background from top edge to first item
  4. Positions item backgrounds centered on each item
  5. Positions bottom background from last item to bottom edge
elements
computeBackgrounds(): Void

Computes and updates all background components based on current theme settings.

This method:

  • Creates or updates background quads as needed
  • Applies theme colors and alpha values
  • Respects individual item theme overrides
  • Handles items that render their own backgrounds
  • Activates/deactivates backgrounds based on theme settings
elements
updateStyle(): Void

Updates the form's visual style based on the current theme.

Applies:

  • Background color from theme
  • Item spacing for proper form layout
  • Padding around form content

Metadata

Name Parameters
:build tracker.macros.ObservableMacro.build()
:autoBuild tracker.macros.ObservableMacro.build()
:build ceramic.macros.EntityMacro.buildForCompletion()
:autoBuild ceramic.macros.EntityMacro.buildForCompletion()
:build tracker.macros.EventsMacro.build()
:autoBuild tracker.macros.EventsMacro.build()