How to draw a dashed line over an object?

Question

I am drawing a line on a control on my Windows form like this:

            // Get Graphics object from chart
            Graphics graph = e.ChartGraphics.Graphics;

            PointF point1 = PointF.Empty;
            PointF point2 = PointF.Empty;

            // Set Maximum and minimum points
            point1.X = -110;
            point1.Y = -110;
            point2.X = 122;
            point2.Y = 122;

            // Convert relative coordinates to absolute coordinates.
            point1 = e.ChartGraphics.GetAbsolutePoint(point1);
            point2 = e.ChartGraphics.GetAbsolutePoint(point2);

            // Draw connection line
            graph.DrawLine(new Pen(Color.Yellow, 3), point1, point2);

I would like to know if it is possible to draw a dashed (dotted) line instead of a regular solid line?

Paul Sasik · Accepted Answer · 2015-01-25T20:46:30.997

It's pretty simple once you figure out the formatting that defines the dashes:

float[] dashValues = { 5, 2, 15, 4 };
Pen blackPen = new Pen(Color.Black, 5);
blackPen.DashPattern = dashValues;
e.Graphics.DrawLine(blackPen, new Point(5, 5), new Point(405, 5));

The numbers in the float array represent dash lengths of different colors. So for a simple dash of 2 pixels on (black) and two off each your aray would look like: {2,2} The pattern then repeats. If you wanted 5-wide dashes with a space of 2 pixels you would use {5,2}

In your code it would look like:

// Get Graphics object from chart
Graphics graph = e.ChartGraphics.Graphics;

PointF point1 = PointF.Empty;
PointF point2 = PointF.Empty;

// Set Maximum and minimum points
point1.X = -110;
point1.Y = -110;
point2.X = 122;
point2.Y = 122;

// Convert relative coordinates to absolute coordinates.
point1 = e.ChartGraphics.GetAbsolutePoint(point1);
point2 = e.ChartGraphics.GetAbsolutePoint(point2);

// Draw (dashed) connection line
float[] dashValues = { 4, 2 };
Pen dashPen= new Pen(Color.Yellow, 3);
dashPen.DashPattern = dashValues;
graph.DrawLine(dashPen, point1, point2);

thanks so much so can you show me how i would incorporate this into my code — Alex Gordon, May 23 '11 at 17:24
@I: plz see my edit. Note of caution though. I'm not running this through a compiler so there may be syntax and intent errors. In any case, should get you close. — Paul Sasik, May 23 '11 at 17:35

score 11 · Answer 2 · answered May 23 '11 at 17:27

I think you can accomplish this by changing the pen you use to draw your line. So, replace the last 2 lines in your example with:

        var pen = new Pen(Color.Yellow, 3);
        pen.DashStyle = DashStyle.Dash;
        graph.DrawLine(pen, point1, point2);

score 7 · Answer 3 · answered May 23 '11 at 17:23

7

Pen has a public property that is defined as

public DashStyle DashStyle { get; set; }

you can set DasStyle.Dash if you want to draw a Dashed line.

answered May 23 '11 at 17:23

crypted

10,118
3
39
52

score 3 · Answer 4 · answered May 23 '11 at 17:21

3

Pen.DashPattern will do this. Look here for an example

answered May 23 '11 at 17:21

Emond

50,210
11
84
115

score 2 · Answer 5 · answered Oct 01 '16 at 21:59

2

In more modern C#:

var dottedPen = new Pen(Color.Gray, width: 1) { DashPattern = new[] { 1f, 1f } };

answered Oct 01 '16 at 21:59

Drew Noakes

300,895
165
679
742

score 0 · Answer 6 · answered Feb 18 '23 at 06:29

To answer this question regarding the generation of a dashed line using the code-behind:

        Pen dashPenTest = new(Brushes.DodgerBlue, 1);

        Line testLine = new()
        {
            Stroke = dashPenTest.Brush, //Brushes.Aqua,
            StrokeThickness = dashPenTest.Thickness,//1,
            StrokeDashArray = new DoubleCollection() { 8,4 },
            X1 = 0,
            X2 = canvas.Width,
            Y1 = 10,
            Y2 = 10
        }; 
        canvas.Children.Add(testLine);

This answer make use of the generation of a canvas in the xaml:

        <Canvas x:Name ="canvas" Background="White" Height="300" Width="300">

The important method here is the "StrokeDashArray" that generates the dashes for the line drawn. More information is given here: Shape.StrokeDashArray

How to draw a dashed line over an object?

6 Answers6