Content Views: Boxes and List Layouts

Written By launchbox

Last updated About 1 month ago

LaunchBox has two main Desktop content views:

BoxesContentView.xaml    ListContentView.xaml

These are the views shown inside the main content region of MainView.xaml. The active one depends on whether the user is browsing in image/grid view or list view.

BoxesContentView.xaml is used for the visual box/grid browsing experience.

ListContentView.xaml is used for the table-style metadata list.

Shared Content View Behavior

Both content views inherit from the same content view model base, so they share several important bindings:

Binding	Purpose
`Items`	The games or separator items currently being displayed.
`Title`	The current content title.
`CollectionVisibility`	Shows the item collection when there are results.
`NoResultsVisibility`	Shows the no-results message when no items are available.
`NoResultsLabel`	Text displayed for an empty result set.
`ScrollBarVisibility`	Controls whether scrollbars are visible.
`FontFamily`	Game list font from LaunchBox visual settings.
`FontSize`	Game list font size.
`FontWeight`	Game list font weight.
`FontStyle`	Game list font style.

Both views also handle selection changes and right-click behavior through LaunchBox's built-in view models. Theme developers should preserve the main item control name:

x:Name="Items"

BoxesContentView

BoxesContentView.xaml controls the image/grid browsing view.

It uses a ListView with a virtualized tile panel:

<next:VirtualizingTilePanel ChildSize="{Binding BoxChildSize}" />

This is important for performance. Large LaunchBox libraries can contain thousands of games, so the default view virtualizes item layout instead of creating every visual element at once.

Theme developers can customize the item template heavily, but should be careful when replacing the virtualized panel.

Box Item Bindings

Each item in BoxesContentView.xaml is usually a BoxItemViewModel.

Common item bindings include:

Binding	Purpose
`Game`	The underlying game object.
`Title`	The displayed game title.
`Description`	Secondary text or subline.
`ContentImage`	The box/image content for the item.
`Badges`	Badges shown on the item.
`IsSelected`	Whether the item is selected.
`IsSeparator`	Whether the item is a sort/group separator.
`BoxVisibility`	Shows normal game box content.
`SeparatorVisibility`	Shows separator content.
`BoxTextOnlyVisibility`	Shows text-only fallback when an image is missing.
`ImageTextBorderVisibility`	Controls image/text overlay behavior.
`ItemHeight`	Calculated item height.
`MaxTextHeight`	Maximum text height based on user settings.
`SortType`	Separator sort type label.
`SortValue`	Separator sort value label.

The default view also uses bindings for margins, padding, text alignment, outlines, shadows, hover icons, and dynamic image sizing. Many of these are driven by LaunchBox visual settings.

Image and Text Fallbacks

Box items can show either image-based content or text-only content.

When a game image is missing, the item can show text using:

BoxTextOnlyVisibility    Title    Description

When an image exists, the item can show:

ContentImage    Title    Description    Badges

This is why a good box view should be tested with games that have complete images and games that are missing box art.

Badges in Box View

BoxesContentView.xaml displays badges through the item's Badges collection.

Each badge exposes information like:

Icon    Name

The default theme displays badge icons in a horizontal list and uses the badge name as tooltip text.

If your theme uses badges, keep them small and avoid making them resize the main box item unexpectedly.

Separators

When the library is sorted or grouped, LaunchBox can insert separator items.

Separators use bindings like:

IsSeparator    SeparatorVisibility    SortType    SortValue

A separator might display something like:

Platform: Nintendo Entertainment System    Genre: Platformer    Year: 1994

If you customize the box item template, make sure separator items still have a usable layout.

ListContentView

ListContentView.xaml controls LaunchBox's table-style game list.

It uses a DataGrid named:

<DataGrid Name="Items" />

This view is built around rows, columns, sorting, column resizing, and metadata-heavy browsing.

The default list view includes columns for common game fields such as:

Title    Platform    Developer    Publisher    Release Date    Rating    Genres    Series    Region    Play Mode    Version    Status    Source    Last Played    Date Added    Date Modified    Play Count    Favorite    Progress    Broken    Portable    Hidden    Star Rating    Community Star Rating    Alternate Names    Installed    Application Path    LaunchBox Database ID    Wikipedia URL    Video URL    Play Time    Badges

List Item Bindings

Each row in ListContentView.xaml is usually a ListItemViewModel.

Common row bindings include:

Binding	Purpose
`Game.Title`	Game title.
`Game.Platform`	Platform name.
`Game.Developer`	Developer text.
`Game.Publisher`	Publisher text.
`ReleaseDate`	Formatted release date.
`Genres`	Formatted genre list.
`LastPlayed`	Formatted last played date.
`DateAdded`	Formatted date added.
`DateModified`	Formatted date modified.
`Favorite`	Yes/no favorite value.
`Broken`	Yes/no broken value.
`Portable`	Yes/no portable value.
`Hide`	Yes/no hidden value.
`StarRating`	User star rating.
`CommunityStarRating`	Community star rating.
`AlternateNames`	Alternate game names.
`Installed`	Installed state.
`WikipediaUrl`	Wikipedia link.
`VideoUrl`	Video link.

Several date columns also have sort value bindings, such as ReleaseDateSortValue, LastPlayedSortValue, DateAddedSortValue, and DateModifiedSortValue.

Headers and Labels

ListContentView.xaml uses label bindings from ListContentViewModel for column headers.

Examples:

TitleLabel    PlatformLabel    DevelopersLabel    PublishersLabel    ReleaseDateLabel    GenresLabel    PlayCountLabel    InstalledLabel    ApplicationPathLabel    PlayTimeLabel

This lets LaunchBox provide the correct display text instead of hard-coding column names directly into the view.

Choosing What to Customize

Customize BoxesContentView.xaml when you want to change:

box art layout
grid spacing
selected item styling
text overlays
missing-image fallback
badge placement
separator styling
hover animation

Customize ListContentView.xaml when you want to change:

row styling
column styling
header styling
metadata columns
selection styling
scrollbars
table spacing

What to Be Careful With

For BoxesContentView.xaml, be careful with virtualization. Replacing the virtualized tile panel can hurt performance in large libraries.

For ListContentView.xaml, be careful with the DataGrid name, column bindings, sort member paths, and selection behavior.

For both views, preserve:

Items    CollectionVisibility    NoResultsVisibility    NoResultsLabel    ScrollBarVisibility    SelectionChanged behavior    Right-click behavior

In Short

BoxesContentView.xaml controls the visual box/grid browsing experience, while ListContentView.xaml controls the metadata-heavy table view. Both views are loaded into the main content region of MainView.xaml, both bind to the active game collection, and both should preserve LaunchBox's selection, scrolling, empty-state, and item binding behavior.