2010-09-24 11 views
27

C'è un modo per cambiare lo stile delle griglie nella griglia wpf? Ho bisogno di dividere la griglia in 4 celle. Per farlo ho usato RowDefinitions e ColumnDefinitions. Tuttavia ho bisogno di un utente per distinguere quale cella è quale, ecco perché ho bisogno di cambiare il colore delle griglie.linee griglia wpf - cambio stile

risposta

78

Dipende dall'aspetto che si sta cercando. In WPF ci sono diversi modi per fare quasi tutto. Qui ci sono un paio di quelli più facili.

Il modo più semplice è quello di impostare 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> 

Che ti dà griglia di qualcosa di simile a:
alt text

È inoltre possibile utilizzare un rettangolo in ogni cella della griglia per ottenere effetti diversi. Qui, il riempimento è trasparente e la corsa è Blue:

<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> 

che produce questo:
alt text

In alternativa, è possibile riempire i rettangoli e non dare loro una corsa:

<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> 

Ciò può, ad esempio, dare un motivo a scacchiera:
alt text

Questa non è affatto una risposta esauriente - potresti probabilmente riempire un libro. Volevo solo dimostrare che ci sono molti modi per fare quello che stai chiedendo, e che ci sono alcune soluzioni piuttosto semplici e veloci se è tutto ciò che serve.

+1

Quindi, come si ottengono le linee griglia con un pixel di larghezza? –

+0

Ma questo farà sì che i bordi interni abbiano la doppia larghezza –

+6

@WonkotheSane: Ciò non funzionerà. 'StrokeThickness' è un semplice' double'. Per ottenere qualcosa di simile, usa un 'Border' invece di un' Rectangle': ' ' –