ListViewItem 中的 TextBlock 不会换行答案

【问题标题】：TextBlock in ListViewItem won't wrapListViewItem 中的 TextBlock 不会换行
【发布时间】：2017-10-21 02:39:04
【问题描述】：

目前在我的 UWP 应用程序中，我有一个自定义 ListViewItem 用作服务接收到的消息的模板：

<ListViewItem
x:Class="App.Controls.MessageItem"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
...>

<StackPanel Orientation="Horizontal" HorizontalAlignment="Stretch">
    <Image Margin="5" VerticalAlignment="Top" Name="Picture" />
    <StackPanel VerticalAlignment="Center">
        <TextBlock Name="Foo" FontWeight="Bold" />
        <TextBlock Name="Bar" TextWrapping="Wrap" />
        <StackPanel Name="Things" />
    </StackPanel>
</StackPanel>

当数据从服务进来时，我调用：

MessageList.Items.Add(new MessageItem(message));

（构造函数自动用消息中的数据填充 Foo 和 Bar。）

但是，MessageItem 中的文本不会换行，只会被截断，即使 Bar 上的 TextWrapping 设置为 TextWrapping.Wrap。

包装不起作用：

在我使用MessageItem 的另一个ListView 上，出现一个水平滚动条（但不在MessageItems ListView 上）。我想看看包装工作，因为它非常完整（因为消息可能会很长）。

谢谢！

【问题讨论】：

标签： c# xaml uwp

【解决方案1】：

发生这种情况的原因是TextBlock 的宽度不受任何限制。我能想到的最简单的修复方法是将包含TextBlock 的StackPanel 的宽度限制为ListView 的宽度。

例如：

<ListView Name="MyContainer">
    <ListViewItem>
        <StackPanel Orientation="Horizontal" HorizontalAlignment="Stretch" >
            <Image Margin="5" VerticalAlignment="Top" Name="Picture" />
            <StackPanel VerticalAlignment="Center" Width="{Binding ElementName=MyContainer, Path=ActualWidth}">
                <TextBlock Name="Foo" FontWeight="Bold"/>
                <TextBlock Name="Bar" TextWrapping="Wrap" />
                <StackPanel Name="Things" />
            </StackPanel>
        </StackPanel>
    </ListViewItem>
</ListView>

请注意，我已将 ListView 命名为并将 StackPanel 的宽度绑定到它。

【讨论】：

【解决方案2】：

您的第一个StackPanelHorizontal 的方向设置允许您的TextBlock 无限延伸。我建议将其更改为

ListView Name="MyContainer">
<ListViewItem>
    <Grid HorizontalAlignment="Stretch" >
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="auto"/>
            <ColumnDefinition Width="*"/>
    </Grid.ColumnDefinitions>
        <Image Margin="5" VerticalAlignment="Top" Name="Picture" />
        <StackPanel VerticalAlignment="Stretch" Grid.Column="1">
            <TextBlock Name="Foo" FontWeight="Bold" HorizontalAlignment="Left"/>
            <TextBlock Name="Bar" TextWrapping="Wrap" HorizontalAlignment="Left"/>
            <StackPanel Name="Things" />
        </StackPanel>
    </StackPanel>
</ListViewItem>
</ListView>

【讨论】：