microsoft / microsoft/microsoft-ui-xaml

TitleBar: No way to override ContentPresenter HorizontalAlignment in Compact display mode

Open
#11,181 0 comments 1 reaction 1 assignee Claimed by @niels9001 View on GitHub
area-TitleBar
Dominant language
C++
Stars
8.4k
Forks
942
Avg merge
2d 7h
Merged PRs (30d)
105

Description

## Describe the bug

The built-in `TitleBar` control hard-codes `PART_ContentPresenter.HorizontalAlignment = Left` in the `Compact` visual state (`DisplayModeGroup`). There is no resource key, attached property, or other mechanism to override this value without retemplating the entire control.

### Current behavior

When the TitleBar enters compact mode (narrow window), the content area snaps to left alignment regardless of what the developer sets on the `Content` element or via the `TitleBarContentHorizontalAlignment` theme resource.

The `TitleBarContentHorizontalAlignment` resource only affects the **default/expanded** state. The compact state explicitly overrides it:

https://github.com/microsoft/microsoft-ui-xaml/blob/main/controls/dev/TitleBar/TitleBar.xaml#L153

```xml





```

Image

### Expected behavior

Developers should be able to control the `HorizontalAlignment` of content in compact mode without retemplating the entire control. Options:

1. **Use a theme resource** (e.g., `TitleBarCompactContentHorizontalAlignment`) so it can be overridden in `TitleBar.Resources`
2. **Remove the hard-coded setter** and let the content respect the same `TitleBarContentHorizontalAlignment` resource in both modes
3. **Expose a property** like `CompactContentHorizontalAlignment`

Image

### Impact

This is particularly painful for apps that put a search box or other stretched content in the TitleBar. When the window is resized narrow, the content suddenly shrinks and left-aligns, breaking the layout. The only workaround is to retemplate the entire TitleBar control, which is fragile and will break with future control updates.

### Steps to reproduce

1. Create a window with a built-in `TitleBar`
2. Place an `AutoSuggestBox` (or any element with `HorizontalAlignment="Stretch"`) in `TitleBar.Content`
3. Override `TitleBarContentHorizontalAlignment` to `Stretch` in `TitleBar.Resources`
4. Resize the window until the TitleBar enters compact mode
5. Observe: the content snaps to left-aligned and shrinks

### Environment

- Windows App SDK 2.0 / WinUI 3
- Windows 11

### Workaround

Full retemplating of the TitleBar control, copying the entire default template and changing the single setter in the `Compact` visual state from `Left` to `Stretch`. This is verbose (~170 lines of XAML) and fragile across SDK updates.

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.