how to draw a line with arrow with varying stroke width valu

Hi ,

I have drawn arrow when i try to increase arrow stroke width , it looks wierd.Two lines are overlapping and thickness applies from center. Is there any other way to apply strokewidth outwards.

I have referred below link to draw an arrow, How do I draw an arrowhead (in Android)?

public class Arrow: View { float x0 = 300, y0 = 1000, x1 = 600, y1 = 200;

internal static int DENSITY = -1;

public Arrow(Context con):base(con)

{

DENSITY = (int)con.Resources.DisplayMetrics.Density; } protected override void OnDraw(Canvas canvas) { Paint paint = new Paint(); paint.StrokeWidth = 10 * Arrow.DENSITY; float angle, anglerad, radius, lineangle; radius = 45; angle = 45; //calculate line angles anglerad = (float)(Math.Pi * angle / 180.0f); lineangle = (float)(Math.Atan2(y1 - y0, x1 - x0)); Path mArrow = new Android.Graphics.Path(); mArrow.MoveTo(x1, y1); var a1 = (float)(x1 - radius * Math.Cos(lineangle - (anglerad / 2.0))); var a2 = (float)(y1 - radius * Math.Sin(lineangle - (anglerad / 2.0))); mArrow.LineTo(a1, a2); mArrow.MoveTo(a1, a2); mArrow.MoveTo(x1, y1); var a3 = (float)(x1 - radius * Math.Cos(lineangle + (anglerad / 2.0))); var a4 = (float)(y1 - radius * Math.Sin(lineangle + (anglerad / 2.0))); mArrow.LineTo(a3, a4); paint.AntiAlias = true; paint.SetStyle(Android.Graphics.Paint.Style.Stroke); canvas.DrawPath(mArrow, paint); canvas.DrawLine(x0, y0, x1, y1, paint); base.OnDraw(canvas); } }

Any one please share your suggestions.Thanks in advance.

It’s not clear whether you want to do this on Android or using .NET classes. In all cases, you can try using a programming toolkit that supports ready classes for drawing different types of shapes including lines with arrows. For example, LEADTOOLS Annotations objects can help you with this on Android & .NET classes.
The following code shows how you can create an AnnPointerObject class (line with arrow) using LEADTOOLS .NET classes:

using Leadtools.Annotations.Automation;
using Leadtools.Annotations.Core;
using Leadtools.Codecs;
using Leadtools.Annotations.WinForms;

public void AnnCore_AnnPointerObject()
{
// assumes _automation is valid
double inch = 720.0;
// Add a pointer object
AnnPointerObject pointerObj = new AnnPointerObject();
// Set the points for the pointer
pointerObj.Points.Add(LeadPointD.Create(1 * inch, 1 * inch));
pointerObj.Points.Add(LeadPointD.Create(3 * inch, 3 * inch));
// Add the object to the automation container
_automation.Container.Children.Add(pointerObj);
}

To check this feature in action, see the following online demo:
http://demo.leadtools.com/JavaScript/Annotations/

1 Reply

Know the answer? Post it — somebody with the same question will find it here.

Mohamed Abedallah9y ago
It’s not clear whether you want to do this on Android or using .NET classes. In all cases, you can try using a programming toolkit that supports ready classes for drawing different types of shapes including lines with arrows. For example, LEADTOOLS Annotations objects can help you with this on Android & .NET classes.
The following code shows how you can create an AnnPointerObject class (line with arrow) using LEADTOOLS .NET classes:

using Leadtools.Annotations.Automation;
using Leadtools.Annotations.Core;
using Leadtools.Codecs;
using Leadtools.Annotations.WinForms;

public void AnnCore_AnnPointerObject()
{
// assumes _automation is valid
double inch = 720.0;
// Add a pointer object
AnnPointerObject pointerObj = new AnnPointerObject();
// Set the points for the pointer
pointerObj.Points.Add(LeadPointD.Create(1 * inch, 1 * inch));
pointerObj.Points.Add(LeadPointD.Create(3 * inch, 3 * inch));
// Add the object to the automation container
_automation.Container.Children.Add(pointerObj);
}

To check this feature in action, see the following online demo:
http://demo.leadtools.com/JavaScript/Annotations/