Skip to content

Java awt draw elements around a circle

I’m currently writing a little game and I came over a problem. I need to draw 64 small circles at the border of a big circle. So I want something like this:

64 circles arranged around a big circle

I’ve already tried many things, but they didn’t worked. How can this be done in java, using the java.awt.Component#paint() method and the java.awt.Graphics class?

Thanks.

Answer

So, your basic problem comes down to “find a point on a circle based on a given angle”

A quick google will find resources like Find the coordinates of a point on a circle, now, to be frank, I’m an idiot, so I’d narrow my search to include Java, which would give us something like How to calculate the coordinates of points in a circle using Java? – sweet.

So the basic calculation might look something like

double xPosy = Math.cos(rads) * radius);
double yPosy = Math.sin(rads) * radius);

Now, this solves the core aspect of your problem. The rest comes down to simply painting the results. See Performing Custom Painting and Painting in AWT and Swing as a starting point and 2D Graphics for a more detailed look into the API.

Now, taking all of the above, you might end up with a solution looking something like…

enter image description here

import java.awt.Color;
import java.awt.Dimension;
import java.awt.EventQueue;
import java.awt.Graphics;
import java.awt.Graphics2D;
import java.awt.geom.Point2D;
import java.awt.geom.Rectangle2D;
import javax.swing.JFrame;
import javax.swing.JPanel;

public class Test {

    public static void main(String[] args) {
        new Test();
    }

    public Test() {
        EventQueue.invokeLater(new Runnable() {
            @Override
            public void run() {
                JFrame frame = new JFrame();
                frame.add(new TestPane());
                frame.pack();
                frame.setLocationRelativeTo(null);
                frame.setVisible(true);
            }
        });
    }

    public class TestPane extends JPanel {

        public TestPane() {
        }

        @Override
        public Dimension getPreferredSize() {
            return new Dimension(200, 200);
        }

        @Override
        protected void paintComponent(Graphics g) {
            super.paintComponent(g);
            Graphics2D g2d = (Graphics2D) g.create();
            int midX = getWidth() / 2;
            int midY = getHeight() / 2;
            Dimension size = new Dimension(4, 4);
            g2d.setColor(Color.BLACK);
            for (int index = 0; index < 64; index++) {
                double angle = (360d / 64d) * index;
                Point2D poc = getPointOnCircle(angle, 100 - 4);
                Rectangle2D box = new Rectangle2D.Double(midX + poc.getX() - 2, midY + poc.getY() - 2, size.width, size.height);
                g2d.draw(box);
            }
            g2d.dispose();
        }

        protected Point2D getPointOnCircle(double degress, double radius) {
            double rads = Math.toRadians(degress - 90); // 0 becomes the top

            return new Point2D.Double(Math.cos(rads) * radius, Math.sin(rads) * radius);
        }
    }
}

So, about now, you should realise that my “squares” are, well, square, not “dimond” shaped like yours. This is where you’re going to have to start doing some work.

If I was approaching this problem I might be tempted, to create a custom shape or, apply a 45 degree transformation to the box and the translate it’s position to render it or just rotate the whole result by 45 degrees, but this brings a whole bag of other issues depending on what you want to do with it