在 Material Design 中使用 datagrind 允许行增长和文本换行

Question

I am struggling to find how I can have my rows expand in a data grid using material design. Basically if a cell become full I need the string to wrap in the cell and allow the row to expand to fit this. The data is pulled in from a SQL database and thus this is the XAML I currently have;

<DataGrid x:Name="tblProcesses" AutoGenerateColumns="False" CanUserAddRows="True"
        BorderThickness="1" BorderBrush="{DynamicResource PrimaryHueMidBrush}" DockPanel.Dock="Top">

    <DataGrid.Columns>
        <DataGridTextColumn Binding="{Binding order, UpdateSourceTrigger=PropertyChanged}" ClipboardContentBinding="{x:Null}" Header="Order" Width="80"/>
        <DataGridTextColumn Binding="{Binding title, UpdateSourceTrigger=PropertyChanged}" ClipboardContentBinding="{x:Null}" Header="Process" Width="*"/>
        <DataGridTextColumn Binding="{Binding description, UpdateSourceTrigger=PropertyChanged}" ClipboardContentBinding="{x:Null}" Header="Description" Width="2*"/>
        <DataGridTextColumn Binding="{Binding imageURL, UpdateSourceTrigger=PropertyChanged}" ClipboardContentBinding="{x:Null}" Header="Image URL" Width="100"/>
        <DataGridTextColumn Binding="{Binding timeTaken, UpdateSourceTrigger=PropertyChanged}" ClipboardContentBinding="{x:Null}" Header="Time Taken" Width="100"/>
    </DataGrid.Columns>
                    
</DataGrid>

Also if the way I bind the data the most effective way? It is working as I expect it (minus the text wrapping), however I wanted to see how the pros would tackle this.

Answer 1

You can do this and specify ElementStyle for specific column.

<DataGrid.Columns>               
    <DataGridTextColumn Header="Wrapped & centered" Binding="{Binding field}">
        <DataGridTextColumn.ElementStyle>
             <Style>                            
                 <Setter Property="TextBlock.TextWrapping" Value="Wrap" />
                 <Setter Property="TextBlock.TextAlignment" Value="Center"/>
             </Style>
         </DataGridTextColumn.ElementStyle>
    </DataGridTextColumn>
</DataGrid.Columns>  

Or you can do this by defining the style in window resource.

<Window.Resources>
    <Style TargetType="{x:Type TextBlock}" x:Key="WrapText">
        <Setter Property="TextWrapping" Value="Wrap"/>
    </Style>
</Window.Resources>

<DataGrid.Columns>
    <DataGridTextColumn IsReadOnly="False" Header="Address" 
     Binding="{Binding Address}" ElementStyle="{StaticResource WrapText}" Width="150"/>
</DataGrid.Columns>  

It will wrap the content of cell instead of cutting or clipping it.