2010-07-09 17 views
74

Je suis très nouveau à WPF. Je suis utilisé à partir de formulaires Windows, que je crée un panneau, place des contrôles à l'intérieur et leur donne DockStyle.Fill pour maximiser leur taille au panneau environnant.Comment utiliser DockStyle.Fill pour les contrôles standard dans WPF?

Dans WPF, je veux avoir le même. J'ai un contrôle de tabulation et je veux que sa taille remplisse autant de forme que possible. J'ai un contrôle de ruban (RibbonControlsLibrary) et je veux que le reste du formulaire soit rempli avec le contrôle onglet à la taille maximale.

(Je ne veux pas accoster commandes comme amarrage dans Visual Studio, juste vieux mécanismes d'accueil)

Répondre

157

L'équivalent WPF de WinForms de DockStyle.Fill est:

HorizontalAlignment="Stretch" VerticalAlignment="Stretch" 

valeur par défaut pour les contrôles presque, si en général, vous ne devez pas faire quoi que ce soit d'avoir un contrôle WPF remplir son conteneur parent: Ils le font automatiquement. Cela est vrai pour tous les contenants qui ne pressent pas leurs enfants à la taille minimale.

Erreurs fréquentes

Je vais maintenant expliquer plusieurs erreurs communes qui empêchent HorizontalAlignment="Stretch" VerticalAlignment="Stretch" de travailler comme prévu.

1. Explicite hauteur ou la largeur

Une erreur commune est de spécifier explicitement une largeur ou la hauteur pour un contrôle. Donc, si vous avez ceci:

<Grid> 
    <Button Content="Why am I not filling the window?" Width="200" Height="20" /> 
    ... 
</Grid> 

Il suffit de supprimer les attributs Largeur et Hauteur:

<Grid> 
    <Button Content="Ahhh... problem solved" /> 
    ... 
</Grid> 

2. Contenant panneau de contrôle à la taille serre minimum

Une autre erreur commune est d'avoir la panneau contenant serrant votre contrôle aussi serré qu'il ira.Par exemple, un vertical StackPanel toujours presser son contenu verticalement aussi petits qu'ils vont:

<StackPanel> 
    <Button Content="Why am I squished flat?" /> 
</StackPanel> 

changement à un autre groupe et vous serez bon pour aller:

<DockPanel> 
    <Button Content="I am no longer squished." /> 
</DockPanel> 

De plus, toute ligne de grille ou une colonne dont la hauteur est "Auto" écrase de la même manière son contenu dans cette direction.

Quelques exemples de conteneurs qui ne compriment pas leurs enfants sont:

  • ContentControls jamais presser leurs enfants (ce qui inclut la frontière, Button, CheckBox, ScrollViewer, et bien d'autres)
  • Grille avec un seul ligne et colonne
  • Grille avec « * » lignes et colonnes de taille
  • DockPanel ne serre pas son dernier enfant
  • TabControl ne pas presser son contenu

Quelques exemples de conteneurs qui font presser leurs enfants sont:

  • StackPanel serre dans sa direction d'orientation
  • Grille avec une ligne « automatique » de taille ou de la colonne serre dans cette direction
  • DockPanel comprime tous sauf son dernier enfant dans leur direction de dock
  • TabControl serre son en-tête (ce qui est affiché sur l'onglet)

3. explicite hauteur ou la largeur plus loin

Il est étonnant de voir combien de fois je vois Grille ou DockPanel donné une hauteur explicite et la largeur, comme ceci:

<Grid Width="200" Height="100"> 
    <Button Content="I am unnecessarily constrainted by my containing panel" /> 
</Grid> 

En général, vous ne voulez jamais donner à n'importe quel panneau une hauteur ou largeur explicite. Ma première étape pour diagnostiquer les problèmes de mise en page consiste à supprimer chaque hauteur ou largeur explicite que je peux trouver.

4. Fenêtre est SizeToContent quand il ne doit pas être

Lorsque vous utilisez SizeToContent, votre contenu sera pressé à la taille minimale. Dans de nombreuses applications, c'est très utile et c'est le bon choix. Mais si votre contenu n'a pas de taille "naturelle", vous voudrez probablement omettre SizeToContent.

+0

J'ai laissé une question assez complexe [nouvelle mise en page ici] (http://stackoverflow.com/questions/3326623/multiple-grid-layout-wpf). Après avoir lu votre réponse, je pense que vous pouvez comprendre. Cheers – Berryl

+5

Excellente réponse! J'aimerais pouvoir vous donner des points bonus. :) –

+0

@Jim Raden: Vous pouvez ajouter une prime à cette question et attribuer les points à Ray Burns;) – citronas

4

simplement envelopper vos commandes dans une grille avec deux lignes. La grille utilisera automatiquement tout l'espace qui lui est donné et vous pouvez définir les lignes pour occuper tout l'espace restant en leur donnant une hauteur de "*". La première rangée dans mon exemple (Height = "Auto") prendra autant d'espace que nécessaire par le ruban. J'espère que cela pourra aider.

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

    <Ribbon Grid.Row="0" /> 

    <TabPage Grid.Row="1" /> 
</Grid> 

En ajoutant le « Grid.Row = .. » attribut aux contrôles de l'enfant de la grille, ils s'affectés aux lignes de la grille. Ensuite, la grille dimensionnera ses enfants comme défini par les définitions de ligne.

+0

va dans la bonne direction, merci. J'ai réussi à insérer la grille, mais maintenant je dois dire au TabControl qu'il devrait utiliser toute la taille qui est encore disponible? Comment puis-je y parvenir? – citronas

+0

Vous devez ajouter l'attribut "Grid.Row" pour TabControl et donner à la définition de ligne correspondante une hauteur de "*", comme indiqué dans l'exemple. – andyp

6

Vous pouvez faire ce que vous voulez en disant simplement DockPanelLastChildFill="True" et ensuite vous assurer que ce que vous voulez être le remplisseur est en fait le dernier enfant!

La grille est la bête d'une mise en page que vous pouvez faire le plus, mais le DockPanel est généralement le bon choix pour votre panneau de mise en page le plus à l'extérieur. Voici un exemple de psuedocode:

<DockPanel LastChildFill="True"> 
    <MyMenuBar DockPanel.Dock="Top"/> 
    <MyStatus DockPanel.Dock="Bottom"/> 

    <MyFillingTabControl /> 
</DockPanel> 
+0

merci pour votre aide – citronas

0

J'ai essayé plusieurs méthodes ici mais je ne peux pas résoudre mon problème.(Remplir une autre commande de contrôle)

jusqu'à ce que je it

<Name_Control Height="auto" Width="auto"/> 
//default 
//HorizontalAlignment="Stretch" 
//VerticalAlignment="Stretch" 

Exemple:

//UserControl: 
<UserControl Name="UC_Test" Height="auto" Width="auto" /> 
//Grid: 
<Grid Name="Grid_test" Grid.ColumnSpan="2" Grid.Row="2" /> 
//Code: 
Grid_test.Children.Add(UC_Test); 

Pour la conception facile

<UserControl Name="UC_Test" Height="100" Width="100" /> 
//Code 
Grid_test.Children.Add(UC_Test); 
UC_Test.Width = Double.NaN; 
UC_Test.Height = Double.NaN;