Unable to set width of ContentDialog

[knightmeister]

Describe the bug
Using the properties MinWidth, MaxWidth and Width have no effect on the width of the ContentDialog but break the ability to resize the window and keep the ContentDialog centered. There are numerous questions on StackOverflow about setting the content dialog width. The solution is always to change the ContentDialogMaxWidth in App.xaml but even setting that does not work as expected.

Steps to reproduce the bug
Add a button to a page and use the following event handler:

        private async void Button_Click(object sender, RoutedEventArgs e)
        {
            ContentDialog dialog = new ContentDialog();
            string content = "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque varius vehicula orci. Integer erat lectus, congue in maximus ac, venenatis sed risus. Fusce odio nisl, luctus id rhoncus a, pretium eget dolor. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas pellentesque cursus nibh, id venenatis lectus vulputate id. Curabitur ut ligula bibendum, vehicula tellus in, sodales leo. Suspendisse sed tellus imperdiet, ullamcorper libero non, venenatis enim. Quisque quis nibh bibendum, aliquam nunc vel, cursus erat.";
            content += "\n\nIn eleifend placerat velit eget tempus. Duis eget augue tellus. Mauris fringilla vehicula cursus. Nunc maximus libero et nisi gravida vulputate. Sed consectetur id urna quis consectetur. Quisque id nulla venenatis dolor semper rhoncus. Ut metus erat, tincidunt ut consectetur vitae, suscipit a ligula. Etiam mollis nec nibh quis suscipit. Aliquam quis eleifend mauris. Nunc consequat id purus vitae efficitur. Fusce quis imperdiet nibh, eget mattis urna. In vitae ipsum commodo, feugiat neque non, tempus urna. Praesent cursus nisi et ex interdum, elementum ultricies nisi eleifend. Etiam metus lorem, vulputate a leo nec, molestie porttitor leo. Proin eget dictum orci.";
            content += "\n\nNam pellentesque lacus orci, vel tempus turpis semper id. Mauris ut egestas mi, a facilisis ligula. Aenean dapibus nisi eget sapien varius, et suscipit turpis imperdiet. Aenean blandit ornare porta. Praesent hendrerit, ligula at ullamcorper euismod, magna enim venenatis neque, ac tincidunt magna elit in eros. Nulla viverra consectetur faucibus. Etiam tincidunt ornare tortor vitae viverra. Quisque a risus in ligula sagittis tempus. Maecenas consequat lectus ornare odio sagittis, quis feugiat quam facilisis. Quisque ac ante mauris. Sed convallis pellentesque lorem, a accumsan erat commodo eu. Vivamus malesuada pharetra purus, nec hendrerit sapien ultricies id. In rutrum mauris libero, id finibus urna imperdiet vitae. Sed ultrices ornare mi, eu eleifend dui tempor sed. Praesent nec ante mollis, ornare quam eget, sollicitudin eros.";
            content += "\n\nCras lacinia nisi at velit tempus pretium. Duis quis enim mi. Nunc euismod, urna ut vulputate eleifend, tortor augue lacinia dui, eu pulvinar odio urna quis arcu. Morbi eget eleifend nibh, sit amet ultrices mi. Curabitur convallis urna ut neque dignissim malesuada. Morbi eget mollis nulla. Praesent vel libero placerat, rhoncus mi eget, auctor tortor. Integer eget ornare odio, vitae mattis diam. Praesent vestibulum varius eleifend. Quisque egestas, quam quis elementum pharetra, enim tortor scelerisque arcu, at posuere nisi eros sed ex. Etiam rutrum porttitor urna non vestibulum.";
            dialog.Content = content;

            dialog.MinWidth = this.ActualWidth * .8;
            dialog.Width = this.ActualWidth * .8;
            dialog.MaxWidth = this.ActualWidth * .8;
            

            await dialog.ShowAsync();
        }

When updating the ContentDialogMaxWidth:

...
<Application.Resources>
    <x:Double x:Key="ContentDialogMaxWidth">9999</x:Double>
</Application.Resources>
...

Expected behavior
I would expect the following behaviour:

1. (Without overriding ContentDialogMaxWidth) The dialog consumes 80% of the window size
2. Resizing the window keeps the ContentDialog horizontally centered

Actual behaviour

1. When setting MinWidth/MaxWidth/Width, the ContentDialog is no longer centered (see screenshot 2)
2. When setting MinWidth/MaxWidth/Width properties, the ContentDialog is no longer repositioned and recentered when the window is resized (see screenshot 3)
3. When setting ContentDialogMaxWidth, in conjunction with MinWidth/MaxWidth/Width 80% of the width is used however the dialog is not horizontally centered and does not recenter as the dialog is resized.

Screenshots
Screenshot 1: None of MinWidth/MaxWidth/Width are set:

The following screenshots have MinWidth/MaxWidth and Width set to this.ActualWidth * .8

Screenshot 2: ContentDialog is no longer centered:

Screenshot 3: ContentDialog is not repositioned on resize:

The following screenshots have MinWidth/MaxWidth and Width set to this.ActualWidth * .8 with ContentDialogMaxWidth = 9999

Version Info
1809 using the Windows inbuilt controls

NuGet package version:
N/A

[jevansaks]

Good bug. I believe this is because ContentDialog is a FrameworkElement but it moves its content to a popup so the layout-related properties don't take effect. We can probably make the *Width/*Height properties work.

[JackScottAU]

This is impacting me as well, it would be great to get a fix. :)

[knightmeister]

Hi guys, I note the tag "needs-winui-3" has been added to this. Is there a work around that would allow me to increase the size of a content dialog?

[jevansaks]

@YuliKl @kmahone any thoughts on a workaround for this?

[YuliKl]

@knightmeister, there's a resource in generic.xaml that controls ContentDialog's width:

<x:Double x:Key="ContentDialogMaxWidth">548</x:Double>

You should be able to set this double to a larger value within your App.xaml resources.

Edit: reread your original post and this is exactly the resource you're noting doesn't work. I'm not sure why that is. I'm not aware of any other workarounds.

What happens when you only change ContentDialogMaxWidth, without also specifying

            dialog.MinWidth = this.ActualWidth * .8;
            dialog.Width = this.ActualWidth * .8;
            dialog.MaxWidth = this.ActualWidth * .8;

?

[harvinders]

It would also be great if there is a way to set width based on the main windows width breakpoints.

[NPadrutt]

@knightmeister, there's a resource in generic.xaml that controls ContentDialog's width:

<x:Double x:Key="ContentDialogMaxWidth">548</x:Double>

You should be able to set this double to a larger value within your App.xaml resources.

Edit: reread your original post and this is exactly the resource you're noting doesn't work. I'm not sure why that is. I'm not aware of any other workarounds.

What happens when you only change ContentDialogMaxWidth, without also specifying

            dialog.MinWidth = this.ActualWidth * .8;
            dialog.Width = this.ActualWidth * .8;
            dialog.MaxWidth = this.ActualWidth * .8;

?

I tried that, but it didn't work as well.

[jhwheuer]

So what we can say is that for larger payloads it is back to a in-page Grid whose Visibility gets turned on and off, or maybe a Flyout? Oh dear, because this behavior has been unchanged for more than a year now...
Quite frankly, setting absolute values in a static resource is just -bad- style (pun intended).

[harvinders]

Setting <x:Double x:Key="ContentDialogMaxWidth">800</x:Double> in app.xaml on Windows 10 1909, worked for me.

[sigmarsson]

this.InitializeComponent();
this.MaxWidth = App.MainWindow.Bounds.Width;

does not get me either to the desired width.

[sigmarsson]

Is there a timeline to overhaul the ContentDialog to

1. satisfy its desired position and dimension
2. better accomodate contents onto the dialog ?

[sigmarsson]

Just as a spin-off comment , for individuals this issue becomes exigent, may want to get a little familiar with the respective Infragistics control.
You can tailor this one's style to be an arbitrary dialog as custom window class.

[alexdi220]

Any updates? 2022 is coming but the ContentDialog (the rectangle with content) still can't measure width by content.

[alexdi220]

Pull request #5872

[Wufus]

Pull request #5872

The width of the ContentDialog does not change, only moves to the left.
UWP
Microsoft.NETCore.UniversalWindowsPlatform 6.2.13
Microsoft.UI.Xaml 2.7.0

Helps only set ContentDialogMaxWidth

[karthikraja-arumugam]

I'm still getting this issue, unable to set width, max-width, and padding properties of content dialog. Please fix this bug, ContentDialog has some good styles but these kinds of restrictions make it unusable.

[gwalschlager]

Yes, this is still an issue for me too. Adding a line like <x:Double x:Key="ContentDialogMaxWidth">1600</x:Double> to your App.xaml section is a workaround and dialog will set its width to the contents as long as contents are within that value. However, the dialog buttons at bottom become inordinately wide along with expanding to content width. A real solution is still needed.

[knightmeister]

Is this still on the radar, to have a functioning modal solution for a windowing operating system? It is absolutely insane that the implementation of ContentDialog is so broken that you cannot properly resize or reposition them. The current implementation works fine for a message box replacement but is absolutely unworkable for any other form of modal task (preferences window, data entry, etc).

I'm hopeful that this can be addressed soon.

[hartmape]

I tried several suggestions and the only thing that worked for me was setting the above mentioned double key in the resources of the content dialog itself. (It did not work in the App.xaml for me).

<ContentDialog.Resources>
      <x:Double x:Key="ContentDialogMaxWidth">1200</x:Double>
      <x:Double x:Key="ContentDialogMaxHeight">1000</x:Double>`
</ContentDialog.Resources>

[sigmarsson]

I wonder if it can be scheduled anywhere on the roadmap in 2022 : https://github.com/microsoft/WindowsAppSDK/blob/main/docs/roadmap.md
This year both 1.1 and 1.2 will be released.

The version 1.1 does not seem to aim fixing this ContentDialog issue as these are the areas on focus :

1. Apps can create multiple windows with WinUI3 content on the same UI thread.
2. Mica & Background Acrylic styles are available for WinUI 3 content.
3. Improved default and custom title bar with new functionalities like z-order, sizing/resizing, tall title bar, and extended show.
4. Apps using the Windows App SDK can run with elevated permissions.
5. Apps that deploy with all their dependencies together are now able to include the Windows App SDK as well. (self-contained deployment)
6. Apps can push notifications regardless of being packaged/unpackaged, or whether the app is published in the Store.
7. The environment variables PATH, and PATHEXT can be managed and tracked at runtime using new convenient APIs.
8. Apps can restart manually or register themselves to be restarted if it was running when a system update occurs.

[Padanian]

+1 for me too.
When ContentDialog is called from a Window with ExtendsContentIntoTitleBar = true , it is impossible to drag it around .

[jamorais]

Hi everyone. I also struggled with this a while ago and i don't remember where i saw this but this problem has been "solved" a while ago. This has to do with the order of resource loading.
By default when installing WinUI nuget or creating a new Windows App SDK project, the App.xaml file is like this:

<Application
    x:Class="App1.App"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:App1">
    <Application.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <XamlControlsResources xmlns="using:Microsoft.UI.Xaml.Controls" />
                <!-- Other merged dictionaries here -->
            </ResourceDictionary.MergedDictionaries>
            <!-- Other app resources here -->
        </ResourceDictionary>
    </Application.Resources>
</Application>

problem is when you put your
<x:Double x:Key="ContentDialogMaxWidth">9999</x:Double>
in the other app resources, somehow it gets loaded before the WinUI styles. and so it's ignored. To solve this, the WInUI team created a way to ensure their resources are loaded first and then yours so you can override them.

<Application
    x:Class="App1.App"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:controls="using:Microsoft.UI.Xaml.Controls"
    xmlns:local="using:App1" >
    <Application.Resources>
        <controls:XamlControlsResources>
            <controls:XamlControlsResources.MergedDictionaries>
                <ResourceDictionary>
                    <x:Double x:Key="ContentDialogMaxWidth">1000</x:Double>
                </ResourceDictionary>

            </controls:XamlControlsResources.MergedDictionaries>
        </controls:XamlControlsResources>
    </Application.Resources>
</Application>

Notice we now import the namespace
xmlns:controls="using:Microsoft.UI.Xaml.Controls"
and then our overrides go into a special "controls:XamlControlsResources"
This works flawlessly.

[wadeamaral]

I was struggling with this myself for a while, the recommended solution provided by @jamorais worked for me. Thank you!

[sigmarsson]

@jamorais does it work for an unpackaged or packaged application ? for me unpackaged and takes no effect.

[jamorais]

@jamorais does it work for an unpackaged or packaged application ? for me unpackaged and takes no effect.

@sigmarsson, never tried it on unpackaged....
i'll try and get back to you today.

[jamorais]

Hey @sigmarsson ,
it worked fine for me.
I attached my simple test.

test_unpackaged.zip

[sigmarsson]

@jamorais Thank you much for your time and effort.
Could you recommend an alternative control to replace cd ?

[jarlbrak]

Hi everyone. I also struggled with this a while ago and i don't remember where i saw this but this problem has been "solved" a while ago. This has to do with the order of resource loading. By default when installing WinUI nuget or creating a new Windows App SDK project, the App.xaml file is like this:

<Application
    x:Class="App1.App"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:App1">
    <Application.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <XamlControlsResources xmlns="using:Microsoft.UI.Xaml.Controls" />
                <!-- Other merged dictionaries here -->
            </ResourceDictionary.MergedDictionaries>
            <!-- Other app resources here -->
        </ResourceDictionary>
    </Application.Resources>
</Application>

problem is when you put your <x:Double x:Key="ContentDialogMaxWidth">9999</x:Double> in the other app resources, somehow it gets loaded before the WinUI styles. and so it's ignored. To solve this, the WInUI team created a way to ensure their resources are loaded first and then yours so you can override them.

<Application
    x:Class="App1.App"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:controls="using:Microsoft.UI.Xaml.Controls"
    xmlns:local="using:App1" >
    <Application.Resources>
        <controls:XamlControlsResources>
            <controls:XamlControlsResources.MergedDictionaries>
                <ResourceDictionary>
                    <x:Double x:Key="ContentDialogMaxWidth">1000</x:Double>
                </ResourceDictionary>

            </controls:XamlControlsResources.MergedDictionaries>
        </controls:XamlControlsResources>
    </Application.Resources>
</Application>

Notice we now import the namespace xmlns:controls="using:Microsoft.UI.Xaml.Controls" and then our overrides go into a special "controls:XamlControlsResources" This works flawlessly.

FYI, this is fixed in Windows App SDK 1.1.4

You can now go back to using this as you typically would:

<Application
    x:Class="App"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
    <Application.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <XamlControlsResources xmlns="using:Microsoft.UI.Xaml.Controls" />
                <ResourceDictionary>
                    <x:Double x:Key="ContentDialogMaxWidth">1000</x:Double>
                </ResourceDictionary>
            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>
    </Application.Resources>
</Application>

[TimKEviden]

An upgrade to 1.1.4 did not solve the problem.

I really do not get how this all works hopefully someone can help me and we can solve this.

What do we try to achieve by wrapping the Resource directories in this <controls:XamlControlsResources>?
Is it only to be sure that the WinUI resources are loaded before our resources?

Why do I need to state <XamlControlsResources xmlns="using:Microsoft.UI.Xaml.Controls" />
We did not use this until now but somehow now the application crashes if we do not use it.
We located the part which is responsible for the application crashing which are RadioMenuFlyoutItem items. If we comment those out the application works again and we can take a look at it.
Nevertheless the application is not styled correctly anymore (for example the buttons do not have correctly rounded corners anymore).
To me this seems like something is still wrong with loading order.

Thanks in advance guys!

[asierpn]

The only way we have found to change the ContentDialog width is overriding the default control template:

  <x:Double x:Key="ContentDialogMaxWidth">1200</x:Double>
  <x:Double x:Key="ContentDialogMaxHeight">756</x:Double>
  <Style TargetType="ContentDialog">
    <Setter Property="Foreground"
            Value="{ThemeResource ContentDialogForeground}" />
    <Setter Property="Background"
            Value="{ThemeResource ContentDialogBackground}" />
    <Setter Property="BorderThickness"
            Value="{ThemeResource ContentDialogBorderWidth}" />
    <Setter Property="BorderBrush"
            Value="{ThemeResource ContentDialogBorderBrush}" />
    <Setter Property="IsTabStop"
            Value="False" />
    <Setter Property="PrimaryButtonStyle"
            Value="{ThemeResource DefaultButtonStyle}" />
    <Setter Property="SecondaryButtonStyle"
            Value="{ThemeResource DefaultButtonStyle}" />
    <Setter Property="CloseButtonStyle"
            Value="{ThemeResource DefaultButtonStyle}" />
    <Setter Property="CornerRadius"
            Value="{ThemeResource OverlayCornerRadius}" />
    <Setter Property="Template">
      <Setter.Value>
        <ControlTemplate TargetType="ContentDialog">
          <Border x:Name="Container">
            <VisualStateManager.VisualStateGroups>
              <VisualStateGroup x:Name="DialogShowingStates">
                <VisualStateGroup.Transitions>
                  <VisualTransition To="DialogHidden">
                    <Storyboard>
                      <ObjectAnimationUsingKeyFrames Storyboard.TargetName="LayoutRoot"
                                                     Storyboard.TargetProperty="Visibility">
                        <DiscreteObjectKeyFrame KeyTime="0:0:0"
                                                Value="Visible" />
                      </ObjectAnimationUsingKeyFrames>
                      <ObjectAnimationUsingKeyFrames Storyboard.TargetName="LayoutRoot"
                                                     Storyboard.TargetProperty="IsHitTestVisible">
                        <DiscreteObjectKeyFrame KeyTime="0:0:0"
                                                Value="False" />
                      </ObjectAnimationUsingKeyFrames>
                      <DoubleAnimationUsingKeyFrames Storyboard.TargetName="ScaleTransform"
                                                     Storyboard.TargetProperty="ScaleX">
                        <DiscreteDoubleKeyFrame KeyTime="0:0:0"
                                                Value="1.0" />
                        <SplineDoubleKeyFrame KeyTime="{StaticResource ControlFastAnimationDuration}"
                                              KeySpline="{StaticResource ControlFastOutSlowInKeySpline}"
                                              Value="1.05" />
                      </DoubleAnimationUsingKeyFrames>
                      <DoubleAnimationUsingKeyFrames Storyboard.TargetName="ScaleTransform"
                                                     Storyboard.TargetProperty="ScaleY">
                        <DiscreteDoubleKeyFrame KeyTime="0:0:0"
                                                Value="1.0" />
                        <SplineDoubleKeyFrame KeyTime="{StaticResource ControlFastAnimationDuration}"
                                              KeySpline="{StaticResource ControlFastOutSlowInKeySpline}"
                                              Value="1.05" />
                      </DoubleAnimationUsingKeyFrames>
                      <DoubleAnimationUsingKeyFrames Storyboard.TargetName="LayoutRoot"
                                                     Storyboard.TargetProperty="Opacity">
                        <DiscreteDoubleKeyFrame KeyTime="0:0:0"
                                                Value="1.0" />
                        <LinearDoubleKeyFrame KeyTime="{StaticResource ControlFasterAnimationDuration}"
                                              Value="0.0" />
                      </DoubleAnimationUsingKeyFrames>
                    </Storyboard>
                  </VisualTransition>
                  <VisualTransition To="DialogShowing">
                    <Storyboard>
                      <ObjectAnimationUsingKeyFrames Storyboard.TargetName="LayoutRoot"
                                                     Storyboard.TargetProperty="Visibility">
                        <DiscreteObjectKeyFrame KeyTime="0:0:0"
                                                Value="Visible" />
                      </ObjectAnimationUsingKeyFrames>
                      <DoubleAnimationUsingKeyFrames Storyboard.TargetName="ScaleTransform"
                                                     Storyboard.TargetProperty="ScaleX">
                        <DiscreteDoubleKeyFrame KeyTime="0:0:0"
                                                Value="1.05" />
                        <SplineDoubleKeyFrame KeyTime="{StaticResource ControlNormalAnimationDuration}"
                                              KeySpline="{StaticResource ControlFastOutSlowInKeySpline}"
                                              Value="1.0" />
                      </DoubleAnimationUsingKeyFrames>
                      <DoubleAnimationUsingKeyFrames Storyboard.TargetName="ScaleTransform"
                                                     Storyboard.TargetProperty="ScaleY">
                        <DiscreteDoubleKeyFrame KeyTime="0:0:0"
                                                Value="1.05" />
                        <SplineDoubleKeyFrame KeyTime="{StaticResource ControlNormalAnimationDuration}"
                                              KeySpline="{StaticResource ControlFastOutSlowInKeySpline}"
                                              Value="1.0" />
                      </DoubleAnimationUsingKeyFrames>
                      <DoubleAnimationUsingKeyFrames Storyboard.TargetName="LayoutRoot"
                                                     Storyboard.TargetProperty="Opacity">
                        <DiscreteDoubleKeyFrame KeyTime="0:0:0"
                                                Value="0.0" />
                        <LinearDoubleKeyFrame KeyTime="{StaticResource ControlFasterAnimationDuration}"
                                              Value="1.0" />
                      </DoubleAnimationUsingKeyFrames>
                    </Storyboard>
                  </VisualTransition>
                </VisualStateGroup.Transitions>
                <VisualState x:Name="DialogHidden" />
                <VisualState x:Name="DialogShowing">
                  <VisualState.Setters>
                    <Setter Target="PrimaryButton.IsTabStop"
                            Value="True" />
                    <Setter Target="SecondaryButton.IsTabStop"
                            Value="True" />
                    <Setter Target="CloseButton.IsTabStop"
                            Value="True" />
                    <Setter Target="LayoutRoot.Visibility"
                            Value="Visible" />
                    <Setter Target="BackgroundElement.TabFocusNavigation"
                            Value="Cycle" />
                  </VisualState.Setters>
                </VisualState>
                <VisualState x:Name="DialogShowingWithoutSmokeLayer">
                  <VisualState.Setters>
                    <Setter Target="PrimaryButton.IsTabStop"
                            Value="True" />
                    <Setter Target="SecondaryButton.IsTabStop"
                            Value="True" />
                    <Setter Target="CloseButton.IsTabStop"
                            Value="True" />
                    <Setter Target="LayoutRoot.Visibility"
                            Value="Visible" />
                    <Setter Target="LayoutRoot.Background"
                            Value="{x:Null}" />
                  </VisualState.Setters>
                </VisualState>
              </VisualStateGroup>
              <VisualStateGroup x:Name="DialogSizingStates">
                <VisualState x:Name="DefaultDialogSizing" />
                <VisualState x:Name="FullDialogSizing">
                  <VisualState.Setters>
                    <Setter Target="BackgroundElement.VerticalAlignment"
                            Value="Stretch" />
                  </VisualState.Setters>
                </VisualState>
              </VisualStateGroup>
              <VisualStateGroup x:Name="ButtonsVisibilityStates">
                <VisualState x:Name="AllVisible">
                  <VisualState.Setters>
                    <Setter Target="FirstSpacer.Width"
                            Value="{ThemeResource ContentDialogButtonSpacing}" />
                    <Setter Target="SecondaryColumn.Width"
                            Value="*" />
                    <Setter Target="SecondaryButton.(Grid.Column)"
                            Value="2" />
                  </VisualState.Setters>
                </VisualState>
                <VisualState x:Name="NoneVisible">
                  <VisualState.Setters>
                    <Setter Target="CommandSpace.Visibility"
                            Value="Collapsed" />
                  </VisualState.Setters>
                </VisualState>
                <VisualState x:Name="PrimaryVisible">
                  <VisualState.Setters>
                    <Setter Target="PrimaryButton.(Grid.Column)"
                            Value="4" />
                    <Setter Target="SecondaryButton.Visibility"
                            Value="Collapsed" />
                    <Setter Target="CloseButton.Visibility"
                            Value="Collapsed" />
                  </VisualState.Setters>
                </VisualState>
                <VisualState x:Name="SecondaryVisible">
                  <VisualState.Setters>
                    <Setter Target="SecondaryButton.(Grid.Column)"
                            Value="4" />
                    <Setter Target="PrimaryButton.Visibility"
                            Value="Collapsed" />
                    <Setter Target="CloseButton.Visibility"
                            Value="Collapsed" />
                  </VisualState.Setters>
                </VisualState>
                <VisualState x:Name="CloseVisible">
                  <VisualState.Setters>
                    <Setter Target="PrimaryButton.Visibility"
                            Value="Collapsed" />
                    <Setter Target="SecondaryButton.Visibility"
                            Value="Collapsed" />
                  </VisualState.Setters>
                </VisualState>
                <VisualState x:Name="PrimaryAndSecondaryVisible">
                  <VisualState.Setters>
                    <Setter Target="SecondaryButton.(Grid.Column)"
                            Value="4" />
                    <Setter Target="CloseButton.Visibility"
                            Value="Collapsed" />
                  </VisualState.Setters>
                </VisualState>
                <VisualState x:Name="PrimaryAndCloseVisible">
                  <VisualState.Setters>
                    <Setter Target="SecondaryButton.Visibility"
                            Value="Collapsed" />
                  </VisualState.Setters>
                </VisualState>
                <VisualState x:Name="SecondaryAndCloseVisible">
                  <VisualState.Setters>
                    <Setter Target="PrimaryButton.Visibility"
                            Value="Collapsed" />
                  </VisualState.Setters>
                </VisualState>
              </VisualStateGroup>
              <VisualStateGroup x:Name="DefaultButtonStates">
                <VisualState x:Name="NoDefaultButton" />
                <VisualState x:Name="PrimaryAsDefaultButton">
                  <VisualState.Setters>
                    <Setter Target="PrimaryButton.Style"
                            Value="{StaticResource AccentButtonStyle}" />
                  </VisualState.Setters>
                </VisualState>
                <VisualState x:Name="SecondaryAsDefaultButton">
                  <VisualState.Setters>
                    <Setter Target="SecondaryButton.Style"
                            Value="{StaticResource AccentButtonStyle}" />
                  </VisualState.Setters>
                </VisualState>
                <VisualState x:Name="CloseAsDefaultButton">
                  <VisualState.Setters>
                    <Setter Target="CloseButton.Style"
                            Value="{StaticResource AccentButtonStyle}" />
                  </VisualState.Setters>
                </VisualState>
              </VisualStateGroup>
              <VisualStateGroup x:Name="DialogBorderStates">
                <VisualState x:Name="NoBorder" />
                <VisualState x:Name="AccentColorBorder">
                  <VisualState.Setters>
                    <Setter Target="BackgroundElement.BorderBrush"
                            Value="{ThemeResource SystemControlForegroundAccentBrush}" />
                  </VisualState.Setters>
                </VisualState>
              </VisualStateGroup>
            </VisualStateManager.VisualStateGroups>
            <Grid x:Name="LayoutRoot"
                  contract5Present:Visibility="Collapsed">
              <Rectangle x:Name="SmokeLayerBackground"
                         Fill="{ThemeResource ContentDialogSmokeFill}" />
              <Border x:Name="BackgroundElement"
                      Background="{TemplateBinding Background}"
                      FlowDirection="{TemplateBinding FlowDirection}"
                      BorderThickness="{TemplateBinding BorderThickness}"
                      BorderBrush="{TemplateBinding BorderBrush}"
                      BackgroundSizing="InnerBorderEdge"
                      CornerRadius="{TemplateBinding CornerRadius}"
                      MinWidth="{StaticResource ContentDialogMinWidth}"
                      MaxWidth="{StaticResource ContentDialogMaxWidth}"
                      MinHeight="{ThemeResource ContentDialogMinHeight}"
                      MaxHeight="{ThemeResource ContentDialogMaxHeight}"
                      HorizontalAlignment="Center"
                      VerticalAlignment="Center"
                      RenderTransformOrigin="0.5,0.5">
                <Border.RenderTransform>
                  <ScaleTransform x:Name="ScaleTransform" />
                </Border.RenderTransform>
                <Grid x:Name="DialogSpace"
                      CornerRadius="{ThemeResource OverlayCornerRadius}">
                  <Grid.RowDefinitions>
                    <RowDefinition Height="*" />
                    <RowDefinition Height="Auto" />
                  </Grid.RowDefinitions>
                  <ScrollViewer x:Name="ContentScrollViewer"
                                HorizontalScrollBarVisibility="Disabled"
                                VerticalScrollBarVisibility="Disabled"
                                ZoomMode="Disabled"
                                IsTabStop="False">
                    <Grid Background="{ThemeResource ContentDialogTopOverlay}"
                          Padding="{ThemeResource ContentDialogPadding}"
                          BorderThickness="{ThemeResource ContentDialogSeparatorThickness}"
                          BorderBrush="{ThemeResource ContentDialogSeparatorBorderBrush}">
                      <Grid.RowDefinitions>
                        <RowDefinition Height="Auto" />
                        <RowDefinition Height="*" />
                      </Grid.RowDefinitions>
                      <ContentControl x:Name="Title"
                                      Margin="{ThemeResource ContentDialogTitleMargin}"
                                      Content="{TemplateBinding Title}"
                                      ContentTemplate="{TemplateBinding TitleTemplate}"
                                      FontSize="20"
                                      FontFamily="{StaticResource ContentControlThemeFontFamily}"
                                      FontWeight="SemiBold"
                                      Foreground="{TemplateBinding Foreground}"
                                      HorizontalAlignment="Left"
                                      VerticalAlignment="Top"
                                      IsTabStop="False">
                        <ContentControl.Template>
                          <ControlTemplate TargetType="ContentControl">
                            <ContentPresenter Content="{TemplateBinding Content}"
                                              MaxLines="2"
                                              TextWrapping="Wrap"
                                              ContentTemplate="{TemplateBinding ContentTemplate}"
                                              Margin="{TemplateBinding Padding}"
                                              ContentTransitions="{TemplateBinding ContentTransitions}"
                                              HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                              VerticalAlignment="{TemplateBinding VerticalContentAlignment}" />
                          </ControlTemplate>
                        </ContentControl.Template>
                      </ContentControl>
                      <ContentPresenter x:Name="Content"
                                        ContentTemplate="{TemplateBinding ContentTemplate}"
                                        Content="{TemplateBinding Content}"
                                        FontSize="{StaticResource ControlContentThemeFontSize}"
                                        FontFamily="{StaticResource ContentControlThemeFontFamily}"
                                        Foreground="{TemplateBinding Foreground}"
                                        Grid.Row="1"
                                        TextWrapping="Wrap" />
                    </Grid>
                  </ScrollViewer>
                  <Grid x:Name="CommandSpace"
                        Grid.Row="1"
                        HorizontalAlignment="Stretch"
                        VerticalAlignment="Bottom"
                        XYFocusKeyboardNavigation="Enabled"
                        Padding="{ThemeResource ContentDialogPadding}"
                        Background="{TemplateBinding Background}">
                    <Grid.ColumnDefinitions>
                      <ColumnDefinition x:Name="PrimaryColumn"
                                        Width="*" />
                      <ColumnDefinition x:Name="FirstSpacer"
                                        Width="0" />
                      <ColumnDefinition x:Name="SecondaryColumn"
                                        Width="0" />
                      <ColumnDefinition x:Name="SecondSpacer"
                                        Width="{ThemeResource ContentDialogButtonSpacing}" />
                      <ColumnDefinition x:Name="CloseColumn"
                                        Width="*" />
                    </Grid.ColumnDefinitions>
                    <Button x:Name="PrimaryButton"
                            IsTabStop="False"
                            Content="{TemplateBinding PrimaryButtonText}"
                            IsEnabled="{TemplateBinding IsPrimaryButtonEnabled}"
                            Style="{TemplateBinding PrimaryButtonStyle}"
                            ElementSoundMode="FocusOnly"
                            HorizontalAlignment="Stretch" />
                    <Button x:Name="SecondaryButton"
                            IsTabStop="False"
                            Content="{TemplateBinding SecondaryButtonText}"
                            IsEnabled="{TemplateBinding IsSecondaryButtonEnabled}"
                            Style="{TemplateBinding SecondaryButtonStyle}"
                            ElementSoundMode="FocusOnly"
                            HorizontalAlignment="Stretch" />
                    <Button x:Name="CloseButton"
                            IsTabStop="False"
                            Grid.Column="4"
                            Content="{TemplateBinding CloseButtonText}"
                            Style="{TemplateBinding CloseButtonStyle}"
                            ElementSoundMode="FocusOnly"
                            HorizontalAlignment="Stretch" />
                  </Grid>
                </Grid>
              </Border>
            </Grid>
          </Border>
        </ControlTemplate>
      </Setter.Value>
    </Setter>
  </Style>

[Jimex]

My workaround as blow, instead of changing the width of the ContentDialog, I changed the with of the root element in the dialog.

<ContentDialog x:Class="Test.Views.Dialogs.TestDialog"
               xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
               xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
               xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
               xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
               mc:Ignorable="d">
    <ContentDialog.Resources>
        <Thickness x:Key="ContentDialogPadding">5,5,5,5</Thickness>
        <x:Double x:Key="ContentDialogMaxWidth">2000</x:Double>
        <x:Double x:Key="ContentDialogMaxHeight">2000</x:Double>
    </ContentDialog.Resources>
    <Grid x:Name="container" VerticalAlignment="Stretch">

 public TestDialog()
        {
            InitializeComponent();

            container.Width = App.StartupWindow.Bounds.Width * .8;
            container.Height = App.StartupWindow.Bounds.Height * .7;
        }

[soroshsabz]

ITNOA

Any update?!

this problem exist in latest WinUI 3 too.

[castorix]

Any update?!
this problem exist in latest WinUI 3 too.

ContentDialogMaxWidth works for me (Windows 10 22H2) since at least 1.1.0

[bluelaze]

hahh，i test a new method, is works for me
dialog.Resources["ContentDialogMaxWidth"] = 1080;

        private async void button_add_source_Click(object sender, RoutedEventArgs e)
        {
            ContentDialog dialog = new ContentDialog();

            // XamlRoot must be set in the case of a ContentDialog running in a Desktop app
            dialog.XamlRoot = this.XamlRoot;
            dialog.Title = "Add new source";
            dialog.PrimaryButtonText = "Add";
            dialog.CloseButtonText = "Cancel";
            dialog.DefaultButton = ContentDialogButton.Primary;
            dialog.Resources["ContentDialogMaxWidth"] = 1080;
            dialog.Content = new SourceInfoControl();

            var result = await dialog.ShowAsync();
        }

[MPITech]

dialog.Resources["ContentDialogMaxWidth"] = 1080;

Thank you SO much for this. This problem was driving me crazy. Works flawlessly in WinUI3, SDK 1.5.

[kaismic]

Any updates on this issue? I managed to make mine work using the above mentioned workarounds but I really would like to see this bug getting fixed.

[gordext]

I can't get this to work in a UWP project, if I use:

<ContentDialog.Resources>
<x:Double x:Key="ContentDialogMaxWidth">2000</x:Double>
<x:Double x:Key="ContentDialogMaxHeight">2000</x:Double>
</ContentDialog.Resources>

to change the maxwidth and define the ContentDialog in the xaml, it looks correct in the designer view but when I launch the app is just reverts back to the default maxwidth. I don't understand this.

update:
Ok I got it working by creating a new contentdialog class