Skip to content

LevelSelectionButtonGroup

Overview

LevelSelectionButtonGroup is a group of related LevelSelectionButtons, used in games.

Responsibilities include: - Instantiation of the buttons, based on an 'items' array that describes the buttons. - Setting an effective uniform size for the button icons. - Layout of the buttons, see details below. - Support for the gameLevels query parameter, via LevelSelectionButtonGroupOptions.gameLevels.

Layout: - The default layout is a single row of buttons, customizable via LevelSelectionButtonGroupOptions.flowBoxOptions. - To create multiple rows of buttons, see example MultiRowButtonGroup in demoLevelSelectionButtonGroup.ts. - To create a custom layout, see example XButtonGroup in demoLevelSelectionButtonGroup.ts.

@author Chris Malley (PixelZoom, Inc.)

Class LevelSelectionButtonGroup

import { LevelSelectionButtonGroup } from 'scenerystack/vegas';

Constructor

new LevelSelectionButtonGroup( items : LevelSelectionButtonGroupItem[], providedOptions? : LevelSelectionButtonGroupOptions )

Instance Methods

focusLevelSelectionButton( level : number )

Sets the focus to the button associated with a specified level number. If your simulation supports keyboard traversal, you'll typically need to call this when returning to the UI that show the LevelSelectionButtonGroup, for example, when the 'Back' or 'Start Over' button is pressed in a game. @param level - numbered starting from 1, to comply with gameLevels query parameter

Type LevelSelectionButtonGroupOptions

import type { LevelSelectionButtonGroupOptions } from 'scenerystack/vegas';
  • levelSelectionButtonOptions?: StrictOmit<LevelSelectionButtonOptions, "tandem" | "buttonHeight" | "buttonWidth">
    Options for all LevelSelectionButton instances in the group. These can be overridden for specific button(s) via LevelSelectionButtonGroupItem.options.
  • flowBoxOptions?: StrictOmit<FlowBoxOptions, "children">
    Options for the default layout, which is a FlowBox. Ignored if createLayoutNode is provided.
  • createLayoutNode?: ( buttons: LevelSelectionButton[] ) => LayoutNode<NodeLayoutConstraint>
    Creates the Node that handles layout of the buttons. Use this option if you have a custom layout that cannot be achieved using the default FlowBox.
  • gameLevels: number[]
    Game levels whose buttons should be visible. Levels are numbered starting from 1. Set this to the value of the gameLevels query parameter, a required query parameter. See getGameLevelsSchema.ts and example use in FMWQueryParameters.
  • groupButtonHeight?: number
  • groupButtonWidth?: number
  • & StrictOmit<NodeOptions, "children"> & PickRequired<NodeOptions, "tandem">

Source Code

See the source for LevelSelectionButtonGroup.ts in the vegas repository.