Class Stage

constructor

• new Stage(options?: Partial<Lightning.Stage.Options>): Lightning.Stage

• Constructor for Stage

  Parameters

  • Optionaloptions: Partial<Lightning.Stage.Options>

  Returns Lightning.Stage

animations

application

Optionalc2d

ctx

dt

frameCounter

Optionalgl

platform

rectangleTexture

textureManager

transitions

coordsHeight

• get coordsHeight(): number

• Gets the height of the internal coordinate system of the Stage

  Returns number

  Remarks

  Same as this expression:

  this.h / this.getOption('precision')
  Copy

coordsWidth

• get coordsWidth(): number

• Gets the width of the internal coordinate system of the Stage

  Returns number

  Remarks

  Same as this expression:

  this.w / this.getOption('precision')
  Copy

h

• get h(): number

• Gets the height of the rendered Stage

  Returns number

  Remarks

  This comes directly from the h Stage option (Stage.Options.w).

mode

• get mode(): 0 | 1

• Returns the rendering mode.

  Returns 0 | 1

  • 0 = WebGL
  • 1 = Canvas2D

renderer

• get renderer(): WebGLRenderer | C2dRenderer

• Gets the Renderer that is being utilized

  Returns WebGLRenderer | C2dRenderer

root

• get root(): Lightning.Application<
      Lightning.Application.TemplateSpecLoose,
      Lightning.Application.TypeConfig,
  >

• Gets the root Application Element

  Returns Lightning.Application<
      Lightning.Application.TemplateSpecLoose,
      Lightning.Application.TypeConfig,
  >

  Remarks

  Alias for application

usedMemory

• get usedMemory(): number

• Amount of memory used (in pixels)

  Returns number

usedVram

• get usedVram(): number

• Amount of memory used by textures (in bytes)

  Returns number

usedVramAlpha

• get usedVramAlpha(): number

• Amount of memory used by textures with alpha channel (in bytes)

  Returns number

usedVramNonAlpha

• get usedVramNonAlpha(): number

• Amount of memory used by textures without alpha channel (in bytes)

  Returns number

w

• get w(): number

• Gets the width of the rendered Stage

  Returns number

  Remarks

  This comes directly from the w Stage option (Stage.Options.w).

c

• c<
      T extends
          Lightning.Component.Constructor<
              Lightning.Component<
                  Lightning.Component.TemplateSpecLoose,
                  Lightning.Component.TypeConfigLoose,
              >,
          >,
  >(
      settings: Lightning.Element.NewPatchTemplate<T>,
  ): InstanceType<T>

• Alias for element

  Type Parameters

  • T extends Lightning.Component.Constructor<
        Lightning.Component<
            Lightning.Component.TemplateSpecLoose,
            Lightning.Component.TypeConfigLoose,
        >,
    >

  Parameters

  • settings: Lightning.Element.NewPatchTemplate<T>

  Returns InstanceType<T>

  See

  element

• c(
      settings: Lightning.Element<
          Lightning.Element.TemplateSpecLoose,
          Lightning.Element.TypeConfigLoose,
      >,
  ): Lightning.Element<
      Lightning.Element.TemplateSpecLoose,
      Lightning.Element.TypeConfigLoose,
  >

• Alias for element

  Parameters

  • settings: Lightning.Element<
        Lightning.Element.TemplateSpecLoose,
        Lightning.Element.TypeConfigLoose,
    >

  Returns Lightning.Element<
      Lightning.Element.TemplateSpecLoose,
      Lightning.Element.TypeConfigLoose,
  >

  See

  element

• c(
      settings: PatchTemplate<Lightning.Element.TemplateSpecLoose>,
  ): Lightning.Element<
      Lightning.Element.TemplateSpecLoose,
      Lightning.Element.TypeConfigLoose,
  >

• Alias for element

  Parameters

  • settings: PatchTemplate<Lightning.Element.TemplateSpecLoose>

  Returns Lightning.Element<
      Lightning.Element.TemplateSpecLoose,
      Lightning.Element.TypeConfigLoose,
  >

  See

  element

• c(
      settings:
          | Lightning.Element<
              Lightning.Element.TemplateSpecLoose,
              Lightning.Element.TypeConfigLoose,
          >
          | PatchTemplate<Lightning.Element.TemplateSpecLoose>,
  ): Lightning.Element<
      Lightning.Element.TemplateSpecLoose,
      Lightning.Element.TypeConfigLoose,
  >

• Alias for element

  Parameters

  • settings:
        | Lightning.Element<
            Lightning.Element.TemplateSpecLoose,
            Lightning.Element.TypeConfigLoose,
        >
        | PatchTemplate<Lightning.Element.TemplateSpecLoose>

  Returns Lightning.Element<
      Lightning.Element.TemplateSpecLoose,
      Lightning.Element.TypeConfigLoose,
  >

  See

  element

createElement

• createElement(
      settings?: PatchTemplate<Lightning.Element.TemplateSpecLoose>,
  ): Lightning.Element<
      Lightning.Element.TemplateSpecLoose,
      Lightning.Element.TypeConfigLoose,
  >

• Creates and returns a new Element from settings

  Parameters

  • Optionalsettings: PatchTemplate<Lightning.Element.TemplateSpecLoose>

  Returns Lightning.Element<
      Lightning.Element.TemplateSpecLoose,
      Lightning.Element.TypeConfigLoose,
  >

  Remarks

  • If settings are provided:
    • Calls/returns element with the provided settings.
  • Otherwise:
    • Creates/returns a plain Element instance.

  Note: This method does NOT construct Components. For that, see element

createShader

• createShader(
      settings: Lightning.types.Shader.SettingsLoose,
  ): Lightning.types.Shader

• Create a Shader instance from its settings

  Parameters

  • settings: Lightning.types.Shader.SettingsLoose

  Returns Lightning.types.Shader

drawFrame

• drawFrame(): void

• Updates and renders a new frame

  Returns void

element

• element<
      T extends
          Lightning.Component.Constructor<
              Lightning.Component<
                  Lightning.Component.TemplateSpecLoose,
                  Lightning.Component.TypeConfigLoose,
              >,
          >,
  >(
      settings: Lightning.Element.NewPatchTemplate<T>,
  ): InstanceType<T>

• Creates and returns a new Element / Component instance from settings

  Type Parameters

  • T extends Lightning.Component.Constructor<
        Lightning.Component<
            Lightning.Component.TemplateSpecLoose,
            Lightning.Component.TypeConfigLoose,
        >,
    >

  Parameters

  • settings: Lightning.Element.NewPatchTemplate<T>

  Returns InstanceType<T>

  Remarks

  • If settings is already an instantiated Element:
    • Simply returns back the settings value.
  • If settings includes type (i.e. type of Component):
    • Creates the Component instance, patches settings into it and returns it.
  • Otherwise:
    • Creates an Element instance, patches settings into it and returns it.

  Example

  // Type-safe Component Creation
  const myListComponent = stage.element<typeof lng.components.ListComponent>({
    type: lng.components.ListComponent,
    viewportScrollOffset: 100
  });
  
  // Type-safe Element Creation
  const myListComponent = stage.element({
    x: 100,
    y: 200,
    text: 'My Text'
  });
  Copy

• element(
      settings: Lightning.Element<
          Lightning.Element.TemplateSpecLoose,
          Lightning.Element.TypeConfigLoose,
      >,
  ): Lightning.Element<
      Lightning.Element.TemplateSpecLoose,
      Lightning.Element.TypeConfigLoose,
  >

• Creates and returns a new Element / Component instance from settings

  Parameters

  • settings: Lightning.Element<
        Lightning.Element.TemplateSpecLoose,
        Lightning.Element.TypeConfigLoose,
    >

  Returns Lightning.Element<
      Lightning.Element.TemplateSpecLoose,
      Lightning.Element.TypeConfigLoose,
  >

  Remarks

  • If settings is already an instantiated Element:
    • Simply returns back the settings value.
  • If settings includes type (i.e. type of Component):
    • Creates the Component instance, patches settings into it and returns it.
  • Otherwise:
    • Creates an Element instance, patches settings into it and returns it.

  Example

  // Type-safe Component Creation
  const myListComponent = stage.element<typeof lng.components.ListComponent>({
    type: lng.components.ListComponent,
    viewportScrollOffset: 100
  });
  
  // Type-safe Element Creation
  const myListComponent = stage.element({
    x: 100,
    y: 200,
    text: 'My Text'
  });
  Copy

• element(
      settings: PatchTemplate<Lightning.Element.TemplateSpecLoose>,
  ): Lightning.Element<
      Lightning.Element.TemplateSpecLoose,
      Lightning.Element.TypeConfigLoose,
  >

• Creates and returns a new Element / Component instance from settings

  Parameters

  • settings: PatchTemplate<Lightning.Element.TemplateSpecLoose>

  Returns Lightning.Element<
      Lightning.Element.TemplateSpecLoose,
      Lightning.Element.TypeConfigLoose,
  >

  Remarks

  • If settings is already an instantiated Element:
    • Simply returns back the settings value.
  • If settings includes type (i.e. type of Component):
    • Creates the Component instance, patches settings into it and returns it.
  • Otherwise:
    • Creates an Element instance, patches settings into it and returns it.

  Example

  // Type-safe Component Creation
  const myListComponent = stage.element<typeof lng.components.ListComponent>({
    type: lng.components.ListComponent,
    viewportScrollOffset: 100
  });
  
  // Type-safe Element Creation
  const myListComponent = stage.element({
    x: 100,
    y: 200,
    text: 'My Text'
  });
  Copy

• element(
      settings:
          | Lightning.Element<
              Lightning.Element.TemplateSpecLoose,
              Lightning.Element.TypeConfigLoose,
          >
          | PatchTemplate<Lightning.Element.TemplateSpecLoose>,
  ): Lightning.Element<
      Lightning.Element.TemplateSpecLoose,
      Lightning.Element.TypeConfigLoose,
  >

• Creates and returns a new Element / Component instance from settings

  Parameters

  • settings:
        | Lightning.Element<
            Lightning.Element.TemplateSpecLoose,
            Lightning.Element.TypeConfigLoose,
        >
        | PatchTemplate<Lightning.Element.TemplateSpecLoose>

  Returns Lightning.Element<
      Lightning.Element.TemplateSpecLoose,
      Lightning.Element.TypeConfigLoose,
  >

  Remarks

  • If settings is already an instantiated Element:
    • Simply returns back the settings value.
  • If settings includes type (i.e. type of Component):
    • Creates the Component instance, patches settings into it and returns it.
  • Otherwise:
    • Creates an Element instance, patches settings into it and returns it.

  Example

  // Type-safe Component Creation
  const myListComponent = stage.element<typeof lng.components.ListComponent>({
    type: lng.components.ListComponent,
    viewportScrollOffset: 100
  });
  
  // Type-safe Element Creation
  const myListComponent = stage.element({
    x: 100,
    y: 200,
    text: 'My Text'
  });
  Copy

forceRenderUpdate

• forceRenderUpdate(): void

• Force a re-render

  Returns void

gc

• gc(aggressive?: boolean): void

• Runs the texture memory garbage collector.

  Parameters

  • Optionalaggressive: boolean

  Returns void

  Remarks

  By default this will clean up all currently unused textures from the application.

  If agressive is set to true, it will clean up ALL textures regardless of if they are in use.

getCanvas

• getCanvas(): HTMLCanvasElement

• Gets the active Canvas HTML Element used for rendering

  Returns HTMLCanvasElement

getChildrenByPosition

• getChildrenByPosition(x: number, y: number): Lightning.ElementCore[]

• Gets all of the ElementCore instances that interesect the point (x, y).

  Parameters

  • x: number
  • y: number

  Returns Lightning.ElementCore[]

  Remarks

  Used for touch functionality.

getClearColor

• getClearColor(): null | RGBA

• Gets the Stage's Clear Color

  Returns null | RGBA

getDrawingCanvas

• getDrawingCanvas(): HTMLCanvasElement

• Creates a new Canvas Element for use for offscreen drawing

  Returns HTMLCanvasElement

getOption

• getOption<
      T extends keyof Lightning.Stage.Options,
      O extends
      
              | null
              | string
              | number
              | boolean
              | HTMLCanvasElement
              | CanvasRenderingContext2D
              | WebGLRenderingContext
              | { fontSize: number; precision: number }
              | RGBA
              | typeof WebPlatform,
  >(
      optionKey: T,
  ): O

• Gets an option value from the active set of Stage.Options

  Type Parameters

  • T extends keyof Lightning.Stage.Options
  • O extends
        | null
        | string
        | number
        | boolean
        | HTMLCanvasElement
        | CanvasRenderingContext2D
        | WebGLRenderingContext
        | { fontSize: number; precision: number }
        | RGBA
        | typeof WebPlatform

  Parameters

  • optionKey: T

  Returns O

getRenderPrecision

• getRenderPrecision(): number

• Gets the Stage.Options.precision option.

  Returns number

isC2d

• isC2d(): boolean

• Returns true if the rendering mode is Canvas2d.

  Returns boolean

isUpdatingFrame

• isUpdatingFrame(): boolean

• Returns true if the frame is currently updating

  Returns boolean

isWebgl

• isWebgl(): boolean

• Returns true if the rendering mode is WebGL.

  Returns boolean

resume

• resume(): void

• Resumes the rendering loop

  Returns void

  Remarks

  This must be called after stop to resume frame rendering.

setClearColor

• setClearColor(clearColor: null | number | RGBA): void

• Sets the Stage's Clear Color

  Parameters

  • clearColor: null | number | RGBA

  Returns void

  See

  Stage.Options.clearColor for details

stop

• stop(): void

• Stops the rendering loop

  Returns void

  Remarks

  This will halt all frame rendering until resume is called.

update

• update(): void

• Force update of the render tree layout

  Returns void

  Remarks

  Call this to ensure the finalX, finalY, finalW, finalH properties of Elements are updated appropriately without waiting for a frame to render.

  See Flexbox for more information.

StaticisWebglSupported

• isWebglSupported(): boolean

• Returns true if WebGL is supported by the platform.

  Returns boolean