В WPF DataGrid 1 строка выглядит как 2 строки - PullRequest
0 голосов
/ 22 января 2020

обычно в DataGrid, в большинстве видов сетки есть что-то похожее на это .....

Name    Age     Sex    City
===========================
Tom     64      M      SF  
---------------------------
Sam     23      M      NY
---------------------------
Eva     18      F      LA

Но теперь моему боссу нужно, чтобы я отображал строки в 2 рядах, но на самом деле это все еще 1 строка, она должна выглядеть следующим образом .....

Name/Age         Sex/City
=========================
Tom                     M
64                     SF
-------------------------
Sam                     M
23                     NY
-------------------------
Eva                     F
18                     LA

Обратите внимание, что конечный результат ТАКЖЕ 3 строки, а не 6, так что чередующиеся цвета будут работать одинаково как прежде. Кроме того, я не могу изменить базовые данные, их структуру или модель. Мне разрешено только изменять представление (только часть пользовательского интерфейса).

Вот мой код XAML (как в обычной отдельной строке)

<DataGrid ItemsSource="{Binding Person}" >
    <DataGrid.Columns>
        <DataGridTextColumn Header="Name" Binding="{Binding Name}" />
        <DataGridTextColumn Header="Age" Binding="{Binding Age}" />
        <DataGridTextColumn Header="Sex" Binding="{Binding Sex}" />
        <DataGridTextColumn Header="City" Binding="{Binding City}" />
    </DataGrid.Columns>
</DataGrid>

Мне просто нужно, чтобы он выглядел двойным грести.

1 Ответ

2 голосов
/ 22 января 2020

Вы можете использовать две DataGridTemplateColumns с соответствующими CellTemplates:

<DataGrid ItemsSource="{Binding Persons}" AutoGenerateColumns="False">
    <DataGrid.Columns>
        <DataGridTemplateColumn Header="Name/Age">
            <DataGridTemplateColumn.CellTemplate>
                <DataTemplate>
                    <StackPanel>
                        <TextBlock Text="{Binding Name}"/>
                        <TextBlock Text="{Binding Age}"/>
                    </StackPanel>
                </DataTemplate>
            </DataGridTemplateColumn.CellTemplate>
        </DataGridTemplateColumn>
        <DataGridTemplateColumn Header="Sex/City">
            <DataGridTemplateColumn.CellTemplate>
                <DataTemplate>
                    <StackPanel>
                        <TextBlock Text="{Binding Sex}" TextAlignment="Right"/>
                        <TextBlock Text="{Binding City}" TextAlignment="Right"/>
                    </StackPanel>
                </DataTemplate>
            </DataGridTemplateColumn.CellTemplate>
        </DataGridTemplateColumn>
    </DataGrid.Columns>
</DataGrid>

или ListView с похожим столбцом CellTemplates:

<ListView ItemsSource="{Binding Persons}">
    <ListView.ItemContainerStyle>
        <Style TargetType="ListViewItem">
            <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
        </Style>
    </ListView.ItemContainerStyle>
    <ListView.View>
        <GridView>
            <GridView.Columns>
                <GridViewColumn Header="Name/Age">
                    <GridViewColumn.CellTemplate>
                        <DataTemplate>
                            <StackPanel>
                                <TextBlock Text="{Binding Name}"/>
                                <TextBlock Text="{Binding Age}"/>
                            </StackPanel>
                        </DataTemplate>
                    </GridViewColumn.CellTemplate>
                </GridViewColumn>
                <GridViewColumn Header="Sex/City">
                    <GridViewColumn.CellTemplate>
                        <DataTemplate>
                            <StackPanel>
                                <TextBlock Text="{Binding Sex}" TextAlignment="Right"/>
                                <TextBlock Text="{Binding City}" TextAlignment="Right"/>
                            </StackPanel>
                        </DataTemplate>
                    </GridViewColumn.CellTemplate>
                </GridViewColumn>
            </GridView.Columns>
        </GridView>
    </ListView.View>
</ListView>
...