Forzar TextBlock para ajustarse en WPF ListBox

94

Tengo un cuadro de lista de WPF que muestra mensajes. Contiene un avatar en el lado izquierdo y el nombre de usuario y el mensaje apilados verticalmente a la derecha del avatar. El diseño está bien hasta que el texto del mensaje debe ajustarse a la palabra, pero en su lugar aparece una barra de desplazamiento horizontal en el cuadro de lista.

Busqué en Google y encontré soluciones a problemas similares, pero ninguno de ellos funcionó.

<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>
wpf listbox word-wrap textblock Eric Haskins
fuente

Respuestas:

132

El contenido de TextBlockse puede envolver usando property TextWrapping. En lugar de StackPanel, use DockPanel/ Grid. Una cosa más: establezca la ScrollViewer.HorizontalScrollBarVisibilitypropiedad en Disabledvalor para ListBox.

Actualizado Hiddena Disabledbasado en el comentario de Matt. Gracias Matt.

Nash
fuente
38
Creo que necesitas configurar ScrollViewer.HorizontalScrollBarVisibility en "Disabled" en lugar de "Hidden"; de lo contrario, ListBox seguirá intentando desplazarse horizontalmente, pero no verás la barra de desplazamiento.
Matt Hamilton
9

Es posible que el problema no se encuentre en ListBox. TextBlock no se ajustará, si uno de los controles principales proporciona suficiente espacio, para que no tenga la necesidad de ajustarse. Esto puede deberse a un control ScrollViewer.

Martin Moser
fuente
1
¡Gracias! en mi caso, la desactivación del desplazamiento horizontal en la vista de lista solucionó el problema ScrollViewer.HorizontalScrollBarVisibility = "Disabled"
Ateik
2

Si desea evitar que TextBlock crezca y desea que se ajuste al tamaño del cuadro de lista, debe establecer el ancho de forma explícita.

Para cambiarlo dinámicamente, no significa un valor fijo, pero debe vincularlo a su elemento padre adecuado en el árbol visual. Puedes tener algo como esto:

<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 no funciona, intente encontrar los elementos adecuados (que deben estar vinculados a qué) con el árbol visual en vivo en Visual Studio.

eldor
fuente