# Interface UiConfiguration

interface UiConfiguration {
aspectRatio: string;
audioOnlyMode: boolean;
audioPosterMode: boolean;
defaultControlBarComponents: DefaultControlBarComponents[];
defaultSmartTvControlBarComponents: DefaultSmartTvControlBarComponents[];
defaultUiComponents: DefaultPlayerComponents[];
fluid: boolean;
fullscreen: null | "auto" | "show" | "hide";
height: number;
language: null | LanguageKey;
nativeControlsForTouch: boolean;
noUITitleAttributes: boolean;
playsinline: boolean;
poster: null | string;
preferFullWindow: boolean;
skipBackward: null | 5 | 10 | 30;
skipForward: null | 5 | 10 | 30;
spatialNavigation: SpacialNavigationConfiguration;
width: number;
}

#####
Index

### Properties

aspectRatio
audioOnlyMode
audioPosterMode
defaultControlBarComponents
defaultSmartTvControlBarComponents
defaultUiComponents
fluid
fullscreen
height
language
nativeControlsForTouch
noUITitleAttributes
playsinline
poster
preferFullWindow
skipBackward
skipForward
spatialNavigation
width

## Properties

### aspectRatio

aspectRatio: string

Puts the player in fluid mode and the value is used when calculating the dynamic size of the player. The value should represent a ratio - two numbers separated by a colon (e.g. "16:9" or "4:3"). Defaults to `'16:9'`. Can be updated dynamically.

### audioOnlyMode

audioOnlyMode: boolean

If set to true, it asynchronously hides all player components except the control bar, as well as any specific controls that are needed only for video. Can be updated dynamically.

### audioPosterMode

audioPosterMode: boolean

If set to true, it enables the poster viewer experience by hiding the video element and displaying the poster image persistently. Can be updated dynamically.

### defaultControlBarComponents

defaultControlBarComponents: DefaultControlBarComponents[]

### defaultSmartTvControlBarComponents

defaultSmartTvControlBarComponents: DefaultSmartTvControlBarComponents[]

### defaultUiComponents

defaultUiComponents: DefaultPlayerComponents[]

This is used to determine which default UI Components will be attached to the player. This should have a value of an array of strings of the default player component names. Defaults to the list of DefaultPlayerComponents.

### fluid

fluid: boolean

When true, the player will have a fluid size. In other words, it will scale to fit its container at the video's intrinsic aspect ratio, or at a specified aspectRatio. Can be updated dynamically.

### fullscreen

fullscreen: null | "auto" | "show" | "hide"

This can be set to pass in the fullscreen navigationUi options. For more info, see: https://fullscreen.spec.whatwg.org/#dictdef-fullscreenoptions

### height

height: number

Sets the display height of the video player in pixels. Can be updated dynamically. Defaults to `360`

### language

language: null | LanguageKey

Select a specific language for localization. Defaults to null The player language is set to one of the following in descending priority:

- The language specified in setup options as above.
- The language specified by the closet element with a lang attribute, usually in the html tag.
- Browser language preference (the first language if more than one is configured)
- LanguageKey.En Can be updated dynamically.

### nativeControlsForTouch

nativeControlsForTouch: boolean

Determines if native controls should be used for touch devices.

### noUITitleAttributes

noUITitleAttributes: boolean

Control whether UI elements have a title attribute. A title attribute is shown on mouse hover, which can be helpful for usability, but has drawbacks for accessibility.

### playsinline

playsinline: boolean

Indicates to the browser that non-fullscreen playback is preferred when fullscreen playback is the native default, such as in iOS Safari. See: https://html.spec.whatwg.org/#attr-video-playsinline Can be updated dynamically.

### poster

poster: null | string

A URL to an image that displays before the video begins playing. This is often a frame of the video or a custom title screen. Can be updated dynamically.

### preferFullWindow

preferFullWindow: boolean

Setting this to true will change fullscreen behaviour on devices which do not support the HTML5 fullscreen API but do support fullscreen on the video element, i.e. iPhone. Instead of making the video fullscreen, the player will be stretched to fill the browser window.

### skipBackward

skipBackward: null | 5 | 10 | 30

If specified, the player displays a control allowing the user to jump back in a video by the specified number of seconds. Valid values are `5` | `10` | `30` Defaults to `null`

### skipForward

skipForward: null | 5 | 10 | 30

If specified, the player displays a control allowing the user to jump forward in a video by the specified number of seconds. Valid values are `5` | `10` | `30` Defaults to `null`

### spatialNavigation

spatialNavigation: SpacialNavigationConfiguration

Configuration for enabling and managing spatial navigation within the player.

### width

width: number

Sets the display width of the video player in pixels. Can be updated dynamically. Defaults to `640`