Forza TextBlock a capo in WPF ListBox

94

Ho una casella di riepilogo WPF che visualizza i messaggi. Contiene un avatar sul lato sinistro e il nome utente e il messaggio impilati verticalmente a destra dell'avatar. Il layout va bene finché il testo del messaggio non va a capo automatico, ma invece ottengo una barra di scorrimento orizzontale nella casella di riepilogo.

Ho cercato su Google e ho trovato soluzioni a problemi simili, ma nessuno di loro ha funzionato.

<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

Il contenuto di TextBlockpuò essere avvolto utilizzando proprietà TextWrapping. Invece di StackPanel, usa DockPanel/ Grid. Un'altra cosa: imposta la ScrollViewer.HorizontalScrollBarVisibilityproprietà su Disabledvalue per il file ListBox.

Aggiornato Hiddenin Disabledbase al commento di Matt. Grazie Matt.

— Nash
fonte

38

Penso che sia necessario impostare ScrollViewer.HorizontalScrollBarVisibility su "Disabled" piuttosto che "Hidden" - altrimenti il ListBox proverà comunque a scorrere orizzontalmente, semplicemente non vedrai la barra di scorrimento.

— Matt Hamilton

9

Il problema potrebbe non trovarsi nella ListBox. Il TextBlock non va a capo, se uno dei controlli padre fornisce spazio sufficiente, in modo che non abbia la necessità di avvolgere. Ciò potrebbe essere causato da un controllo ScrollViewer.

— Martin Moser
fonte

1

Grazie! nel mio caso la disabilitazione dello scorrimento orizzontale nella listview ha risolto il problema ScrollViewer.HorizontalScrollBarVisibility = "Disabled"

— Ateik

2

Se vuoi impedire che TextBlock cresca e vuoi che si adatti alle dimensioni della casella di riepilogo, dovresti impostarne la larghezza in modo esplicito.

Per cambiarlo dinamicamente, non significa un valore fisso, ma è necessario associarlo al suo elemento genitore appropriato nella struttura ad albero visuale. Puoi avere qualcosa del genere:

<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 non funziona, prova a trovare gli elementi corretti (che devono essere associati a cosa) con il Live Visual Tree in Visual Studio.

— eldor
fonte