Skip to content

Dialog

Overview

General dialog type. Migrated from Joist on 4/10/2018

@author Jonathan Olson (PhET Interactive Simulations) @author Sam Reid (PhET Interactive Simulations) @author Andrea Lin (PhET Interactive Simulations) @author Chris Malley (PixelZoom, Inc.)

Class Dialog

import { Dialog } from 'scenerystack/sim';

Constructor

new Dialog( content : Node, providedOptions? : DialogOptions )

Instance Methods

dispose()

Static Properties

DialogIO : IOType

Type DialogOptions

import type { DialogOptions } from 'scenerystack/sim';
  • xSpacing?: number
    Margins and spacing
  • ySpacing?: number
  • topMargin?: number
  • bottomMargin?: number
  • leftMargin?: number | null
  • maxWidthMargin?: number
  • maxHeightMargin?: number
  • closeButtonLength?: number
  • closeButtonTopMargin?: number
  • closeButtonRightMargin?: number
  • title?: Node | null
    title
  • titleAlign?: DialogTitleAlign
  • layoutStrategy?: DialogLayoutStrategy
    Sets the dialog's position in global coordinates.
  • closeButtonListener?: () => void
    close button options
  • closeButtonColor?: TColor
  • closeButtonTouchAreaXDilation?: number
  • closeButtonTouchAreaYDilation?: number
  • closeButtonMouseAreaXDilation?: number
  • closeButtonMouseAreaYDilation?: number
  • closeButtonVoicingDialogTitle?: string | TReadOnlyProperty<string> | null
    If provided use this dialog title in the Close button voicingNameResponse. This should be provided for proper Dialog Voicing design.
  • closeButtonLastInPDOM?: boolean
    By default, the close button is placed first in the PDOMOrder (and thus the focus order). Set this to true if you want the close button to be the last element in the focus order for the Dialog.
  • openedSoundPlayer?: TSoundPlayer
    sound generation
  • closedSoundPlayer?: TSoundPlayer
  • sim?: Sim
  • showCallback?: ( () => void ) | null
    Called after the dialog is shown, see https://github.com/phetsims/joist/issues/478
  • hideCallback?: ( () => void ) | null
    Called after the dialog is hidden, see https://github.com/phetsims/joist/issues/478
  • & StrictOmit<TrimmedParentOptions, "xMargin" | "yMargin">

Source Code

See the source for Dialog.ts in the sun repository.