web-dev-qa-db-fra.com

Comment puis-je aligner une CheckBox avec son contenu?

L'apparence d'un WPF CheckBox désaligne la partie de vérification avec la partie d'étiquette (contenu). Le chèque reste légèrement au-dessus du contenu comme indiqué ici:

enter image description here

Le XAML ressemble à ceci:

<CheckBox Content="Poorly aligned CheckBox" Margin="9"/>

Le CheckBox est à l'intérieur d'une cellule de grille. Existe-t-il un moyen simple d'aligner verticalement le contenu et de vérifier les parties d'un Checkbox XAML? J'ai essayé diverses combinaisons de propriétés sans succès. J'ai vu ne question similaire ici mais la réponse est beaucoup trop complexe.

Merci d'avance.

EDIT: Le problème a été causé par le Window FontSize que j'ai défini à 14 . Pour recréer le problème, définissez le CheckBox FontSize sur 14 (ou plus). Mon programme est vu à distance par les ouvriers d'usine, donc je permets à la fenêtre FontSize d'être augmentée ou diminuée par l'utilisateur.

wpfsilverlightxamlcheckboxalignment
37
DeveloperDan

Modifier - Nouvelle réponse: (le précédent n'était pas bon)

Ce n'est pas la meilleure façon, je crois, mais je peux faire le travail:

<CheckBox>
    <TextBlock Text="Poorly aligned CheckBox" Margin="0,-2,0,0"/>
</CheckBox>

L'utilisation d'une marge négative pour pousser le contenu vers le haut, résulte: enter image description here

23
MichaelS

Je sais qu'il est trop tard, mais voici une meilleure solution, sans fixer de marges. Les marges doivent être définies différemment pour différentes hauteurs de TextBlock ou Checkbox.

<CheckBox VerticalAlignment="Center" VerticalContentAlignment="Center">
    <TextBlock Text="Well aligned Checkbox" VerticalAlignment="Center" />
</CheckBox>

Mise à jour:

Cela vaut la peine de consulter le commentaire de @ nmarler ci-dessous.

53
Majid

Le style par défaut d'un CheckBox ne ressemble pas à cela dans WPF. Il s'aligne parfaitement dans les deux XP et Windows 7. Pouvez-vous donner une meilleure description de la façon de reproduire ce problème?

Deux choses auxquelles je peux penser pour obtenir le décalage que vous voyez est de modifier le Padding ou le VerticalContentAlignment. La valeur par défaut CheckBox pour VerticalContentAlignment est Top et une CheckBox avec Content a Padding définie sur "4,0,0,0". Essayez de changer ces deux-là et voyez si cela fait une différence.

Voici une comparaison

enter image description here

Extrait du Xaml suivant

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="*"/>
        <RowDefinition Height="*"/>
        <RowDefinition Height="*"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>
    <CheckBox Grid.Row="0"
              Content="Poorly aligned CheckBox" Margin="9" />
    <CheckBox Grid.Row="1"
              Content="Padding=4,4,0,0" Margin="9" Padding="4,4,0,0"/>
    <CheckBox Grid.Row="2"
              Content="Vertical Center" Margin="9"
              VerticalContentAlignment="Center"/>
    <CheckBox Grid.Row="3"
              Content="Vertical Top" Margin="9"
              VerticalContentAlignment="Top"/>
</Grid>
15
Fredrik Hedblad

Il existe une solution simple pour cela sans avoir besoin de faire un bloc de texte pour le contenu, et sans écrire de code supplémentaire dont vous n'avez pas besoin. Utilisez simplement "VerticalContentAlignment". Exemple:

<CheckBox Content="Sample of Text" VerticalContentAlignment="Center"/>
5
LucasM

Placez un CheckBox vide et le contenu en tant que contrôles séparés dans un StackPanel à orientation horizontale. Cela fonctionne avec n'importe quelle taille de police.

<StackPanel Orientation="Horizontal">
    <CheckBox VerticalAlignment="Center" />
    <TextBlock VerticalAlignment="Center" Text="Option X" />
</StackPanel />
2
Thomas Hetzer

L'application d'un remplissage supérieur négatif fonctionne très bien pour ma mise en page:

<CheckBox Content="Poorly aligned CheckBox" Padding="4,-3,0,0" Margin="9"/>
1
landsteven

Mes cases à cocher sont bien alignées, donc je me demande ce qui est différent du vôtre. La seule différence apparente est que vous utilisez une police plus grande que moi, ce qui me rappelle la question suivante:

style WPF CheckBox avec TextWrapping

Votre problème peut être que si le contenu est un bloc de texte, la case à cocher est justifiée par le haut, ce qui peut sembler étrange lorsque la taille de la police est augmentée. Donc, je suppose, essayez d'utiliser un AccessText comme contenu de la CheckBox à la place:

<CheckBox Margin="9"><AccessText>Better aligned CheckBox?</AccessText></CheckBox>
0
Qwertie