Synchronisation des largeurs de contrôle WPF dans un WrapPanel

Question

J'ai ce cas

<WrapPanel>
    <CheckBox>Really long name</CheckBox>
    <CheckBox>Short</CheckBox>
    <CheckBox>Longer again</CheckBox>
    <CheckBox>Foo</CheckBox>
    <Slider MinWidth="200" />
</WrapPanel>

Je veux que toutes les cases à cocher à l'intérieur du WrapPanel aient la même largeur.

L'ajout de ce qui suit accomplit presque l'effet souhaité

<WrapPanel.Resources>
    <Style TargetType="CheckBox" BasedOn="{StaticResource {x:Type CheckBox}}">
        <Setter Property="MinWidth" Value="75" />
    </Style>
</WrapPanel.Resources>

Toutefois, je ne souhaite pas coder en dur une largeur spécifique, mais laisser le plus grand CheckBox définir la largeur (la procédure ci-dessus échoue également si une largeur quelconque> 75).

Le curseur est indépendant et doit pouvoir être plus grand que les cases à cocher.

Je ne souhaite pas utiliser de grille (avec IsSharedSizeScope), car je ne souhaite pas de code codé en dur.

Cet article présente une solution intéressante, mais ce serait bien de résolvez le problème sans créer de contrôle personnalisé ni utiliser de code C #.

Quel est le meilleur moyen de le faire, de préférence en XAML uniquement?

Answer 1

À l’origine, j’ai examiné cette question à l’aide de IsSharedSizeGroup, mais j’ai heurté un obstacle en l’appliquant de manière dynamique aux choses au lieu de les emballer explicitement. Dans ce cas, créer un AttachedProperty dans un code ou une autre solution basée sur un code peut s'avérer préférable à long terme à une approche XAML uniquement. Cependant, pour créer une solution purement XAML, nous pouvons utiliser SharedSizeGroup sur une ColumnDefinition pour partager la taille de chaque élément, puis utiliser la valeur IsSharedSizeScope sur le WrapPanel. Cela fera que tout le contenu du WrapPanel avec le même SharedSizeGroup partagera leur largeur pour les colonnes et leur hauteur pour les lignes. Pour envelopper les ComboBox et éventuellement les ComboBox qui ne figurent pas actuellement dans le code XAML mais qui seront ajoutés au WrapPanel, nous pouvons créer un style et remodéliser le ComboBox pour l'envelopper dans une grille.

<WrapPanel Grid.IsSharedSizeScope="True">
  <WrapPanel.Resources>
    <Style TargetType="{x:Type CheckBox}">
      <Setter Property="Template">
        <Setter.Value>
          <ControlTemplate TargetType="{x:Type CheckBox}">
            <Grid Background="LightBlue">
              <Grid.ColumnDefinitions>
                <ColumnDefinition SharedSizeGroup="WrapPannelGroup" />
              </Grid.ColumnDefinitions>
              <CheckBox Style="{x:Null}"
                        IsChecked="{TemplateBinding IsChecked}">
                <!--Other TemplateBindings-->
                <CheckBox.Content>
                  <ContentPresenter />
                </CheckBox.Content>
              </CheckBox>
            </Grid>
          </ControlTemplate>
        </Setter.Value>
      </Setter>
    </Style>

  </WrapPanel.Resources>
  <CheckBox>Really long name</CheckBox>
  <CheckBox>Short</CheckBox>
  <CheckBox IsChecked="True">Longer again</CheckBox>
  <CheckBox>Foo</CheckBox>
  <Slider MinWidth="200" />
</WrapPanel>

Ici, nous remodelisons tous les CheckBox sans style dans le WrapPannel pour devenir des CheckBox entourés d’une grille. Cependant, à cause de cela, nous devons relier toutes les propriétés CheckBoxes que nous souhaitons conserver. Bien que cela puisse devenir contraignant, cela permet également une approche XAML pure.

Answer 2

Vous pouvez ajouter une propriété ou un convertisseur effectuant le travail requis, puis lier la largeur de chaque colonne à celle-ci. La propriété ou le convertisseur peut accéder à la liste complète des éléments, en recherchant le plus large et en renvoyant la largeur souhaitée pour tous les éléments.

Answer 3

La meilleure façon de procéder consiste à utiliser un CustomControl similaire à celui que vous avez publié.

Toute solution que vous rencontrerez devra parcourir la liste des éléments et trouver la largeur maximale pendant la phase de mesure.

Toute sorte de réponse réservée à XAML devrait être fournie comme OOTB (par exemple, IsSharedSizeScope), ou utiliser une sorte de liaison multiple pour lier les éléments ensemble. Ainsi, toute sorte de réponse XAML serait pleine de balises, ce qui la rend plus verbeuse (et moins élégante).

La seule modification que je vois dans l'article CodeProject que vous avez publié consiste à ajouter la possibilité de " éteindre " prise en compte de certains éléments (comme votre curseur). Cela pourrait être fait en tant que propriété attachée supplémentaire.