Create a wider UWP ContentDialog

Question

I'm creating a UWP app that will only run on widescreen kiosk systems only (so I don't need to worry about how the layout might scale down to a phone, etc).

I'm trying to use ContentDialog to create popup dialogs on top of the main one. The problem I'm encountering is that the ContentDialog appears to have a fixed maximum width that of 550 pixels on a 1920x1080 which makes relatively poor use of the screen in the best of cases and will cut off content (or force the unnecessary use of a ScrollViewer container) in others.

I've tried setting eg Width="600" on both the ContentDialog and whatever container is being used on for the content (StackPanel or Grid). When I do that to the ContentDialog itself the width remains unaffected but larger values displace it off the center of the screen. On the content it causes the content to attempt to extend itself beyond the right edge of the ContentDialog and get cut off.

Changing MinWidth and MaxWidth were equally ineffective.

How can I either force the ContentDialog to take up a wider portion of the screen, or replace it with a more flexible alternative?

<ContentDialog 
    x:Name="passCodeContentDialog">
    <ContentDialog.TitleTemplate>
        <DataTemplate>
            <Grid >
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="130"/>
                    <ColumnDefinition Width="230"/>
                    <ColumnDefinition Width="130"/>
                </Grid.ColumnDefinitions>
                <TextBlock Grid.Column="1" x:Uid="PgVgWizardInfoTitle" Text="Title" HorizontalAlignment="Center"/>
                <Button Grid.Column="2" Content="Close" HorizontalAlignment="Right"/>
            </Grid>
        </DataTemplate>
    </ContentDialog.TitleTemplate>
    <StackPanel >
        <TextBlock Text="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent at mi varius, viverra enim vehicula, pharetra metus. Phasellus ipsum lacus, porttitor consectetur lectus id, pharetra luctus leo. Fusce vitae elit et augue varius porttitor vitae eget lectus. Duis mauris tortor, faucibus eget ultricies a, porta ac arcu. Quisque in arcu cursus, sagittis lorem ut, posuere augue. Donec eu pharetra sapien. Cras eu pharetra lectus, eget condimentum purus." TextWrapping="Wrap" Margin="0,0,0,10"/>
        <TextBlock Text="Phasellus tincidunt ultricies lobortis. Sed laoreet ullamcorper metus, quis efficitur ante venenatis quis. Ut gravida id risus ut pharetra. Integer cursus eros ex, sit amet luctus lacus commodo at. Donec nec tellus ornare, lacinia ex non, maximus tellus. Vestibulum dui dolor, malesuada in ex quis, faucibus luctus justo. Mauris ac augue non velit tempor porttitor in sollicitudin purus. Integer accumsan condimentum ipsum, sit amet cursus ipsum fermentum nec. Praesent ac viverra sapien. Maecenas accumsan vel libero et fringilla. Pellentesque porta, dui vitae efficitur imperdiet, lectus nunc ultricies mi, non consectetur mauris leo sit amet orci. Ut dictum pellentesque lacus vel vulputate. Etiam urna massa, scelerisque ac odio eget, sodales euismod ipsum. Sed porta diam nulla, in facilisis nisl aliquet eu. Proin commodo interdum pellentesque." TextWrapping="Wrap" Margin="0,0,0,10"/>
        <TextBlock Text="Phasellus at luctus justo. Donec quis consectetur nisi. Ut vitae eros consectetur, pharetra risus condimentum, aliquam quam. Maecenas fermentum leo quis odio efficitur auctor. Ut ex purus, porttitor ac tortor in, dignissim tempor magna. Quisque lectus tortor, viverra id tellus eget, porta varius orci. Nulla facilisi. Fusce pulvinar massa vitae justo sollicitudin lobortis. Vestibulum volutpat bibendum eros et sollicitudin. Nunc non condimentum turpis. Donec nec ipsum convallis, dignissim eros in, dictum magna. Quisque pulvinar tellus justo, non condimentum orci porta a. Duis quis dolor molestie, varius orci quis, convallis nisl. Phasellus nec nisl id tortor gravida fermentum eget sit amet risus." TextWrapping="Wrap" Margin="0,0,0,10"/>
        <TextBlock Text="Cras venenatis faucibus fringilla. Maecenas quis felis condimentum, ultricies diam sed, tincidunt elit. Suspendisse ultricies sapien vitae dolor dictum ullamcorper. Aliquam tristique justo maximus semper pellentesque. Maecenas eget dapibus arcu. Morbi imperdiet nisi a varius scelerisque. Proin convallis enim at fermentum ultrices. Sed nec molestie arcu, non egestas nibh. In a sollicitudin diam. Fusce ut facilisis nisl. Maecenas ut metus quis quam aliquam dignissim. Ut at pretium justo. Ut molestie mi at ex porttitor gravida. Nam nec ipsum turpis. Nam malesuada neque vitae nibh scelerisque, at iaculis felis pretium." TextWrapping="Wrap" Margin="0,0,0,10"/>
        <TextBlock Text="Curabitur vel commodo risus. Praesent vitae laoreet erat. In et euismod metus. Vivamus ipsum tortor, tincidunt eu viverra sed, tincidunt et velit. Vestibulum efficitur, neque eget ultricies vulputate, nisi nulla mattis sem, sit amet suscipit elit ante non mauris. Cras maximus mauris vel nulla hendrerit, et vulputate metus tristique. Morbi leo diam, eleifend et risus et, mollis sodales velit. Phasellus pretium dui sit amet nibh maximus, et viverra erat iaculis. Ut convallis sit amet enim a porta. Vivamus hendrerit lorem nec magna porta interdum ac at lorem. Sed lorem diam, vulputate ut dui a, ultrices bibendum eros. Phasellus dignissim ex quis augue semper sagittis. Nullam eu lorem rhoncus, commodo massa eget, gravida metus. Nam ultricies purus leo, malesuada fermentum nulla malesuada dapibus. Etiam feugiat posuere quam, ultricies ultrices nunc euismod at. " TextWrapping="Wrap" Margin="0,0,0,10"/>
    </StackPanel>
</ContentDialog>

Answer 1

How can I either force the ContentDialog to take up a wider portion of the screen, or replace it with a more flexible alternative?

The default max width of ContentDialog is 548 pixels. If you want to use more wider ContentDialog, you could use ContentDialogMaxWidth XAML theme resources in your in your Application Resources like the following.

<Application
    x:Class="FileAccessTest.App"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:FileAccessTest"
    RequestedTheme="Light">
    <Application.Resources>
        <ResourceDictionary>
            <x:Double x:Key="ContentDialogMaxWidth">1000</x:Double>
        </ResourceDictionary>
    </Application.Resources>
</Application>

For more you could refer ContentDialog styles and templates.