Cosa significa esattamente la stella in termini di dimensioni in WPF?
Cosa significa esattamente la stella in termini di dimensioni in WPF?
Risposte:
In una griglia WPF, Width="*"
o Height="*"
indica il dimensionamento proporzionale.
Ad esempio: per dare il 30% alla colonna 1 e il 70% alla colonna 2 -
<ColumnDefinition Width="3*" />
<ColumnDefinition Width="7*" />
E allo stesso modo per le righe -
<RowDefinition Height="3*" />
<RowDefinition Height="7*" />
I numeri non devono essere numeri interi.
Se la larghezza per RowDefinition (altezza per ColumnDefinition) viene omessa, 1 * è implicito.
In questo esempio, la colonna 1 è 1,5 volte più larga della colonna 2 -
<ColumnDefinition Width="1.5*" />
<ColumnDefinition />
È possibile combinare larghezze fisse e adattamento automatico con larghezze * (proporzionali); in tal caso le colonne * vengono ripartite al resto dopo aver calcolato l'adattamento automatico e le larghezze fisse -
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" /> <!-- Auto-fit to content, 'Hi' -->
<ColumnDefinition Width="50.5" /> <!-- Fixed width: 50.5 device units) -->
<ColumnDefinition Width="69*" /> <!-- Take 69% of remainder -->
<ColumnDefinition Width="31*"/> <!-- Take 31% of remainder -->
</Grid.ColumnDefinitions>
<TextBlock Text="Hi" Grid.Column="0" />
Se hai 2 colonne come questa:
<ColumnDefinition Width="10*"/>
<ColumnDefinition Width="*"/>
significa che la prima colonna è 10 volte più larga della seconda. È come dire "10 parti colonna 1 e 1 parte colonna 2."
La cosa interessante di questo è che le tue colonne verranno ridimensionate proporzionalmente. Altre opzioni sono:
//Take up as much space as the contents of the column need
<ColumnDefinition Width="Auto"/>
//Fixed width: 100 pixels
<ColumnDefinition Width="100"/>
Spero che aiuti!
prendiamo il seguente esempio .....
una griglia e ha 3 colonne e ciascuna contiene un pulsante di dimensione 100.
Il codice XAML è ...
<Grid x:Name="LayoutRoot" Width="600">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="3*" />
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Button Content="Button" Height="23" HorizontalAlignment="Left" Margin="10,10,0,0" Name="button1" VerticalAlignment="Top" Width="100" />
<Button Content="Button1" Height="23" HorizontalAlignment="Left" Margin="0,10,0,0" Name="button2" VerticalAlignment="Top" Width="100" Grid.Column="1" />
<Button Content="Button2" Height="23" HorizontalAlignment="Left" Margin="0,10,0,0" Name="button3" VerticalAlignment="Top" Width="100" Grid.Column="2" />
</Grid>
Ma in realtà la sua dimensione è ...
<Grid.ColumnDefinitions>
<ColumnDefinition Width="375" />
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="125" />
</Grid.ColumnDefinitions>
Conclusione:
La dimensione totale della griglia è 600
"Auto": la colonna viene ridimensionata con il contenuto. (La seconda colonna ha un pulsante di larghezza 100)
"*": La larghezza della prima colonna è 3 volte la terza colonna.