内容对话框最大宽度

Question

我正在尝试创建一个类似于这样的应用程序设置菜单

我知道如何实现，但是我在内容对话框的宽度上遇到了问题，显然有一个宽度限制。

下面是我的内容对话框代码：

Title="" Margin="12,0,-12,0" HorizontalAlignment="Stretch" Width="800" Height="600" VerticalAlignment="Stretch" Background="{x:Null}">
<Grid x:Name="Main" ScrollViewer.VerticalScrollBarVisibility="Auto" Width="800">
    <Grid.RowDefinitions>
        <RowDefinition Height="58"/>
        <RowDefinition Height="58"/>
        <RowDefinition/>
        <RowDefinition Height="76"/>
    </Grid.RowDefinitions>
    <TextBox x:Name="Title_TextBox" Text="" Margin="10,10,10,0" PlaceholderText="Please enter your story title..." RequestedTheme="Light" FontSize="16" MaxLength="50" Grid.Row="1" />
    <TextBox x:Name="Experience_Text" Text="" Grid.Row="2" Margin="10,10,10,0"  PlaceholderText="Please tell your experience..." MaxLength="500" FontSize="16" TextWrapping="Wrap" MinHeight="42" AcceptsReturn="True" RequestedTheme="Light" ScrollViewer.VerticalScrollBarVisibility="Auto" VerticalAlignment="Center" Height="190" />
    <Grid x:Name="CharacterGrid" Grid.Row="3" Margin="10,0">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="48"/>
            <ColumnDefinition Width="64"/>
            <ColumnDefinition/>
        </Grid.ColumnDefinitions>
        <TextBlock x:Name="CharacterLeft" Margin="0" TextWrapping="Wrap" Text="" TextAlignment="Right" FontSize="16" Grid.Column="2" VerticalAlignment="Top" RequestedTheme="Light" />
        <Button x:Name="CameraButton" FontFamily="Segoe MDL2 Assets" Content="&#xE722;" Background="Transparent" VerticalAlignment="Top" Margin="0,5,0,0" HorizontalAlignment="Left" FontSize="21.333" RequestedTheme="Light" Width="48" Height="48"/>
    </Grid>
    <Grid x:Name="LocationGrid" Margin="10,10,10,0">
        <Grid.ColumnDefinitions>
            <ColumnDefinition/>
            <ColumnDefinition Width="48"/>
        </Grid.ColumnDefinitions>
        <TextBlock x:Name="LocText" Margin="0" TextWrapping="Wrap" Text="Location will be here...." FontSize="16" VerticalAlignment="Center" RequestedTheme="Light" TextAlignment="Center"/>
        <Button x:Name="LocationButton" FontFamily="Segoe MDL2 Assets" Content="&#xE81D;" Background="Transparent" VerticalAlignment="Center" Margin="0" HorizontalAlignment="Right"  FontSize="21.333" RequestedTheme="Light" Width="48" Height="48" Grid.Column="1"/>
    </Grid>
</Grid>

- Louay Sleman

---

你遇到了关于宽度的什么问题？ - NSNoob

@NSNoob，宽度有限制。 - Louay Sleman

我不知道这个开发者是否使用内容对话框。 - Louay Sleman

抱歉，我不确定我理解了您的第二条评论？ 我假设您的意思是在内容对话框中有一个最大宽度限制，您正在尝试覆盖它并且不知道是否可能？ - NSNoob

@NSNoob 你抓住我了。 - Louay Sleman

Answer 1

在你的 App.xaml 中，尝试将 ContentDialogMaxWidth 设置为例如 800。默认值为 548。您可能还需要增加高度。

<Application.Resources>
    <x:Double x:Key="ContentDialogMaxWidth">800</x:Double>
    <x:Double x:Key="ContentDialogMaxHeight">756</x:Double>
</Application.Resources>

- Justin XL

Answer 2

只需在initialize component之后添加此代码。

this.width = Window.Current.Bounds.Width;

内容对话框将获取您的屏幕宽度

- user9563406

Answer 3

不要这样，最好你单独设计ContentDialogs，然后将其添加到Content Dialog XAML中：

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

现在你可以为你的ContentDialogs设置任何大小了 :)

- Raiden Core

Answer 4

我只需要在初始化组件后添加这段代码即可。

this.width = Window.Current.Bounds.Width;

并且内容对话框将获得您的屏幕宽度。感谢大家，希望这能帮助任何需要搜索的人！

- Louay Sleman

Answer 5

除了现有的解决方案之外，如果有人想要在保持默认的WinUI样式（也许是UWP，不确定）的同时增加自定义内容对话框的宽度，可以在自定义内容对话框的XAML文件中进行以下操作：

<ContentDialog.Resources>
    <!--ContentDialog style inheritance; Issue : https://github.com/microsoft/microsoft-ui-xaml/issues/6154-->
    <Style TargetType="local:CustomContentDialogName" BasedOn="{StaticResource DefaultContentDialogStyle}"/>

    <!-- Overriding ContentDialogMaxWidth value -->
    <x:Double x:Key="ContentDialogMaxWidth">1200</x:Double>
</ContentDialog.Resources>

- Nathan Quellec