簡體   English   中英

WPF XAML ListView-使TextBlock文本換行

[英]WPF XAML ListView - Make TextBlock Text wrap

我有一個這樣的ListView與ListView.ItemTemplate

<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也可以調整大小。 因此,我無法對寬度進行硬編碼。 它需要根據表單的當前大小進行包裝。

在ListView對象本身上設置HorizontalContentAlignement="Stretch" ,以告訴它水平拉伸其Content以適應可用空間,然后將HorizontalScrollBarVisiblilty設置為Disabled以確保禁用水平滾動。

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

在此處輸入圖片說明

如果使用Grid並設置<ColumnDefinition Width="*"> ,則GridColumn盡可能擴大以填充所有可用空間。 之后 ,其他操作(例如包裝)才會發生。

在這種情況下, GridColumn變得足夠大,可以在一行上包含所有文本。 這就是為什么文本不自動換行的原因:它不需要自動換行! 它具有留在一行上所需的所有空間!

解決方案:將固定的列寬設置為200或100,或者嘗試使用較小的寬度,然后查看結果。 在某些時候,文本必須換行,並使用足夠薄的GridColumn

靈活寬度的解決方案:

您必須將內部GridWidth (具有RowDefinitionsRowDefinitions到外部Grid (具有ColumnDefinitionsRowDefinitions )的ActualWidth

創建一個這樣的轉換器:

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

在此示例中,我假設內部GridWidth是外部Grid一半。 相反,如果您的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}}"

最后,為ListView設置HorizontalContentAlignment="Stretch"

當您TextBlock或縮小窗口時,這都可以使用: TextBlock調整大小並正確包裝。

您可以嘗試擁有第一個RowDefinition:

<RowDefinition Height="Auto"/>

代替

<RowDefinition Height="*"/>

如果沒有成功,請嘗試暫時刪除

Style="{StaticResource MyFilePathTextLabel}" 

也。 您沒有共享其代碼,因此我認為它可能會破壞包裝。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM