web-dev-qa-db-fra.com

Que fait l'étoile WPF (largeur = "100 *")

Que signifie exactement l'étoile en termes de taille dans WPF?

wpfxamlgridsize
102
Shimmy

Dans une grille WPF, Width="*" ou Height="*" _ signifie dimensionnement proportionnel.
Par exemple: donner 30% à la colonne 1 et 70% à la colonne 2 -

<ColumnDefinition Width="3*" />
<ColumnDefinition Width="7*" />

enter image description here

Et de même pour les lignes -

<RowDefinition Height="3*" />
<RowDefinition Height="7*" />

Les nombres ne doivent pas nécessairement être des nombres entiers.
Si la largeur pour RowDefinition (Height pour ColumnDefinition) est omise, 1 * est impliqué.
Dans cet exemple, la colonne 1 est 1,5 fois plus large que la colonne 2 -

<ColumnDefinition Width="1.5*" />
<ColumnDefinition />

Column 1: 1.5*, Column 2 1* (implied)

Vous pouvez mélanger des largeurs ajustées et fixes avec des largeurs * (proportionnelles); dans ce cas, les * colonnes sont réparties dans le reste après le calcul des largeurs d'ajustement automatique et fixe -

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

enter image description here

225
Edward

Si vous avez 2 colonnes comme ceci:

<ColumnDefinition Width="10*"/>
<ColumnDefinition Width="*"/>

cela signifie que la première colonne est 10 fois plus large que la seconde. C'est comme dire "10 parties de colonne 1 et 1 partie de colonne 2."

La bonne chose à ce sujet est que vos colonnes seront redimensionnées proportionnellement. Les autres options sont:

//Take up as much space as the contents of the column need
<ColumnDefinition Width="Auto"/>
//Fixed width: 100 pixels
<ColumnDefinition Width="100"/>

J'espère que ça t'as aidé!

29
Mark Carpenter

nous prenons l'exemple suivant .....

une grille et a 3 colonnes et chacune contient un bouton de taille 100.

enter image description here

Le code XAML est ...

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

Mais en réalité sa taille est ....

<Grid.ColumnDefinitions>
        <ColumnDefinition Width="375" />
        <ColumnDefinition Width="Auto" />
        <ColumnDefinition Width="125" />
</Grid.ColumnDefinitions>

Conclusion:

La taille totale de la grille est de 600

"Auto": La colonne est redimensionnée avec son contenu. (2ème colonne a bouton de largeur 100)

"*": La largeur de la 1ère colonne est 3x de la 3ème colonne.

8
Rikin Patel

De plus, vous pouvez laisser le "*" s'il s'agit de la taille de l'unité. Donc, en utilisant l'exemple de code de Pwninstein, ce serait simplement:

<ColumnDefinition Width="10*/>
<ColumnDefinition/>
3
Dave