A while back we posted a tutorial on how to auto ellipse text in javascript, and it seems that people find it useful, because it gets a good amount of search traffic. One thing we did notice, however, is that a lot of people seem to end up there when they are actually searching for how to auto ellipse text in C#. And while you could implement the algorithm discussed on the javascript tutorial in C#, it is by no means the easiest way to ellipse strings in C#.
What is the best way? There are actually two possibilities, and which you should use depends on your situation. The first is extremely simple - you put text in a label, and you set that label's AutoEllipsis property to true.
With AutoEllipsis set to True
With AutoEllipsis set to False
myLabel.Location = new System.Drawing.Point(10, 10);
myLabel.Size = new System.Drawing.Size(100, 15);
myLabel.AutoEllipsis = true;
myLabel.Text = "Some Text That Will Be Ellipsed";
As you can see, the Label will by default always truncate your text. But with AutoEllipsis on, it will put ellipses on the end of the string if it is being truncated.
So that's pretty simple. But what if you aren't using labels - your drawing directly on the screen? Well, there is a built in solution in C# for that as well. It is a little known class called TextRenderer which has a bunch of the logic for string rendering built right in. The TextRenderer class is actually what a Label uses to draw its contents, and to do its AutoEllipsing.
Using the TextRenderer class is extremely simple. It is comprised of a number of static methods for drawing and measuring strings. To use it for ellipsing, we will be using the following method:
Rectangle bounds, Color foreColor, Color backColor, TextFormatFlags flags);
There are two arguments that may look unfamiliar to you: IDeviceContext dc and TextFormatFlags flags. The IDeviceContext in most cases will just be a Graphics object, which you will get from the arguments of an OnPaint method. The TextFormatFlags will be what we use to tell the TextRenderer to ellipse the string.
Here is a potential use of the method:
{
base.OnPaint(e);
TextRenderer.DrawText(e.Graphics, "I am Some Text!", new Font("Arial", 11),
new Rectangle(10, 75, 100, 50), Color.Black, Color.White,
TextFormatFlags.EndEllipsis);
}
Here, we are overriding the OnPaint of some control, and painting the text "I am Some Text!" at position (10,75) with a width/height of (100,50) using the font Arial with a size of 11pt. The text will be black, and the background will be white, and if the text exceeds 100px long (the width specified in the bounds) it will be ellipsed so that it fits within 100px. It is that TextFormatFlags.EndEllipsis that causes the ellipsing magic to happen. There are a number of other flags as well, and you can check out the MSDN docs if you want to learn more about them.
I've put together some code that shows the TextRenderer in action, and allows you to play around with how ellipsing works:
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Text;
using System.Windows.Forms;
namespace EllipseApplication
{
public class EllipseForm : Form
{
private TextBox sourceTextBox = new TextBox();
private NumericUpDown widthBox = new NumericUpDown();
private Label textboxLabel = new Label();
private Label widthBoxLabel = new Label();
private Font textFont = new Font("Arial", 11);
public EllipseForm()
{
this.SuspendLayout();
this.Text = "Ellipse Test";
this.Size = new Size(300, 300);
this.sourceTextBox.Location = new System.Drawing.Point(125, 12);
this.sourceTextBox.Size = new System.Drawing.Size(155, 20);
this.sourceTextBox.TextChanged +=
delegate(object sender, EventArgs e) { this.Invalidate(); };
this.Controls.Add(this.sourceTextBox);
this.widthBox.Location = new System.Drawing.Point(125, 38);
this.widthBox.Size = new System.Drawing.Size(55, 20);
this.widthBox.Value = 50;
this.widthBox.Maximum = 300;
this.widthBox.ValueChanged +=
delegate(object sender, EventArgs e) { this.Invalidate(); };
this.Controls.Add(this.widthBox);
this.textboxLabel.Location = new System.Drawing.Point(10, 12);
this.textboxLabel.Size = new System.Drawing.Size(105, 20);
this.textboxLabel.Text = "Text To Ellipse:";
this.textboxLabel.TextAlign = System.Drawing.ContentAlignment.MiddleRight;
this.Controls.Add(this.textboxLabel);
this.widthBoxLabel.Location = new System.Drawing.Point(10, 38);
this.widthBoxLabel.Size = new System.Drawing.Size(105, 20);
this.widthBoxLabel.Text = "Width of Final String:";
this.widthBoxLabel.TextAlign = System.Drawing.ContentAlignment.MiddleRight;
this.Controls.Add(this.widthBoxLabel);
this.ResumeLayout();
}
protected override void OnPaint(PaintEventArgs e)
{
base.OnPaint(e);
TextRenderer.DrawText(e.Graphics, this.sourceTextBox.Text, textFont,
new Rectangle(10, 75, (int)this.widthBox.Value, 50),
Color.Black, Color.White, TextFormatFlags.EndEllipsis);
}
[STAThread]
static void Main()
{
Application.EnableVisualStyles();
Application.SetCompatibleTextRenderingDefault(false);
Application.Run(new EllipseForm());
}
}
}
And here is a screen shot of it in action:
Pretty much all it allows you to do is change the text being drawn, and change the width of the bounding box the string is being drawn in. As you can see in the overridden OnPaint method for this form, it is getting the text to draw from the text box, and the width of the bounding box from the NumericUpDown control. You should be able to copy this into Visual Studio and play around with it - in fact, I would suggest doing so. Some of the other TextFormatFlags can produce interesting results.
Hope this satisfies all those people who are searching for string ellipsing in C#! If you have any questions, feel free to post them, and we will do our best to answer them.
09/11/2007 - 14:42
Thanks! I have a control that must use auto size but I still need to ellipse the text. This is exactly what I'll need.
12/30/2007 - 09:01
This link helped me a lot in getting auto ellipses.
Saved lot of my time.
02/04/2008 - 03:11
Very interesting--I bookmarked it. I have been thinking about similar problems recently.
02/26/2008 - 07:59
hi, thanks for the article.Actually i have put an image in a label and have to put some text after the image.When i am doing it i am finding that the text is raised a little bit than the centre. i have tried the setallignment option to middle but with no effect. As a result i am getting the text with ellipsis but the text is raised above middle
04/04/2008 - 14:44
Excellent! I was doing all my own work in the OnPaint routine - measuring the text, substring it, adding ellipsis. This is much more clear and to the point. Thanks.
08/22/2008 - 02:16
Thats a nice article. Even I had troubles with auto ellipses. Found your tutorial really helpful.
Thanks.
09/05/2008 - 23:59
Thanks for your post, well, I assume people were interested in the javascript version because they want this for their web applications not desktop applications which is the same problem I currently have, I'm trying to shorten long text strings and add ellipsis to them but in ASP.NET not in a .NET windows application. I came across TextRenderer.MeasureText() in MSDN and although it works from ASP.NET it doesn't seem easy to get the modified string (I pass TextFormatFlags.ModifyString in the call to TextRenderer.MeasureText(), you can't display the string directly in ASP.NET, in a label for example, that didn't work, it seems that ASP.NET handles strings differently than Windows applications - more precisely it ignores the null character). Read this article and my post at the end of the article to understand what I mean http://sql.codeproject.com/KB/vb/NewPathCompactPath.aspx?msg=2711436#xx2711436xx. There's also another post in the article that talked about TextRenderer.MeasureText() causing AccessViolationExceptions which is making me more worried of using it in my ASP.NET application (don't want to bring my website down just to add some ellipsis!!). It seems that I will eventually have to reinvent the wheel and create my own version, was really hoping to find something on the internet and save the time.
02/09/2010 - 12:53
Nice article. Despite being a few years old, it's still exactly what I was looking for. I wasn't aware of the Label.AutoEllipsis property, which solved my immediate problem. It was also a nice bonus to learn of the TextRenderer technique as well. I may use that in reports at some point.
09/05/2010 - 07:09
You shoud maybe check the difference between an ellipse and an ellipsis