Um im Grid die Reihen und Spalten skalierbar zu gestalten, gibt es in WPF den GridSplitter.
Hierzu zuerst die normale Definition der Spalten und Reihen wie gewohnt mit:
1 2 3 4 5 6 7 8 9 10 11 12 | <Grid> <Grid.ColumnDefinitions> <ColumnDefinition /> <ColumnDefinition /> <ColumnDefinition /> </Grid.ColumnDefinitions> <Grid.RowDefinitions> <RowDefinition /> <RowDefinition /> <RowDefinition /> </Grid.RowDefinitions> |
Dann setzen wir ein paar Buttons in die einzelnen Felder
1 2 3 4 5 6 7 8 9 10 11 | <Button Grid.Column="0" Grid.Row="0"> Btn 1</Button> <Button Grid.Column="0" Grid.Row="1"> Btn 2</Button> <Button Grid.Column="0" Grid.Row="2"> Btn 3</Button> <Button Grid.Column="1" Grid.Row="0"> Btn 4</Button> <Button Grid.Column="1" Grid.Row="1"> Btn 5</Button> <Button Grid.Column="1" Grid.Row="2"> Btn 6</Button> <Button Grid.Column="2" Grid.Row="0"> Btn 7</Button> <Button Grid.Column="2" Grid.Row="1"> Btn 8</Button> <Button Grid.Column="2" Grid.Row="2"> Btn 9</Button> |
Und nun die eigentliche Skalierbarkeit.
Bitte achte darauf das die Höhe und die Breite mit angegeben wird, denn in meinem Test hier, ist genau aus diesem Grund zuerst irgendwas schief gelaufen…
Naja Übung macht bekanntlich den Meister ; )
1 2 3 4 5 | <GridSplitter Width="3" Grid.Column="0" Grid.Row="0" Grid.RowSpan="3" ResizeDirection="Columns" /> <GridSplitter Width="3" Grid.Column="1" Grid.Row="0" Grid.RowSpan="3" ResizeDirection="Columns" /> <GridSplitter Height="3" Grid.Column="0" Grid.Row="0" Grid.ColumnSpan="3" ResizeDirection="Rows" HorizontalAlignment="Stretch" VerticalAlignment="Bottom" /> <GridSplitter Height="3" Grid.Column="0" Grid.Row="1" Grid.ColumnSpan="3" ResizeDirection="Rows" HorizontalAlignment="Stretch" VerticalAlignment="Bottom" /> |
Grid beenden
1 | </Grid> |
fertig : )
