如何将 XAML 视图中网格的最大宽度设置为最大对话框宽度？

Question

我在Prism framework 的顶部有一个使用 C# 编写的 WPF 项目。

按下时我有一个按钮，我使用InteractionRequest 来显示一个对话框。此对话框的视图宽度为 550。

视图是用网格设计的，我希望网格的宽度也为 550，这是对话框的最大宽度。

但是，当列中的文本很长时，网格似乎总是比对话框拉伸得更多。

这是一个可以更好地解释视觉问题的屏幕截图

图中第一行代表title，第二行代表description

这是呈现此对话框/视图的 XAML 代码

<UserControl x:Class="Modules.Register.Views.RecallTransactionView"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             xmlns:local="clr-namespace:Modules.Register.Views"
             xmlns:fa="http://schemas.fontawesome.io/icons/"
             xmlns:materialDesign="http://materialdesigninxaml.net/winfx/xaml/themes"
             xmlns:prism="http://prismlibrary.com/"
             prism:ViewModelLocator.AutoWireViewModel="True"
             TextElement.Foreground="{DynamicResource MaterialDesignBody}"
             TextElement.FontWeight="Regular"
             TextElement.FontSize="14"
             TextOptions.TextFormattingMode="Ideal"
             TextOptions.TextRenderingMode="Auto"
             mc:Ignorable="d" 
             Width="550">

    <Grid Width="550" >

        <DataGrid ItemsSource="{Binding Dialog.SavedTransactions}"
                  AutoGenerateColumns="False"
                  IsReadOnly="True"
                  HorizontalAlignment="Stretch"
                  VerticalAlignment="Top"
                  CanUserAddRows="False"
                  VerticalContentAlignment="Center"
                  HorizontalContentAlignment="Stretch"
                  CellStyle="{StaticResource CenterDataGridCell}">

            <DataGrid.Columns>

                <DataGridTemplateColumn>
                    <DataGridTemplateColumn.CellTemplate>
                        <DataTemplate>
                            <StackPanel>
                                <TextBlock Text="{Binding Title}" TextWrapping="Wrap" />
                                <TextBlock Text="{Binding Description}" TextWrapping="Wrap" />
                            </StackPanel>
                        </DataTemplate>
                    </DataGridTemplateColumn.CellTemplate>
                </DataGridTemplateColumn>

                <DataGridTemplateColumn>
                    <DataGridTemplateColumn.CellTemplate>
                        <DataTemplate>
                            <Button VerticalAlignment="Center"
                                    Command="{Binding RelativeSource={RelativeSource AncestorType={x:Type DataGrid}}, 
                                                      Path=DataContext.SelectTransaction}"
                                    CommandParameter="{Binding}">

                                <StackPanel Orientation="Horizontal">
                                    <fa:FontAwesome Icon="Eye"
                                                    FontSize="18" />

                                    <TextBlock Text="Recall"
                                               Padding="7 0 0 0" />
                                </StackPanel>
                            </Button>
                        </DataTemplate>
                    </DataGridTemplateColumn.CellTemplate>
                </DataGridTemplateColumn>

            </DataGrid.Columns>
        </DataGrid>

    </Grid>
</UserControl>

您可以看到Title 和Description 都有TextWrapping="Wrap"，但由于某种原因它没有换行。

我基本上是在尝试删除水平滚动条但强制文本换行。我该如何解决这个问题？

Answer 1

您需要将第一个网格列的宽度设置为 '*'

            <DataGridTemplateColumn Width="*">
                <DataGridTemplateColumn.CellTemplate>
                    <DataTemplate>
                        <StackPanel>
                            <TextBlock Text="{Binding Title}" TextWrapping="Wrap" />
                            <TextBlock Text="{Binding Description}" TextWrapping="Wrap" />
                        </StackPanel>
                    </DataTemplate>
                </DataGridTemplateColumn.CellTemplate>
            </DataGridTemplateColumn>