WPF XAML ListView - 使TextBlock文本换行

时间:2016-05-26 16:35:36

标签: wpf xaml textwrapping

我有一个像ListView.ItemTemplate这样的ListView

<ListView
    x:Name="myList" 
    BorderBrush="Transparent"
    ItemsSource="{Binding MyItems}" 
    SelectedIndex="0"
    ScrollViewer.CanContentScroll="True"
    ScrollViewer.VerticalScrollBarVisibility="Auto">

    <ListView.ItemContainerStyle>
        <Style TargetType="ListViewItem">
            <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
            <Setter Property="Padding" Value="0" />
        </Style>
    </ListView.ItemContainerStyle>

    <ListView.ItemTemplate>
        <DataTemplate>
            <Grid Margin="5,5,5,5">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="200"/> <--THIS WILL FORCE WRAPPING
                    <ColumnDefinition Width="50"/>
                </Grid.ColumnDefinitions>
                <Grid>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="*"/>
                    </Grid.RowDefinitions>

                    <TextBlock Text="{Binding FilePath}" 
                               Grid.Row="0" Margin="3,3,3,3" 
                               Style="{StaticResource MyFilePathTextLabel}" 
                               TextWrapping="WrapWithOverflow"/>   <-- THIS WILL NOT WRAP TEXT
                    <StackPanel Orientation="Horizontal" Grid.Row="1" Margin="3,3,3,3">
                        <TextBlock Text="Lab location: "/>
                        <TextBlock Text="{Binding LabLocation}" 
                                   Style="{StaticResource MyLabLocationTextLabel}"/>
                    </StackPanel>
                    ...
                    ...
        </DataTemplate>
    </ListView.ItemTemplate>
    ...
    ...
</ListView>

这将显示如下的ListView项目:

----------------------------------
C:/samples/folderA/myfile1.txt     <-- NO WRAP AS IT FITS
Lab location: Chemistry Lab 301
----------------------------------
C:/samples/folderA/folderB/fold
erC/folderD/folderE/folderF/myf
ile2.txt                           <-- WRAP SINCE NOT FITTING
Lab location: Chemistry Lab 301
----------------------------------
C:/samples/folderA/folderB/myfi
le3.txt                            <-- WRAP SINCE NOT FITTING
Lab location: Chemistry Lab 301
----------------------------------
C:/samples/folderA/folderB/fold
erC/folderD/folderE/folderF/fol
derG/folderH/folderI/folderJ/fo
lderK/myfile4.txt                  <-- WRAP SINCE NOT FITTING
Lab location: Chemistry Lab 301
----------------------------------
C:/samples/myfile5.txt             <-- NO WRAP AS IT FITS
Lab location: Chemistry Lab 301
----------------------------------

在上面,如果文件位置不符合ListView的宽度,则每个项目都显示文件位置。

更新 更新了XAML

更新2: 将网格容器的宽度列设置为硬编码值将强制换行(参见上面的注释行)。但由于表单可以调整大小,因此网格和ListView也可以调整大小。因此,我不能硬编码宽度。 需要根据表单的当前大小进行换行。

3 个答案:

答案 0 :(得分:5)

设置ListView对象本身的HorizontalContentAlignement="Stretch"以告诉它水平拉伸内容以适应可用空间,并将HorizontalScrollBarVisiblilty设置为Disabled以确保禁用水平滚动。

<ListView x:Name="myList" ...
          HorizontalContentAlignment="Stretch"
          ScrollViewer.HorizontalScrollBarVisibility="Disabled">

enter image description here

答案 1 :(得分:1)

如果您使用Grid并设置<ColumnDefinition Width="*">GridColumn会尽可能地扩大以填充所有可用空间。只有之后才会发生其他操作,例如包装。

在这种情况下,GridColumn变得足够大,可以在一行中包含所有文本。这就是为什么文本没有包装的原因:它不需要包装!它拥有一条线所需的所有空间!

解决方案:设置固定的列宽,为200或100,或者尝试更小的宽度,并查看结果。在某些时候,文本必须换行,GridColumn足够薄。

灵活宽度的解决方案:

您必须将内部Width的{​​{1}}(Grid} RowDefinitions绑定到外部ActualWidth的{​​{1}}({1}}使用Grid)。

创建一个这样的转换器:

ColumnDefinitions

在这个例子中,我认为内部public class OuterGridToInnerGridWidthConverter : IValueConverter { public object Convert(object value, Type targetType, object parameter, CultureInfo culture) { return ((double)value) / 2; } } 只有外部Grid的一半。如果您拥有Width的{​​{1}}列和第二列的固定宽度 - 例如 - Grid,则转换器可以是:

Width="*"

这样做,将此属性添加到内部50

public class OuterGridToInnerGridWidthConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
    {
        return ((double)value) - 50;
    }
}

最后,为Grid设置Width="{Binding ActualWidth, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type Grid}}, Converter={StaticResource OuterGridToInnerGridWidthConverter}}"

当您使窗口变小或变大时,这都适用:HorizontalContentAlignment="Stretch"调整大小并正确包装。

答案 2 :(得分:0)

您可以尝试使用第一个RowDefinition:

<RowDefinition Height="Auto"/>

而不是

<RowDefinition Height="*"/>

如果没有成功,请尝试暂时删除

Style="{StaticResource MyFilePathTextLabel}" 

也。你没有分享它的代码,所以我认为它可能会破坏它的包装。