DataGrid中的文本换行

本文关键字：换行 文本 DataGrid | 更新日期: 2023-09-27 18:20:14

目标

我有一个WPF应用程序，它在DataGrid中包含文本。我希望文本在每个单元格内换行。我还想为每列设置一个MinWidth，如果必须的话，ScrollViewer应该创建horizonatl滚动条。我从不希望任何单元格或DataGrid本身出现水平滚动条。如果用户调整窗口的大小，行应该增长或收缩以适应文本换行，但不应该让coulns变得太薄，以至于它们不再可读。

问题

现在，文本没有换行，因为它在滚动查看器中。我知道可以通过不同的方式更改此示例以使文本换行，但如上所述，我无法使其按照我想要的方式进行操作。

简化的xaml

<Window x:Class="SampleApp.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="clr-namespace:SampleApp"
    Title="App" Height="350" Width="525">
    <Window.Resources>
        <Style x:Key="WrappingTextBlock" TargetType="TextBlock">
            <Setter Property="TextWrapping" Value="Wrap"/>
        </Style>
        <Style x:Key="WrappingTextBox" TargetType="TextBox">
            <Setter Property="TextWrapping" Value="Wrap"/>
        </Style>
    </Window.Resources>
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>
        <Stuff ... />
        <MoreStuff ... />
        <Border Grid.Row="1" Grid.Column="1">
            <ScrollViewer>
                <StackPanel>    
                    <DataGrid HorizontalAlignment="Left" ItemsSource="{Binding AwesomeObject, Mode=TwoWay}" Margin="5" AutoGenerateColumns="False">
                        <DataGrid.Columns>
                            <DataGridTextColumn Header="#" Binding="{Binding Number, Mode=TwoWay}"/>
                            <DataGridTextColumn Header="Header" Binding="{Binding Data, Mode=TwoWay}"/>
                            <DataGridTextColumn MinWidth="50" Header="Long Text" Binding="{Binding SoMuchText, Mode=TwoWay}" ElementStyle="{StaticResource WrappingTextBlock}" EditingElementStyle="{StaticResource WrappingTextBox}"/>
                        </DataGrid.Columns>
                    </DataGrid>
                </StackPanel>
            </ScrollViewer>
        </Border>
    </Grid>
</Window>

DataGrid中的文本换行

尝试将列的宽度设置为"*"

 <Border Grid.Row="1" Grid.Column="1">
     <ScrollViewer>
         <StackPanel>
             <DataGrid HorizontalAlignment="Left" ItemsSource="{Binding AwesomeObject, Mode=TwoWay}" Margin="5" AutoGenerateColumns="False">
                 <DataGrid.Columns>
                     <DataGridTextColumn Width="10*" Header="#" Binding="{Binding Number, Mode=TwoWay}"/>
                     <DataGridTextColumn Width="10*" Header="Header" Binding="{Binding Data, Mode=TwoWay}"/>
                     <DataGridTextColumn Width="50*" Header="Long Text" Binding="{Binding SoMuchText, Mode=TwoWay}" ElementStyle="{StaticResource WrappingTextBlock}" EditingElementStyle="{StaticResource WrappingTextBox}"/>
                 </DataGrid.Columns>
             </DataGrid>
         </StackPanel>
     </ScrollViewer>
 </Border>

这意味着第1列的长度至少为10，并且正在增长这意味着第2列的长度至少为10，并且正在增长这意味着第3列的长度将至少为50，并且正在增长

您可以使用百分比（.Number*）或长度（Number*）调整*大小

您不需要将dataGrid放在scrollViewer中。。。您应该设置DataGrid的MAXWidth/Maxheighjt，这样scrollViewr（已经存在于DataGrid中）就会出现。。。。。。此外，如果您想要包装单元格文本

                <WPFToolkit:DataGrid Name="programListDataGrid"
                                     AutoGenerateColumns="False"
                                     CanUserAddRows="False"
                                     CanUserDeleteRows="False"
                                     CanUserReorderColumns="False"
                                     IsReadOnly="True"
                                     ItemsSource="{Binding Path=MyList}"
                                     RowStyle="{StaticResource ResourceKey=dataGridRowStyle}"
                                     SelectedItem="{Binding Path=MyItem,
                                                            Mode=TwoWay}"
                                     SelectionMode="Single">
                    <WPFToolkit:DataGrid.Columns>
                        <WPFToolkit:DataGridTextColumn MinWidth="100"
                                                       MaxWidth="250"
                                                       Binding="{Binding Path=ItemName}"
                                                       Header="Item Name" />
                        <WPFToolkit:DataGridTemplateColumn                                                                Width="*"
                                                           MinWidth="200"
                                                           Header="ItemData1">
                            <WPFToolkit:DataGridTemplateColumn.CellTemplate>
                                <DataTemplate>
                                    <TextBlock Text="{Binding ApplicationPath}"
                                               TextWrapping="Wrap"
                                               ToolTip="{Binding ItemData1}" />
                                </DataTemplate>
                            </WPFToolkit:DataGridTemplateColumn.CellTemplate>
                        </WPFToolkit:DataGridTemplateColumn>
                        <WPFToolkit:DataGridTemplateColumn                                                                Width="*"
                                                           MinWidth="200"
                                                           Header="ItemData2">
                            <WPFToolkit:DataGridTemplateColumn.CellTemplate>
                                <DataTemplate>
                                    <TextBlock Text="{Binding StandardCLP}"
                                               TextWrapping="Wrap"
                                               ToolTip="{Binding ItemData2}" />
                                </DataTemplate>
                            </WPFToolkit:DataGridTemplateColumn.CellTemplate>
                        </WPFToolkit:DataGridTemplateColumn>
                    </WPFToolkit:DataGrid.Columns>
                </WPFToolkit:DataGrid>

TextBlock将在空间消耗完后进行包装。。。我没有用ElementStyle尝试过这个，但也应该用那个。。所有宽度和高度仅用于演示，您应该根据需要使用onw值…：）

我的解决方案解决了希望使用Header文本换行的场景，并控制列的宽度。我使用内置的DataGridTextColumn，但为它提供了一个自定义的HeaderTemplate，我在其中控制文本的包装：

<DataGrid>
    <DataGrid.Columns>
        <DataGridTextColumn Header="Axle Group No."/> <!-- this stays with defaults -->
        <DataGridTextColumn Header="Axle Group Load Measured :(a)" MaxWidth="100"  ><!-- NOTE: MaxWidth and template below -->
            <DataGridTextColumn.HeaderTemplate>
                <DataTemplate>
                    <TextBlock Text="{Binding}" TextWrapping="Wrap" />
                </DataTemplate>
            </DataGridTextColumn.HeaderTemplate>
        </DataGridTextColumn>
        </DataGrid.Columns>
</DataGrid>

如果您也希望为数据单元格自定义文本换行，那么最好使用完全可自定义的列类型DataGridTemplateColumn。该类型允许您以类似于以下的方式指定HeaderTemplate或CellTemplate：

<DataGrid>
   <DataGrid.Columns>
      <DataGridTemplateColumn>
         <DataGridTemplateColumn.HeaderTemplate>
            <DataTemplate>
               <TextBlock Text="{Binding}" TextWrapping="Wrap" />
            </DataTemplate>
         </DataGridTemplateColumn.HeaderTemplate>
         <DataGridTemplateColumn.CellTemplate>
            <DataTemplate>
               <TextBlock Text="{Binding}" TextWrapping="Wrap" />
            </DataTemplate>
         </DataGridTemplateColumn.CellTemplate>
      </DataGridTemplateColumn>
   </DataGrid.Columns>
</DataGrid>
相关文章：