> For the complete documentation index, see [llms.txt](https://docs.firework.com/firework-for-developers/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.firework.com/firework-for-developers/flutter-sdk/integration-guide-v2/customization/player-deck-configurations-flutter.md).

# Player deck configurations (Flutter)

`PlayerDeck` widget provides `playerDeckConfiguration` property for configuring Player Deck. The current configurable properties include `backgroundColor`, `cornerRadius`, `itemSpacing`, `contentPadding`, autoplay, item controls, ad badge, fullscreen behavior, and subtitles. Please refer to [PlayerDeckConfiguration](https://eng.firework.com/fw_flutter_sdk/v2/fw_flutter_sdk/PlayerDeckConfiguration-class.html) for more details.

### Customize player deck appearance and layout

```dart
final playerDeckConfiguration = PlayerDeckConfiguration(
  // Configure background color
  backgroundColor: "#FFFFFF",
  // Configure the corner radius for each deck item
  cornerRadius: 8,
  // Configure the spacing between each deck item
  itemSpacing: 16,
  // Configure content padding
  contentPadding: PlayerDeckPadding(
    top: 10,
    right: 10,
    bottom: 10,
    left: 10,
  ),
);

PlayerDeck(
  height: 481,
  source: VideoFeedSource.discover,
  playerDeckConfiguration: playerDeckConfiguration,
);
```

### Customize player deck item controls

```dart
final playerDeckConfiguration = PlayerDeckConfiguration(
  // Specifies if player deck item autoplay is enabled
  enableAutoplay: true,
  // Specifies if the play icon is hidden
  hidePlayIcon: false,
  // Configure the width of the play icon
  playIconWidth: 50,
  // Specifies if the ad badge is shown
  showAdBadge: true,
  // Specifies if the share button is shown
  showShareButton: true,
  // Specifies if full screen mode is enabled for the deck player
  enableFullScreen: true,
);

PlayerDeck(
  height: 481,
  source: VideoFeedSource.discover,
  playerDeckConfiguration: playerDeckConfiguration,
);
```

### Customize player deck subtitles

```dart
final playerDeckConfiguration = PlayerDeckConfiguration(
  subtitleConfiguration: PlayerDeckSubtitleConfiguration(
    textColor: "#FFFFFF",
    backgroundColor: "#000000",
  ),
);

PlayerDeck(
  height: 481,
  source: VideoFeedSource.discover,
  playerDeckConfiguration: playerDeckConfiguration,
);
```

### Update player deck configuration

You can update `playerDeckConfiguration` by rebuilding the `PlayerDeck` widget with a new `PlayerDeckConfiguration` value.

```dart
PlayerDeckConfiguration _playerDeckConfiguration = PlayerDeckConfiguration(
  enableAutoplay: true,
);

PlayerDeck(
  height: 481,
  source: VideoFeedSource.discover,
  playerDeckConfiguration: _playerDeckConfiguration,
);

void disablePlayerDeckAutoplay() {
  setState(() {
    _playerDeckConfiguration = PlayerDeckConfiguration(
      enableAutoplay: false,
    );
  });
}
```
