需要带有 TextTrimming 和 MaxLines 的 WPF TextBlock 或 TextBox
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/21892728/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Need a WPF TextBlock or TextBox with TextTrimming and MaxLines
提问by Dave
I need a TextBlock or TextBox that has TextTrimming and MaxLines. TextBlock has a TextTrimming property and TextBox has a MaxLines property but neither supports both. This is part of a larger control to allow the user to enter notes and display them in a ListBox ( see: Grief with WPF UserControl with ListBox and TextBox Can't get textwrapping to workif interested). Basically, for already entered notes, I'd like to limit the note to 2 lines. If it's longer than 2 lines, I'd show an ellipse (...) at the end of it to indicate there is more to the note. If the user hovers over an abbreviated note, he/she would see the entire note as a popup.* The control will be put on a main grid and could be different sizes (or resized) so the amount of text in 2 lines could change. I.e. a note that can be fully displayed in some situatiions might end up being abbreviated in other situations.
我需要一个具有 TextTrimming 和 MaxLines 的 TextBlock 或 TextBox。TextBlock 有一个 TextTrimming 属性,TextBox 有一个 MaxLines 属性,但两者都不支持。这是一个更大的控件的一部分,允许用户输入笔记并将它们显示在列表框中(请参阅: Grief with WPF UserControl with ListBox and TextBox Can't get textwrapping to work如果有兴趣)。基本上,对于已经输入的笔记,我想将笔记限制为 2 行。如果它长于 2 行,我会在它的末尾显示一个椭圆 (...) 以表示注释还有更多内容。如果用户将鼠标悬停在缩写注释上,他/她会看到整个注释作为弹出窗口。* 该控件将放置在主网格上,并且可以具有不同的大小(或调整大小),因此 2 行中的文本数量可能会发生变化. 即在某些情况下可以完全显示的注释在其他情况下可能会被缩写。
Would it be better to try to add the MaxLines functionality to TextBlock, or add the TextTrimming to TextBox? I have seen some posts that seem close to what I need to do. Here's one that adds TextTrimming to a TextBox but only when editing and it's not clear if the MaxLines still works: TextBox TextTrimmingI didn't come across anything about adding the MaxLines property to TextBlock. Note that TextBlock for windows phones seems to have it. Perhaps I'm not the only one that needed this :)
尝试将 MaxLines 功能添加到 TextBlock 或将 TextTrimming 添加到 TextBox 会更好吗?我看过一些帖子,看起来很接近我需要做的事情。这是将 TextTrimming 添加到 TextBox 的一个,但仅在编辑时并且不清楚 MaxLines 是否仍然有效: TextBox TextTrimming我没有遇到任何有关将 MaxLines 属性添加到 TextBlock 的问题。请注意,Windows Phone 的 TextBlock 似乎有它。也许我不是唯一需要这个的人:)
I'm a little surprised this isn't available "right out of the box". It would seem to be a common problem. Incidentally, there's no preference as to TextBox, TextBlock, or even a Label or something else. These are just the ListBox items and are NOT editable.
我有点惊讶这不是“开箱即用”的。这似乎是一个普遍的问题。顺便说一句,对于 TextBox、TextBlock,甚至 Label 或其他东西,都没有偏好。这些只是 ListBox 项目,不可编辑。
Any ideas or pointers are much appreciated.
任何想法或指针都非常感谢。
-Dave *If you're thinking, "he's probably going to next ask how to display a popup when the user hovers over the abbreviated note", you're quite correct!
-Dave *如果您在想,“当用户将鼠标悬停在缩写注释上时,他接下来可能会询问如何显示弹出窗口”,您说得非常正确!
Here is a way to handle the problem based on this stackoverflow post: Scrollable TextBlock Sized EXACTLY 2 Lines HighSee answer by Joel B Fant. The key idea is another invisible TextBlock (called "limiter" below) with 2 lines (or whatever you want). You then bind the Height property of your textblock to the ActualHeight of the dummy "limier" textblock. Here's what my XAML looks like and it appears to work:
这是一种基于此 stackoverflow 帖子处理问题的方法:可 滚动的 TextBlock 大小正好为 2 行高请参阅 Joel B Fant 的回答。关键思想是另一个不可见的 TextBlock(下面称为“限制器”),有 2 行(或任何你想要的)。然后将文本块的 Height 属性绑定到虚拟“limier”文本块的 ActualHeight。这是我的 XAML 的样子,它似乎可以工作:
<UserControl x:Class="MyControlsLibrary.Views.NotesControl"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
mc:Ignorable="d"
d:DesignHeight="300" d:DesignWidth="300">
<UserControl.Resources>
<DataTemplate x:Key="DefaultTemplate">
<Grid x:Name="GridItem" >
<Grid.ColumnDefinitions>
<ColumnDefinition />
</Grid.ColumnDefinitions>
<ScrollViewer Margin="0,5,5,0" MaxHeight="{Binding ElementName=limiter,Path=ActualHeight}" HorizontalAlignment="Stretch" VerticalAlignment="Top" VerticalScrollBarVisibility="Hidden">
<TextBlock x:Name="NoteText" Grid.Column="0" Height="{Binding ElementName=limiter,Path=ActualHeight}" Text="{Binding Path=NoteText}" TextTrimming="WordEllipsis" TextWrapping="Wrap">
<TextBlock.ToolTip>
<TextBlock Text="{Binding Path=NoteText}" TextWrapping="Wrap"></TextBlock>
</TextBlock.ToolTip>
</TextBlock>
</ScrollViewer>
<TextBlock x:Name="limiter" Grid.Column="0" Margin="0,5,5,0" Visibility="Hidden" HorizontalAlignment="Left" Width="10" VerticalAlignment="Top">
a <LineBreak/> b
</TextBlock>
</Grid>
</DataTemplate>
</UserControl.Resources>
<Grid Name="LayoutRoot">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<TextBox TextWrapping="Wrap" Grid.Row="0" Text="{Binding Path=NewNoteText, UpdateSourceTrigger=PropertyChanged}" LostFocus="TextBox_LostFocus" AcceptsReturn="True">
<TextBox.InputBindings>
<KeyBinding Command="{Binding Path=AddNote}" Key="Enter"/>
</TextBox.InputBindings>
</TextBox>
<ListBox
ScrollViewer.HorizontalScrollBarVisibility="Disabled" Grid.Row="1" ItemsSource="{Binding Path=Notes}" Margin="5" ItemTemplate="{DynamicResource DefaultTemplate}" SelectionChanged="NotesControl_SelectionChanged">
</ListBox>
</Grid>
回答by Sheridan
You can get that functionality from the default TextBlock. Instead of using the MaxLinesproperty, you can just use the plain old Heightproperty. Here's a very simple example:
您可以从默认的TextBlock. MaxLines您可以只使用普通的旧Height属性,而不是使用该属性。这是一个非常简单的例子:
<TextBlock Text="This is some very important note which just happens to be quite long"
Height="38" Width="150" TextWrapping="Wrap" TextTrimming="CharacterEllipsis" />


Bear in mind that I've only set the Widthhere to show you the two lines of text shown withthe character ellipsis. In your project, you should let a Gridset it's Width.
请记住,我在Width此处仅设置了显示带有省略号字符的两行文本。在您的项目中,您应该Grid设置它为Width.
Of course you can't use this for text input, so if you're interested, you can download a TextBoxwithellipsis from the WPF TextBox With Ellipsispage on Code Project.
当然,您不能将其用于文本输入,因此如果您有兴趣,可以从Code Project 上的WPF TextBox With Ellipsis页面下载一个TextBoxwithellipsis 。

