Forcer TextBlock à envelopper dans WPF ListBox

94

J'ai une listbox WPF qui affiche des messages. Il 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 correcte jusqu'à ce que le texte du message soit renvoyé à la ligne, mais à la place, j'obtiens une barre de défilement horizontale sur la zone 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>

— Eric Haskins
source

132

Le contenu de TextBlockpeut être encapsulé à l'aide de property TextWrapping. Au lieu de StackPanel, utilisez DockPanel/ Grid. Encore une chose: définissez la ScrollViewer.HorizontalScrollBarVisibilitypropriété sur la Disabledvaleur pour leListBox .

Mis Hiddenà jour en Disabledfonction du commentaire de Matt. Merci Matt.

— Nash
source

38

Je pense que vous devez définir ScrollViewer.HorizontalScrollBarVisibility sur "Disabled" plutôt que "Hidden" - sinon la ListBox essaiera toujours de défiler horizontalement, vous ne verrez tout simplement pas la barre de défilement.

— Matt Hamilton

9

Le problème n'est peut-être pas localisé dans ListBox. Le TextBlock ne sera pas enveloppé, si l'un des contrôles parents fournit suffisamment d'espace, de sorte qu'il n'a pas besoin d'être enveloppé. Cela peut être dû à un contrôle ScrollViewer.

— Martin Moser
source

1

Merci! dans mon cas, la désactivation du défilement horizontal dans la vue de liste a corrigé le problème ScrollViewer.HorizontalScrollBarVisibility = "Disabled"

— Ateik

2

Si vous souhaitez empêcher TextBlock de se développer et que vous souhaitez qu'il s'adapte simplement à la taille de la zone de liste, vous devez définir sa largeur explicitement.

Afin de le modifier dynamiquement, cela ne signifie pas une valeur fixe, mais vous devez le lier à son élément parent approprié dans l'arborescence visuelle. Vous pouvez avoir quelque chose comme ça:

<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 doivent être liés à quoi) avec l' arborescence visuelle en direct dans Visual Studio.

— eldor
source