Draw a simple robot arm in C#

This is really an exercise in using graphical transformations. You can draw each segment and joint in the arm by using simple drawing methods and transformations to rotate and translate the parts to their correct positions.

The basic idea is to consider the stages of the arm one after another and use transformations to move from one to the next.

Suppose the three arm segments have lengths L1, L2, and L3 and the angles of rotation at the three joints are A1, A2, and A3.

The first joint rotates the arm by angle A1 at a fixed shoulder. The second joint is translated distance L1 away in the direction of the first arm segment.

The second joint rotates the arm by angle A2 at the "elbow." The third joint is translated distance L2 away in the direction of the second arm segment.

The third joint rotates the arm by angle A3 at the "wrist." The end of the arm is translated distance L3 away in the direction of the third arm segment.
This program uses the following code to draw the robot arm.

// Draw the robot arm.
private void DrawRobotArm(Graphics gr)
{
const int UpperArmLength = 75;
const int LowerArmLength = 50;
const int WristLength = 20;

gr.SmoothingMode = SmoothingMode.AntiAlias;
gr.Clear(picCanvas.BackColor);

// For each stage in the arm, draw and then *prepend* the
// new transformation to represent the next arm in the sequence.

// Translate to center of form.
float cx = picCanvas.ClientSize.Width / 2;
float cy = picCanvas.ClientSize.Height / 2;
gr.TranslateTransform(cx, cy);

// Draw the shoulder centered at the origin.
gr.DrawEllipse(Pens.Red, -4, -4, 9, 9);

// Rotate at the shoulder.
// (Negative to make the angle increase counter-clockwise).
gr.RotateTransform(-scrJoint1.Value, MatrixOrder.Prepend);

// Draw the first arm.
gr.DrawRectangle(Pens.Blue, 0, -1, UpperArmLength, 3);

// Translate to the end of the first arm.
gr.TranslateTransform(UpperArmLength, 0, MatrixOrder.Prepend);

// Draw the elbow.
gr.DrawEllipse(Pens.Red, -4, -4, 9, 9);

// Rotate at the elbow.
gr.RotateTransform(-scrJoint2.Value, MatrixOrder.Prepend);

// Draw the second arm.
gr.DrawRectangle(Pens.Blue, 0, -1, LowerArmLength, 3);

// Translate to the end of the second arm.
gr.TranslateTransform(LowerArmLength, 0, MatrixOrder.Prepend);

// Draw the wrist.
gr.DrawEllipse(Pens.Red, -4, -4, 9, 9);

// Rotate at the wrist.
gr.RotateTransform(-scrJoint3.Value, MatrixOrder.Prepend);

// Draw the third arm.
gr.DrawRectangle(Pens.Blue, 0, -1, WristLength, 3);
}
The code starts by drawing the shoulder at the origin. It first adds a translation to center the shoulder in the middle of the PictureBox.

Next the code applies the rotation A1 at the shoulder and draws a rectangle representing the first arm segment. There are is one tricky issue here.

The rotation is prepended to the previous translation so the rotation occurs before the translation that centers the shoulder. Imagine the arm in its own world coordinate space with the shoulder at the origin. The program draws a horizontal rectangle at the origin to represent the first arm segment. The transformations then rotate it to the correct angle and translate it so the shoulder is centered. This puts the first arm segment in the correct position.

Next the code must draw the elbow joint. To do this, it prepends a translation of distance L1 in the X direction and 0 in the Y direction. Because this is followed by the previous rotation, this translation occurs in the direction of the first arm segment. The code then draws the elbow joint at the origin. It is translated, rotated, and translated again so it ends up in the correct position.

Again imagine the arm in world coordinate space and suppose you draw the elbow at the origin. The new translation moves the joint to (L1, 0). The rotation of angle A1 rotates the joint to match the rotation of the first arm segment. Finally the shoulder's translation moves the whole thing so the base of the first arm segment is centered in the drawing area.

The code continues like this as many times as necessary to draw each arm segment and joint. In each step, it prepends the new translations and rotations.

  

 

What did you think of this article?




Trackbacks
  • No trackbacks exist for this post.
Comments

  • 3/18/2013 6:41 PM me wrote:
    hi....

    i have try this "Draw a simple robot arm in C#" by using your code but why the picture i have copied did not appear in the "picCanvas" in C#

    begineer C#...
    Reply to this
    1. 3/22/2013 3:32 PM Rod Stephens wrote:
      I'm not sure. My guess would be that the PictureBox's Paint event isn't hooked up to the code properly.

      Most of the examples on this web site only include the most interesting pieces of code and often there is other code that you need to include to make them work. To see all of the code, you should download the example program by clicking the Download button below the text. I suspect the example will work for you.
      Reply to this
Leave a comment

Submitted comments are subject to moderation before being displayed.

 Name

 Email (will not be published)

 Website

Your comment is 0 characters limited to 3000 characters.