Hi everybody,

Michael here, and this post (my last one for 2021) will serve as a continuation of the previous mail service, just this fourth dimension, instead of discussing how to describe lines on the JFrame, I'll discuss how to depict (and color) shapes on the JFrame.

Now, before we offset cartoon shapes onto our JFrame, let's create the JFrame and brand all the necessary imports (this code will probably seem familiar to you lot if you read my previous Java lesson):

                  import javax.swing.*; import java.awt.*; import javax.swing.JComponent;   public class Graphics101 {      public static void chief(String[] args) {         JFrame frame = new JFrame("My first JFrame");         frame.setSize(600, 600);           frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);            frame.setVisible(true);       }      }                

Ok, now that we've got our JFrame window set, let's start drawing some shapes. We're going to start off past cartoon a rectangle:

                  import javax.swing.*; import java.awt.*; import javax.swing.JComponent;  class ShapeDrawing extends JComponent {        public void paint(Graphics g)     {         Graphics2D g2 = (Graphics2D) g;         g2.drawRect(100, 150, 60, 200);     } }  public class Graphics101 {      public static void main(String[] args) {         JFrame frame = new JFrame("My first JFrame");         frame.setSize(600, 600);           frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);           frame.getContentPane().add together(new ShapeDrawing ());         frame.setVisible(true);       }      }                

At present, to be able to draw shapes onto the JFrame, I created a new grade that contains an object of the Graphics class. I as well used a .paint() method that executes the drawing. I did all of this when I was drawing lines onto a JFrame, all the same for this example I changed the proper noun of the class to ShapeDrawing. Also, just as I did with the LineDrawing course'due south .paint() method, I created a separate object of the Graphics form (g2 in this instance); this time, I'm using g2's .drawRect() method to draw a rectangle on the JFrame window.

The .drawRect() method takes in four parameters, in the following guild:

  • The x-coordinate where the rectangle is located
  • The y-coordinate where the rectange is located
  • The rectangle'south width
  • The rectangle's summit

You're probably wondering why nosotros don't demand to use two x- and y-coordinates like we did when we were drawing lines. This is considering even though we only specified two points for the rectangle, Java will figure out where the other two rectangle points are located through the width and height that we provided in the .drawRect() method.

  • Note-there is no divide .drawSquare() method in Coffee's Graphics class. If you wanted to draw a square, use the .drawRect() method. After all, when you think nigh it, a foursquare is basically a modified rectangle.

Now, for fun, allow'due south try drawing another shape-let'southward do a circumvolve this fourth dimension (nosotros'll go along the rectangle we drew-all we're doing is only adding a circumvolve onto the screen):

                  import javax.swing.*; import java.awt.*; import javax.swing.JComponent;  grade ShapeDrawing extends JComponent {        public void paint(Graphics k)     {         Graphics2D g2 = (Graphics2D) 1000;         g2.drawRect(100, 150, 60, 200);         g2.drawOval(185, 235, eighty, 220);     } }  public class Graphics101 {      public static void main(String[] args) {         JFrame frame = new JFrame("My starting time JFrame");         frame.setSize(600, 600);           frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);           frame.getContentPane().add(new ShapeDrawing ());         frame.setVisible(true);       }      }                                  

In this example, I added the .drawOval() method to the ShapeDrawing form'due south .paint() method. The .drawOval() method has the same 4 parameters every bit the .drawRect() method-shape's 10-coordinate, shape's y-coordinate, shape's width, and shape's height-in the same order as the .drawRect() method.

  • Whether you desire to draw an oval or a circle onto the JFrame, use the .drawOval() method.

At present, information technology's pretty cool that Coffee has built-in methods for drawing basic shapes such as squares, rectangles, and circles. However, Java has no congenital-in methods for cartoon other polygons such as triangles and hexagons.

Let'southward say nosotros wanted to add a triangle to our JFrame. Here's the code we'll utilise:

                  import javax.swing.*; import java.awt.*; import javax.swing.JComponent;  class ShapeDrawing extends JComponent {        public void paint(Graphics g)     {         Graphics2D g2 = (Graphics2D) thou;         g2.drawRect(100, 150, 60, 200);         g2.drawOval(185, 235, 80, 220);         int x[] = {400, 400, 500};         int y[] = {100, 200, 200};         int numPoints = 3;         g.drawPolygon(10, y, numPoints);     } }  public class Graphics101 {      public static void main(Cord[] args) {         JFrame frame = new JFrame("My kickoff JFrame");         frame.setSize(600, 600);           frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);           frame.getContentPane().add(new ShapeDrawing ());         frame.setVisible(true);       }      }                

How did I add the right triangle to the JFrame? Pay attention to the four lines of code in the .paint() method that follow the g2.drawOval() line. The lines of code that brainstorm with int ten[] and int y[] create arrays that store the polygon'southward x- and y-coordinates, respectively. Each point in the int 10[] array corresponds to the point in the aforementioned position in the int y[] array-for instance, the first element in the int x[] array (400) corresponds to the outset element in the int y[] array (100). This means that the outset bespeak in the traingle would be (400, 100); as well, the other 2 points would be (400, 200) and (500, 200).

  • Something to proceed in heed when y'all're creating your x- and y-coordinate arrays is to keep them the aforementioned length. Also, but include equally many elements in these arrays as there are points in the polygon you programme to draw. In this case, since I'thousand drawing a traingle onto the JFrame, I shouldn't add more than than 3 elements to either the x-coordinate or y-coordinate arrays.

After creating my 10- and y-coordinate arrays, I also included a numPoints variable that just indicates how many points I will include in the polygon-3 in this case, after all I'm drawing a triangle. Last but not least, use the .drawPolygon() method to draw the traingle and pass in the x- and y-coordinate arrays along with the numPoints variable as this method'due south parameters.

  • One more than thing to note almost the .drawPolygon() method-both g and g2 take this as a method. Utilise the grand version (which represents Java'south Graphics class), as in g.drawPolygon(x, y, numPoints). The g2 (which represents Java's Graphics2D class-Graphics2D is a subclass of the Graphics class) version of this method won't work too.

Great! We managed to draw 3 shapes onto our JFrame! However, they await clumsily dull. Permit's run into how to add some colour to each shape:

                    import javax.swing.*; import java.awt.*; import javax.swing.JComponent;  class ShapeDrawing extends JComponent {        public void paint(Graphics grand)     {         Graphics2D g2 = (Graphics2D) g;         g2.setColor(Color.Bluish);         g2.drawRect(100, 150, 60, 200);         g2.fillRect(100, 150, 60, 200);                  g2.setColor(Color.ORANGE);         g2.drawOval(185, 235, eighty, 220);         g2.fillOval(185, 235, 80, 220);                  1000.setColor(Color.YELLOW);         int 10[] = {400, 400, 500};         int y[] = {100, 200, 200};         int numPoints = 3;         m.drawPolygon(x, y, numPoints);         one thousand.fillPolygon(10, y, numPoints);     } }  public form Graphics101 {      public static void primary(Cord[] args) {         JFrame frame = new JFrame("My first JFrame");         frame.setSize(600, 600);           frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);           frame.getContentPane().add(new ShapeDrawing ());         frame.setVisible(true);       }      }                  

As y'all tin encounter, nosotros now have a blue rectangle, orange oval, and yellow right triangle on the JFrame. How did I reach this?

Well, for the rectangle, I used the .setColor() method and passed in Color.Bluish as the parameter. You might think this method alone would exercise the trick, nevertheless, this method merely set'southward the shape'southward edge color to blue-information technology doesn't actually fill in the shape. That's why nosotros need to use the .fillRect() method to fill up the rectangle; like the .drawRect() method, this method also takes in four parameters. To fill in the rectangle, laissez passer in the same 4 integers that you used for the .drawRect() method in the aforementioned order that they are listed in the .drawRect() method. In this example, I used the integers 100, 150, 60 and 200 for both the .drawRect() and .fillRect() methods.

  • With regards to the .fillRect() method, execute this after executing the .drawRect() method. However, even so execute the .setColor() method earlier executing the .drawRect() method.

To fill in the oval and the triangle, I used the same logic I used to fill up in the rectangle. However, to fill up in the oval, I used the .fillOval() method and passed in the aforementioned` four points (in the aforementioned guild) that I used for the .drawOval() method-185, 235, 80 and 220. I likewise called the .setColor() method to set the oval'southward color earlier I ran the .drawOval() method-much like I did when I prepare the colour of the rectangle.

To fill in the triangle, I used the .fillPolygon() method and passed in the same 3 parameters (in the same order) that I used for the .drawPolygon() method-x, y, and numPoints. And, just like I did for the oval and rectangle, I executed the .setColor() method earlier running the depict and fill methods.

Since this is my last 2021 post, thank y'all all for reading my content this yr (and every year)! I hope you lot had just as much fun learning new programming skills (or honing existing ones) as I did making this content. Can't wait to share all the astonishing programming content I have planned with you all in 2022! In the meantime, have a very merry vacation flavour,

Michael