Spanning un enregistrement sur plusieurs lignes dans DataGrid WPF Toolkit

Question

Est-il possible de style DataGrid de WPF Toolkit afin qu'un enregistrement de données peut s'étendre sur plusieurs lignes. Example screen shot à partir d'un contrôle commercial.

Merci,
Ben

Answer 1

Il est impossible avec le DataGrid boîte à outils ou GridView pour un ListView, non.

Cependant vous pouvez avoir la chance avec votre propre mise en œuvre, comme je l'ai récemment découvert que vous pouvez utiliser GridViewHeaderRowPresenter (MSDN reference), définissez la propriété Columns aux colonnes que vous voulez: qui vous donnera une ligne d'en-tête.

Ensuite, vous pouvez utiliser GridViewRowPresenter (MSDN reference), l'attacher à la même collection et Columns le tour est joué, vos colonnes dans les lignes et en-tête sera lié (redimensionner l'en-tête, les colonnes changent).

Voir ici pour un bon exemple:

http://msdn.microsoft.com/en-us/library/ms752313.aspx

Afin d'obtenir l'effet empilé, vous pouvez créer un ListView ou ListBox, et pour chaque article que vous sortie une paire empilée verticalement de contrôles GridViewRowPresenter, chacun étant lié à une collection de colonnes séparée. Ensuite, dans votre propre en-tête personnalisé (juste au-dessus du contrôle), vous feriez la même chose avec une paire de contrôles GridViewHeaderRowPresenter.

Vous pouvez ensuite ajouter d'autres bits que vous souhaitez, par exemple le texte/l'étiquette qu'ils ont dans votre capture d'écran.

Aucune raison pour que cela ne fonctionne pas. Ce n'est pas une solution pré-construite mais c'est possible avec un codage propre, ce n'est pas un hack, et vous avez un contrôle complet sur son apparence et son fonctionnement! Ajouter du tri et ainsi de suite est assez facile aussi, MSDN en a un exemple.

Espérons que cela vous aide - plus de questions sur les détails de ceci s'il vous plaît ajouter un commentaire ici!

Answer 2

Il semblerait que le contrôle de cette capture d'écran crée l'illusion d'une largeur de ligne en divisant les cellules de chaque colonne à droite de l'image en plusieurs lignes. Peut-être pourriez-vous obtenir l'effet d'échelle de rang que vous recherchez de la même manière.

<tk:DataGrid AutoGenerateColumns="False"> 
    <tk:DataGrid.Columns> 
     <tk:DataGridTextColumn Header="ID" Binding="{Binding ID}" /> 
     <tk:DataGridTemplateColumn Header="Photo"> 
      <tk:DataGridTemplateColumn.CellTemplate> 
       <DataTemplate> 
        <Image Source="{Binding Photo}" /> 
       </DataTemplate> 
      </tk:DataGridTemplateColumn.CellTemplate> 
     </tk:DataGridTemplateColumn> 
     <tk:DataGridTemplateColumn> 
      <tk:DataGridTemplateColumn.Header> 
       <Grid> 
        <Grid.RowDefinitions> 
         <RowDefinition /> 
         <RowDefinition /> 
        </Grid.RowDefinitions> 
        <TextBlock Grid.Row="0">FirstName</TextBlock> 
        <TextBlock Grid.Row="1">LastName</TextBlock> 
       </Grid> 
      </tk:DataGridTemplateColumn.Header> 
      <tk:DataGridTemplateColumn.CellTemplate> 
       <DataTemplate> 
        <Grid> 
         <Grid.RowDefinitions> 
          <RowDefinition /> 
          <RowDefinition /> 
         </Grid.RowDefinitions> 
         <TextBlock Grid.Row="0" Text="{Binding FirstName}" /> 
         <TextBlock Grid.Row="1" Text="{Binding LastName}" /> 
        </Grid> 
       </DataTemplate> 
      </tk:DataGridTemplateColumn.CellTemplate> 
     </tk:DataGridTemplateColumn> 
    </tk:DataGrid.Columns> 
</tk:DataGrid>