Forcer le bloc de texte à envelopper dans la ListBox WPF

Question

J'ai une boîte de liste WPF qui affiche des messages. Elle contient un avatar sur le côté gauche et le nom d'utilisateur et le message empilés verticalement à droite de l'avatar. La mise en page est parfaite jusqu'à ce que le texte du message soit enveloppé d'un mot, mais au lieu de cela, j'obtiens une barre de défilement horizontale sur la boîte de liste.

J'ai cherché sur Google et trouvé des solutions à des problèmes similaires, mais aucune n'a fonctionné.

<ListBox HorizontalContentAlignment="Stretch"  ItemsSource="{Binding Path=FriendsTimeline}">
    <ListBox.ItemTemplate>
        <DataTemplate>
            <StackPanel Orientation="Horizontal">
                <Border BorderBrush="DarkBlue" BorderThickness="3" CornerRadius="2" Margin="3" >
                    <Image Height="32" Width="32"  Source="{Binding Path=User.ProfileImageUrl}"/>
                </Border>
                <StackPanel Orientation="Vertical">
                    <TextBlock Text="{Binding Path=User.UserName}"/>
                    <TextBlock Text="{Binding Path=Text}" TextWrapping="WrapWithOverflow"/> <!-- This is the textblock I'm having issues with. -->
                </StackPanel>
            </StackPanel>
        </DataTemplate>
    </ListBox.ItemTemplate>
</ListBox>

Answer 1

Contenu de la TextBlock peut être enveloppé en utilisant la propriété TextWrapping . Au lieu de StackPanel utiliser DockPanel / Grid . Une dernière chose : mettez ScrollViewer.HorizontalScrollBarVisibility à la propriété Disabled pour le ListBox .

Mise à jour de Hidden a Disabled d'après un commentaire de Matt. Merci Matt.

Answer 2

Le problème ne se situe peut-être pas dans la ListBox. Le bloc de texte ne s'enroule pas si l'un des contrôles parents offre suffisamment d'espace pour qu'il n'ait pas besoin de s'enrouler. Ce problème peut être causé par un contrôle ScrollViewer.

Answer 3

Si vous voulez empêcher le TextBlock de s'agrandir et qu'il doit s'adapter à la taille de la zone de liste, vous devez définir explicitement sa largeur.

Pour le modifier dynamiquement, il ne s'agit pas d'une valeur fixe, mais vous devez le lier à son élément parent approprié dans l'arbre visuel. Vous pouvez avoir quelque chose comme ceci :

<ListBox ItemsSource="{Binding MyItems}" Name="MyListBox">

  <ListBox.Resources>
    <Style TargetType="ListBoxItem">
      <Setter Property="Width" 
              Value="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=ScrollContentPresenter}, Path=ActualWidth}" />
    </Style>
  </ListBox.Resources>

  <ListBox.ItemTemplate>
    <DataTemplate>
      <TextBlock Text="{Binding Title}" TextWrapping="Wrap" />
    </DataTemplate>
  </ListBox.ItemTemplate>

</ListBox>

Si cela ne fonctionne pas, essayez de trouver les éléments appropriés (qui doit être lié à quoi) avec la fonction Arbre visuel en direct dans Visual Studio.