Força o TextBlock a envolver em WPF ListBox

94

Eu tenho uma caixa de listagem WPF que exibe mensagens. Ele contém um avatar no lado esquerdo e o nome de usuário e a mensagem empilhados verticalmente à direita do avatar. O layout é bom até que o texto da mensagem seja quebrado, mas em vez disso, recebo uma barra de rolagem horizontal na caixa de listagem.

Pesquisei no Google e encontrei soluções para problemas semelhantes, mas nenhuma delas funcionou.

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

132

O conteúdo do TextBlockpode ser empacotado usando propriedade TextWrapping. Em vez de StackPanel, use DockPanel/ Grid. Mais uma coisa - defina a ScrollViewer.HorizontalScrollBarVisibilitypropriedade como Disabledvalor para o ListBox.

Atualizado Hiddencom Disabledbase no comentário de Matt. Obrigado Matt.

— Nash
fonte

38

Acho que você precisa definir ScrollViewer.HorizontalScrollBarVisibility como "Disabled" em vez de "Hidden" - caso contrário, o ListBox ainda tentará rolar horizontalmente, você simplesmente não verá a barra de rolagem.

— Matt Hamilton

9

O problema pode não estar localizado na ListBox. O TextBlock não será quebrado, se um dos controles pai fornecer espaço suficiente, de forma que não seja necessário quebrar. Isso pode ser causado por um controle ScrollViewer.

— Martin Moser
fonte

1

Obrigado! no meu caso, desabilitar a rolagem horizontal no listview corrigiu o problema ScrollViewer.HorizontalScrollBarVisibility = "Disabled"

— Ateik

2

Se você deseja evitar que TextBlock cresça, e deseja que apenas caiba no tamanho da caixa de listagem, você deve definir a largura dela explicitamente.

Para alterá-lo dinamicamente, não significa um valor fixo, mas você precisa vinculá-lo ao seu elemento pai apropriado na árvore visual. Você pode ter algo assim:

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

Se não funcionar, tente encontrar os elementos adequados (que devem ser vinculados a quê) com a Live Visual Tree no Visual Studio.

— eldor
fonte