Drawing buttons and lines in Java?

Question

I want to have a frame (or similar) which contains 5 buttons, each located at specific coordinates (not in a rectangular order or a strict grid) and some lines which connect some of buttons.

My initial approach would be:

1. Open a frame
2. Place the buttons at the desired coordinates
3. Draw the lines between the buttons using the coordinates of the buttons

The problem is, I can either place buttons or draw lines. I am searching the net since 2 evenings and did only find solutions which can do either or. And I cannot figure out why it is not working.

This one here explains very well how to draw multiple lines:

How to draw lines in Java

But I do not get any visible buttons in the same field (component) as the lines. They are always either not visible or in another area no matter whichever I try.

I would be very grateful if somebody could give me a real example with a short explanation. I am very new to Java and teaching “myself”, …

Thanks, Lubenja

EDIT after MadProgrammer's comment and eatinasandwich'S answer: I agree, that these layout managers may do great jobs. I read about a few of them and think they help if you are using a fixed and rectangual layout. However, I want to have something like this (see below). Whereby I want to program a overall program, which allows me to change the positions easily and/or to add new buttons and the corresponding lines. Therefore I was more in favour of coordinates than a layout manager. (Layout here: http://4.bp.blogspot.com/-hSkZGDick6o/VIfkt-m6ZvI/AAAAAAAAAMw/MA2JunqHu0Q/s1600/Layout.png, can't upload images yet) . okay! layout managers can do the trick!

Answer 1

You generally want to use panels for anything where you are going to be drawing. I came up with a quick example. I'll show you the panel class because the frame part is somewhat trivial. You just need to add this panel to the frame you are creating.

Also just a few points to hammer out about the code. MadProgrammer mentioned not using absolute positioning and he is correct. That's why when I overrode paintComponent (the method that redraws things) I used the position of the buttons to calculate my x and y values. I also used JLabels as separators for grid layout. You needn't do this. In fact I would encourage you to look through layout managers and find what works best (which may be a combination of layout managers and different panels).

import java.awt.Color;
import java.awt.Graphics;
import java.awt.GridLayout;
import java.awt.Point;

import javax.swing.JButton;
import javax.swing.JLabel;
import javax.swing.JPanel;


public class MyPanel extends JPanel{

    JButton button1 = new JButton("Button 1");
    JButton button2 = new JButton("Button 2");
    JButton button3 = new JButton("Button 3");
    JButton button4 = new JButton("Button 4");

    public MyPanel() {
        setLayout(new GridLayout(3, 3));
        setSize(512, 512);
        setOpaque(false);
        add(button1);
        add(new JLabel());
        add(button2);
        add(new JLabel());
        add(new JLabel());
        add(new JLabel());
        add(button3);
        add(new JLabel());
        add(button4);
    }

    @Override
    protected void paintComponent(Graphics g) {
        super.paintComponent(g);

        g.setColor(Color.RED);
        Point p1 = button1.getLocation();
        p1.x += button1.getWidth() / 2;
        p1.y += button1.getHeight() / 2;
        Point p2 = button4.getLocation();
        p2.x += button4.getWidth() / 2;
        p2.y += button4.getHeight() / 2;
        g.drawLine(p1.x, p1.y, p2.x, p2.y);

        Point p3 = button2.getLocation();
        p3.x += button2.getWidth() / 2;
        p3.y += button2.getHeight() / 2;
        Point p4 = button3.getLocation();
        p4.x += button3.getWidth() / 2;
        p4.y += button3.getHeight() / 2;
        g.setColor(Color.BLUE);
        g.drawLine(p3.x, p3.y, p4.x, p4.y);

    }


}