CharacterEllipsis 在 ItemsControl WPF 中不起作用

Question

我正在尝试在 ItemsControl 的 DataTemplate 内的文本上设置 CharacterEllipsis。

<Window x:Class="CustomPanel.Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:CustomPanel;assembly="
Title="Window1" Height="400" Width="400">
<Window.Resources>
    <Style TargetType="{x:Type TextBlock}">
        <Setter Property="TextTrimming" Value="CharacterEllipsis"></Setter>
    </Style>

    <DataTemplate DataType="{x:Type local:Person}">
        <StackPanel Orientation="Horizontal">
            <TextBlock Text="{Binding Name}"
                       Margin="100,0,0,0"/>
        </StackPanel>
    </DataTemplate>
</Window.Resources>

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*"/>
    </Grid.ColumnDefinitions>

    <ItemsControl ItemsSource="{Binding Persons}" 
                  Grid.Column="0">
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <StackPanel />
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>
</ItemsControl>

</Grid>

我还尝试将宽度设置为 ItemsControl、StackPanel 和 TextBlock 本身。

有什么想法吗？

编辑

为了强调这不是 Style 或 StackPanel 的问题，我将两者都删除了，但它仍然不起作用

<Window.Resources>
    <DataTemplate DataType="{x:Type local:Person}">
            <TextBlock Text="{Binding Name}"
                       TextTrimming="CharacterEllipsis"
                       Margin="100,0,0,0"
                       Width="200"/>
    </DataTemplate>
</Window.Resources>

<Grid>
    <ItemsControl ItemsSource="{Binding Persons}"/>
</Grid>

澄清

这在文本太大时工作得很好，但我希望它在窗口也被调整为更小的宽度时工作。

Answer 1

简答：

删除数据模板中的堆栈面板：

    <DataTemplate DataType="{x:Type local:Person}">
            <TextBlock Text="{Binding Name}" TextTrimming="CharacterEllipsis"/>
    </DataTemplate>

堆栈面板占用了它想要的任何空间，因此修剪不起作用。

长答案：

设置datacontext示例：

<Window.DataContext>
   <local:PersonsViewModel/>
</Window.DataContext>

简单的虚拟机：

public class PersonsViewModel : INotifyPropertyChanged
{
    private ObservableCollection<Person> persons = new ObservableCollection<Person> { new Person { Name = "Bjarne balblablalblalbal balbalbalballblalbla" }, new Person { Name = "Arne Belinda blblabllalbalblllablalbla Arne Belinda blblabllalbalblllablalbla Arne Belinda blblabllalbalblllablalbla Arne Belinda blblabllalbalblllablalbla Arne Belinda blblabllalbalblllablalbla" }, new Person { Name = "Turid" } };
    public ObservableCollection<Person> Persons
    {
        get { return persons; }
        set
        {
            if (Equals(value, persons)) return;
            persons = value;
            OnPropertyChanged();
        }
    }

    public event PropertyChangedEventHandler PropertyChanged;

    [NotifyPropertyChangedInvocator] // No R#? Comment this line out
    protected virtual void OnPropertyChanged([CallerMemberName] string propertyName = null)
    {
        PropertyChangedEventHandler handler = PropertyChanged;
        if (handler != null) handler(this, new PropertyChangedEventArgs(propertyName));
    }
}

Person 类还必须实现 INotifyPropertyChanged 以发出属性更改的信号..

public class Person : INotifyPropertyChanged
{
    private string name;
    public String Name
    {
        get { return name; }
        set
        {
            if (value == name) return;
            name = value;
            OnPropertyChanged();
        }
    }

    public event PropertyChangedEventHandler PropertyChanged;

    [NotifyPropertyChangedInvocator]
    protected virtual void OnPropertyChanged([CallerMemberName] string propertyName = null)
    {
        PropertyChangedEventHandler handler = PropertyChanged;
        if (handler != null) handler(this, new PropertyChangedEventArgs(propertyName));
    }
}

干杯

斯蒂安

Answer 2

将x:Key添加到样式中并像这样设置TextBlock的样式：（Rohit Vats已经说了原因）

<Style x:Key="tb" TargetType="{x:Type TextBlock}">
    <Setter Property="TextTrimming" Value="CharacterEllipsis"></Setter>
</Style>

<DataTemplate DataType="{x:Type local:Person}">
    <StackPanel Orientation="Horizontal">
        <TextBlock Width="90" Style="{DynamicResource tb}" Text="{Binding Name}"
               Margin="100,0,0,0"/>
    </StackPanel>
</DataTemplate>

然后移除堆栈面板或设置文本块的宽度。

结果：

我的测试代码是：

            Persons = new List<Person>();
            Person p = new Person();
            p.Name="One\ntwo two\nThree Three Three\nfour four four four";
            Persons.Add(p);

另一个结果：（调整窗口大小）

代码：

<DataTemplate DataType="{x:Type local:Person}">

                <TextBlock Style="{DynamicResource tb}" Text="{Binding Name}"
                       Margin="100,0,0,0"/>

        </DataTemplate>

Answer 3

DataTemplate 不会从窗口中选择样式，因为它不在该范围内。将样式移动到 DataTemplate.Resources 或 Application.Resources 内，以便 DataTemplate 中的 TextBlock 可以选择它。

其次，您将 TextBlock 包装在 StackPanel 中，使其具有无限大小以进行扩展。因此，移除包装 TextBlock 的 Stackpanel。

三、ItemsControl的约束宽度或MaxWidth随心所欲。

<Window.Resources>
    <DataTemplate DataType="{x:Type local:Person}">
        <DataTemplate.Resources>
            <Style TargetType="{x:Type TextBlock}">
                <Setter Property="TextTrimming" Value="CharacterEllipsis"/>
            </Style>
        </DataTemplate.Resources>
        <TextBlock Text="{Binding Name}"/>
    </DataTemplate>
</Window.Resources>
<ItemsControl ItemsSource="{Binding Persons}" Width="30">
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <StackPanel/>
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>
</ItemsControl>

---

更新：

如果您想让它适用于重新调整窗口大小，不要设置宽度，而是在 TextBlock 上设置最大宽度：

<Window.Resources>
    <DataTemplate DataType="{x:Type local:Person}">
        <TextBlock Text="{Binding Name}" MaxWidth="200"
                    TextTrimming="CharacterEllipsis"/>
    </DataTemplate>
</Window.Resources>
<ItemsControl Margin="100,0,0,0" ItemsSource="{Binding Persons}"/>

Answer 4

这是一个相当大胆的声明，而且是不真实的。甚至无需将您的代码复制到一个新项目中，我就能明白您为什么会遇到这个问题。为了使CharacterEllipsis 工作，TextBlock 需要对其Width 施加一些约束...否则，WPF 将如何知道何时启动字符省略号效果？

一种解决方案是在TextBlock 上设置一个精确的Width：

<TextBlock Text="{Binding Name}" Margin="100,0,0,0" Width="200" />

当然，这对很多人来说并不方便，所以一个替代方法是不使用StackPanel 作为ItemsPanelTemplate（或在DataTemplate），因为他们会让TextBlock无限增长。

---

更新>>>

好的，您有三种可能的解决方案，因为Style 超出了生成的DataTemplate 元素的范围：

a) 将Style 移动到DataTemplate.Resources：

<DataTemplate DataType="{x:Type local:Person}">
    <DataTemplate.Resources>
        <Style TargetType="{x:Type TextBlock}">
            <Setter Property="TextBlock.TextTrimming" Value="CharacterEllipsis" />
        </Style>
    </DataTemplate.Resources>
    <TextBlock Text="{Binding Name}" Margin="100,0,0,0"/>
</DataTemplate>

b) 将TextTrimming 属性直接添加到TextBlock：

<TextBlock Text="{Binding}" TextTrimming="CharacterEllipsis" Margin="100,0,0,0"/>

c) 在TextBlock 上明确设置Style：

<Style x:Key="YourStyle" TargetType="{x:Type TextBlock}">
    <Setter Property="TextBlock.TextTrimming" Value="CharacterEllipsis" />
</Style>

<TextBlock Style="{StaticResource YourStyle}" Text="{Binding}" Margin="100,0,0,0"/>