THEOplayer > UIConfiguration

UIConfiguration interface

Describes the UI configuration of the player.

Signature:

export interface UIConfiguration 

Properties

Property Details

fluid

Whether the UI of the player is responsive.

Signature:

fluid?: boolean;

fullscreenOptions

Options to control transitions to fullscreen mode.

Signature:

fullscreenOptions?: FullscreenOptions;

Remarks

- Available since v2.90.0.

height

The height of the player.

Signature:

height?: number | string;

Remarks

Possible formats
- A number as the amount of pixels.
- A percentage string (XX%).

language

The language which is used for localization.

Signature:

language?: string | UILanguage;

Remarks

- This can be a language map.
- Otherwise it can be a language code which is the key to a language map in UIConfiguration.languages.

Example 1

Localize statically to one language.

ui: {
  language: {
    "Play": "Reproducir",
    "Pause": "Pausa",
    "Current Time": "Tiempo actual",
    // [...]
  }
}

Example 2

Localize dynamically to one of multiple languages.

ui: {
  language: 'es',
  languages: {
    "es": {
      "Play": "Reproducir",
      "Pause": "Pausa",
      "Current Time": "Tiempo actual",
      // [...]
    },
    "fr": {
      // [...]
    }
  }
}

languages

A record used to localize to multiple languages. Each entry contains a language code with associated language map.

Signature:

languages?: Record<string, UILanguage>;

userActions

Actions that define the behavior of the player

Signature:

userActions?: UserActions;

Remarks

- Available since v4.3.0

width

The width of the player.

Signature:

width?: number | string;

Remarks

Possible formats
- A number as the amount of pixels.
- A percentage string (XX%).