1

There is a TextBlock element in my WPF view and it is data-bound to a string property in the view model. Now the text in this property can get a bit longer so it should be trimmed to be displayed in a single line. The layout should not be changed, so using multiple lines must be avoided. Also the data binding source should not be changed and remain a single string. The text to be displayed looks like the following examples:

  • Some object of XY
  • Another object of ABC
  • 3 blurb objects (XY, ABC, DEF)
  • 20 awesome objects (XY #1, #2, ABC #2, #3, DEF, GHI, and, some, more)

The simple solution is this:

<TextBlock Text="{Binding PageTitle}" TextTrimming="CharacterEllipsis"/>

This works fine for the first two example texts, but in the last two samples, I would like the closing parenthesis to remain visible. So what I currently get is this:

  • 20 awesome objects (XY #1, #2, ABC #2, #3, DEF...

But what I seek for is this:

  • 20 awesome objects (XY #1, #2, ABC #2, #3, DEF...)

Is there a simple way in WPF to do that? Basically, the ellipsis string, which is now always three dots (visually, might also be the Unicode character for that), needs to be variable and include whatever closing punctuation is included in the source string.

I could write a custom control for that, if necessary, but need help on the implementation of the trimming, too.

ygoe
  • 18,655
  • 23
  • 113
  • 210

2 Answers2

2

Simple approach: use a DockPanel, put two TextBlocks in it, the first one displays your string with a ellipsis trimming, and the second one showing the closing parenthesis, docked to the right:

<DockPanel>
    <TextBlock Text=")" DockPanel.Dock="Right" />
    <TextBlock Text="{Binding PageTitle}" TextTrimming="CharacterEllipsis" />
</DockPanel>

If you want to do the trimming yourself, you can have a look at my answer in this post: Ellipsis at start of string in WPF ListView.

Community
  • 1
  • 1
hillin
  • 1,603
  • 15
  • 21
  • Good idea! Just tried it in Kaxaml and it seems to work well. Need to set `` to avoid stretching and remove the gap between the ellipsis and the final TextBlock. Thank you! – ygoe Apr 23 '16 at 12:21
0

I don't have an implementation for you, but since you're using binding, I'd consider using a converter rather than a custom control. You have access to everything you need in the args to the convert method to calculate how much of the string to display and complete control over how it displays without having to modify the data in the view model.

Kevin Walsh
  • 38
  • 4
  • Well, I don't know what you mean, so I guess I need an implementation or more details on that. How can a converter know how much space there is in the view? How can I do the text width calculation myself? Will it update when the view resizes? – ygoe Dec 01 '12 at 09:33
  • How do you get the width of the textblock in the Convert method? – thecoop Mar 22 '13 at 11:44
  • @thecoop you could use a multi-value converter (implementing `IMultiValueConverter`) and a multi-bind binding (`MultiBinding` XAML tag) to bind the arguments to the desired properties. But anyhow I would prefer a control to take control of the trimming. – royalTS Sep 22 '22 at 07:52