Wymuś TextBlock, aby zawijać w WPF ListBox

94

Mam listbox WPF, który wyświetla komunikaty. Zawiera awatar po lewej stronie oraz nazwę użytkownika i wiadomość ułożone pionowo na prawo od awatara. Układ jest w porządku, dopóki tekst wiadomości nie powinien być zawijany, ale zamiast tego pojawia się poziomy pasek przewijania na liście.

Wyszukałem w Google i znalazłem rozwiązania podobnych problemów, ale żaden z nich nie zadziałał.

<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
źródło

Odpowiedzi:

132

Zawartość TextBlockmożna opakować za pomocą właściwości TextWrapping. Zamiast StackPanelużywać DockPanel/ Grid. Jeszcze jedno - ustaw ScrollViewer.HorizontalScrollBarVisibilitywłaściwość na Disabledwartość dla ListBox.

Zaktualizowano na Hiddenna Disabledpodstawie komentarza Matta. Dzięki Matt.

Nash
źródło
38
Myślę, że musisz ustawić ScrollViewer.HorizontalScrollBarVisibility na „Wyłączone” zamiast „Ukryte” - w przeciwnym razie ListBox nadal będzie próbował przewijać w poziomie, po prostu nie zobaczysz paska przewijania.
Matt Hamilton,
9

Problem może nie znajdować się w ListBox. TextBlock nie zawija się, jeśli jedna z kontrolek nadrzędnych zapewnia wystarczającą ilość miejsca, więc nie ma potrzeby zawijania. Może to być spowodowane kontrolką ScrollViewer.

Martin Moser
źródło
1
Dzięki! w moim przypadku wyłączenie przewijania w poziomie w widoku listy rozwiązało problem ScrollViewer.HorizontalScrollBarVisibility = "Wyłączone"
Ateik
2

Jeśli chcesz zapobiec wzrostowi TextBlock i chcesz, aby pasował tylko do rozmiaru pola listy, powinieneś jawnie ustawić jego szerokość.

Aby zmienić go dynamicznie, nie oznacza to stałej wartości, ale musisz powiązać go z odpowiednim elementem nadrzędnym w drzewie wizualnym. Możesz mieć coś takiego:

<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>

Jeśli to nie zadziała, spróbuj znaleźć odpowiednie elementy (które muszą być powiązane z czym) za pomocą Live Visual Tree w programie Visual Studio.

Eldor
źródło