2010-09-24 7 views
27

Existe-t-il un moyen de modifier le style de quadrillage dans la grille wpf? Je dois diviser la grille en 4 cellules. Pour ce faire, j'ai utilisé RowDefinitions et ColumnDefinitions. Cependant, j'ai besoin de l'utilisateur pour distinguer quelle cellule est qui, c'est pourquoi je dois changer la couleur des lignes de la grille.wpf gridlines - changer de style

Répondre

78

Cela dépend de l'apparence que vous recherchez. Dans WPF, il existe différentes façons de faire presque n'importe quoi. Voici quelques-uns des plus faciles.

Le plus simple est de définir ShowGridLines = « true »:

<Grid HorizontalAlignment="Stretch" 
      VerticalAlignment="Stretch" 
      Margin="5" 
      ShowGridLines="True"> 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition Width="*" /> 
      <ColumnDefinition Width="*" /> 
     </Grid.ColumnDefinitions> 

     <Grid.RowDefinitions> 
      <RowDefinition Height="*" /> 
      <RowDefinition Height="*" /> 
     </Grid.RowDefinitions> 

     <TextBlock Grid.Column="0" 
        Grid.Row="0" 
        Text="(0,0)" /> 
     <TextBlock Grid.Column="1" 
        Grid.Row="0" 
        Text="(1,0)" /> 
     <TextBlock Grid.Column="0" 
        Grid.Row="1" 
        Text="(0,1)" /> 
     <TextBlock Grid.Column="1" 
        Grid.Row="1" 
        Text="(1,0)" /> 
    </Grid> 

Cela vous donne la grille quelque chose comme:
alt text

Vous pouvez également utiliser un rectangle dans chaque cellule de la grille obtenir des effets différents. Ici, le remplissage est transparent et la course est bleu:

<Grid HorizontalAlignment="Stretch" 
     VerticalAlignment="Stretch" 
     Margin="5"> 
    <Grid.ColumnDefinitions> 
     <ColumnDefinition Width="*" /> 
     <ColumnDefinition Width="*" /> 
    </Grid.ColumnDefinitions> 

    <Grid.RowDefinitions> 
     <RowDefinition Height="*" /> 
     <RowDefinition Height="*" /> 
    </Grid.RowDefinitions> 

    <Rectangle Grid.Column="0" 
       Grid.Row="0" 
       Stroke="Blue" 
       Fill="Transparent" /> 
    <TextBlock Grid.Column="0" 
       Grid.Row="0" 
       Text="(0,0)" /> 
    <Rectangle Grid.Column="1" 
       Grid.Row="0" 
       Stroke="Blue" 
       Fill="Transparent" /> 
    <TextBlock Grid.Column="1" 
       Grid.Row="0" 
       Text="(1,0)" /> 
    <Rectangle Grid.Column="0" 
       Grid.Row="1" 
       Stroke="Blue" 
       Fill="Transparent" /> 
    <TextBlock Grid.Column="0" 
       Grid.Row="1" 
       Text="(0,1)" /> 
    <Rectangle Grid.Column="1" 
       Grid.Row="1" 
       Stroke="Blue" 
       Fill="Transparent" /> 
    <TextBlock Grid.Column="1" 
       Grid.Row="1" 
       Text="(1,0)" /> 
</Grid> 

qui produit ceci:
alt text

Alternativement, vous pouvez remplir le Rectangles et ne pas leur donner un AVC:

<Grid HorizontalAlignment="Stretch" 
      VerticalAlignment="Stretch" 
      Margin="5"> 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition Width="*" /> 
      <ColumnDefinition Width="*" /> 
     </Grid.ColumnDefinitions> 

     <Grid.RowDefinitions> 
      <RowDefinition Height="*" /> 
      <RowDefinition Height="*" /> 
     </Grid.RowDefinitions> 

     <Rectangle Grid.Column="0" 
        Grid.Row="0" 
        Fill="LightBlue" /> 
     <TextBlock Grid.Column="0" 
        Grid.Row="0" 
        Text="(0,0)" /> 
     <Rectangle Grid.Column="1" 
        Grid.Row="0" 
        Fill="LightYellow" /> 
     <TextBlock Grid.Column="1" 
        Grid.Row="0" 
        Text="(1,0)" /> 
     <Rectangle Grid.Column="0" 
        Grid.Row="1" 
        Fill="LightYellow" /> 
     <TextBlock Grid.Column="0" 
        Grid.Row="1" 
        Text="(0,1)" /> 
     <Rectangle Grid.Column="1" 
        Grid.Row="1" 
        Fill="LightBlue" /> 
     <TextBlock Grid.Column="1" 
        Grid.Row="1" 
        Text="(1,0)" /> 
    </Grid> 

Cela peut, par exemple, donner un motif en damier:
alt text

Ce n'est en aucun cas une réponse complète - vous pourriez probablement remplir un livre. C'était juste pour montrer qu'il y a plusieurs façons de faire ce que vous demandez, et qu'il y a des solutions assez rapides et faciles si c'est tout ce dont vous avez besoin.

+1

Ensuite, comment obtenez-vous des lignes de grille d'un pixel de large? –

+0

Mais cela fera les frontières intérieures ont la double largeur –

+6

@WonkotheSane: Cela ne fonctionnera pas. 'StrokeThickness' est un simple' double'. Pour obtenir quelque chose de similaire, utilisez un 'Border' au lieu d'un' Rectangle': ' ' –