web-dev-qa-db-ja.com

TextBlockを強制的にWPF ListBoxでラップする

メッセージを表示するWPFリストボックスがあります。左側にアバターがあり、ユーザー名とメッセージがアバターの右側に縦に積み上げられています。メッセージテキストがワードラップするまでレイアウトは良好ですが、代わりにリストボックスに水平スクロールバーが表示されます。

Googleで検索して、同様の問題の解決策を見つけましたが、どれも機能しませんでした。

<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>
92
Eric Haskins

TextBlockの内容は、プロパティTextWrappingを使用してラップできます。 StackPanelの代わりに、DockPanel/Gridを使用します。もう1つ-ScrollViewer.HorizontalScrollBarVisibilityプロパティをDisabledListBox値に設定します。

Mattからのコメントに基づいて、HiddenDisabledに更新しました。ありがとう、マット。

130
Nash

問題はListBoxにない可能性があります。親コントロールの1つが十分なスペースを提供する場合、TextBlockはラップしません。そのため、ラップする必要はありません。これは、ScrollViewerコントロールが原因である可能性があります。

9
Martin Moser

TextBlockの拡大を防ぎ、リストボックスのサイズにちょうど収まるようにする場合は、TextBlockの幅を明示的に設定する必要があります。

動的に変更するには、修正値ではありませんが、ビジュアルツリーの適切な親要素にバインドする必要があります。次のようなものがあります。

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

動作しない場合は、Visual StudioでLive Visual Treeを使用して適切な要素(何にバインドする必要がある)を見つけてください。

2
eldor