Quelle est la différence entre « * » et « Auto » dans la grille de mise en page Silverlight Définitions

Question

essayant de comprendre ce qui suit:

<Grid Name="Root"> 
    <Grid.RowDefinitions> 
     <RowDefinition Height="*" /> 
     <RowDefinition Height="*" /> 
     <RowDefinition Height="Auto" /> 
    </Grid.RowDefinitions> 
    <Grid.ColumnDefinitions> 
     <ColumnDefinition Width="Auto" /> 
     <ColumnDefinition Width="*" /> 
     <ColumnDefinition Width="Auto" /> 
    </Grid.ColumnDefinitions> 
</Grid> 

Quelqu'un peut-il me aider à expliquer la différence entre * et Auto dans l'extrait ci-dessus?

grâce

Answer 1

Auto signifie donner à cette colonne/ligne la taille des éléments contenus.Signifie partager le reste de l'espace disponible avec d'autres colonnes/lignes qui spécifient également *.

En fait * est équivalent à 1*. Il est possible de spécifier 2*, 3* ... N* pour une largeur ou une hauteur. L'algorithme utilisé par Silverlight consiste à totaliser toutes les valeurs de N pour toutes les lignes en utilisant * puis à donner à chaque ligne sa part appropriée de l'espace disponible. Par exemple: -

<Grid.RowDefinitions> 
    <RowDefinition Height="*" /> 
    <RowDefinition Height="2*" /> 
    <RowDefinition Height="3*" /> 
    <RowDefinition Height="Auto" /> 
</Grid.Definitions> 

Ce serait d'abord déterminer à quelle hauteur la quatrième ligne doit être de son contenu et que de soustrayez la pleine hauteur de availabe. Le reste de la hauteur sera divisé parmi les * lignes. Le premier obtient 1/6, le second reçoit un 1/3 et le troisième reçoit la moitié de la hauteur disponible.

Answer 2

This page (il est vrai de Silverlight 2, mais il est encore valide) a quelques exemples d'utilisation de la grille avec les explications suivantes:

Pour chaque ligne de la grille, nous avons un élément de RowDefinition . Toutes les définitions de lignes sont incluses dans un élément Grid.RowDefinitions. Nos deux premières lignes ont une hauteur de 50 pixels et la hauteur du troisième est définie sur "*". Cela indique que la ligne prendra toute la place dans la grille qui n'est pas prise par les autres lignes.

et:

Une autre option consiste à définir la largeur et/ou la hauteur « auto ». De cette façon, chaque colonne/ligne change de taille afin de correspondre à la largeur/hauteur des contrôles. Par exemple:

Answer 3

Auto fera la taille de chaque colonne afin qu'elle puisse s'adapter à tout ce qui est contenu dans elle.

* utilise la quantité maximale d'espace disponible. Il est préférable d'utiliser lorsque vous avez une colonne "restante" que vous souhaitez redimensionner à ce qui reste.

Exemple Grille de largeur indéfinie.

Scénario 1:

Column 1 | Column 2 | Column 3 
---------------------------------- 
100 Width | Auto  | 200 Width 

Sur cette colonne 2 cas pourrait être quelque chose entre 1 et quel que soit le contenu qui est mis en elle a besoin et l'espace maximum disponible pour la largeur de la grille. Si la colonne 2 était remplacée par * et qu'une largeur était définie sur la grille dans son ensemble, elle remplirait l'espace restant pour atteindre la largeur de la grille. Si vous aviez deux colonnes définies comme * et une largeur de grille définie, elles seraient en compétition pour l'espace restant et le diviseraient.

Habituellement j'utilise * pour un seul maximum de colonne (bien que ce ne soit pas une règle) si j'ai un contrôle qui est défini sur une taille dynamique afin que la colonne remplisse l'espace laissé par les autres colonnes. C'est génial si vous voulez des colonnes de taille spécifique pour un contrôle de taille dynamique et que vous voulez que certaines colonnes restent fixes et définissent une colonne à développer pour remplir le reste du contrôle. Auto ne le ferait pas avec des colonnes de contenu vides ou à faible contenu qui ne rempliraient pas l'espace restant.

Scénario 2 (col 3 présente un contenu à 100 largeur et la grille a une largeur totale de 800):

Column 1 | Column 2 | Column 3 | Column 4 
-------------------------------------------- 
100 Width | 200 Width | Auto  | * 

Colonne 3 serait alors la taille seulement à 100 largeur. La colonne 4 aurait une taille de 400 pour remplir l'espace restant.