1. Използвайте 3x3 GridLayout
2. За всяка от 9-те клетки вземете подизображение:

• За всеки втори компонент добавете етикет с подизображението.
• За всеки друг компонент добавете JButton, от който се премахва интервалът. Използвайте подизображението като икона, но ще ви трябват алтернативни икони, за да посочите фокус, активиране и т.н. Този пример поставя червена рамка около иконата „натиснат“.

import java.awt.*;
import java.awt.event.*;
import java.awt.image.BufferedImage;
import javax.swing.*;
import java.net.URL;
import javax.imageio.ImageIO;

public class CompassButtons {

    public CompassButtons(BufferedImage bi) {
        int w = bi.getWidth();
        int h = bi.getHeight();
        int step = w / 3;
        JPanel p = new JPanel(new GridLayout(3, 3));
        p.setBackground(Color.BLACK);
        int count = 0;
        for (int ii = 0; ii < w; ii += step) {
            for (int jj = 0; jj < h; jj += step) {
                // This is it - GET THE SUB IMAGE
                Image icon = bi.getSubimage(jj, ii, step, step);
                if (count % 2 == 1) {
                    JButton button = new JButton(new ImageIcon(icon));

                    // make it transparent
                    button.setContentAreaFilled(false);

                    // remove border, indicate press using different icon
                    button.setBorder(null);

                    // make a 'pressed' icon..
                    BufferedImage iconPressed = new BufferedImage(
                            step, step, BufferedImage.TYPE_INT_ARGB);
                    Graphics g = iconPressed.getGraphics();
                    g.drawImage(icon, 0, 0, p);
                    g.setColor(Color.RED);
                    g.drawRoundRect(
                            0, 0,
                            iconPressed.getWidth(p) - 1, 
                            iconPressed.getHeight(p) - 1,
                            12, 12);
                    g.dispose();
                    button.setPressedIcon(new ImageIcon(iconPressed));

                    button.setActionCommand("" + count);
                    button.addActionListener((ActionEvent ae) -> {
                        System.out.println(ae.getActionCommand());
                    });

                    p.add(button);
                } else {
                    JLabel label = new JLabel(new ImageIcon(icon));
                    p.add(label);
                }
                count++;
            }
        }
        JPanel center = new JPanel(new GridBagLayout());
        center.setBackground(Color.BLACK);
        center.add(p);
        JOptionPane.showMessageDialog(null, center);
    }

    public static void main(String[] args) throws Exception {
        URL url = new URL("http://i.stack.imgur.com/SNN04.png");
        final BufferedImage bi = ImageIO.read(url);
        SwingUtilities.invokeLater(() -> {
            new CompassButtons(bi);
        });
    }
}

1) трябва да подготвите иконите преди и за всеки 5 JButtons (събитието тук идва от ButtonModel)

• основна икона без фокус

• Икона за isRollover()

• Икона за isPressed()

2) как да зададете икони и да премахнете целия "баласт" от JButton

3) поставете тези 5 JButtons към JPanel с нарисувани кръгове (RemoteSet)

Започвайки от този пример, започнах, като промених MoveButton така:

this.setBorderPainted(false);

Можете да дадете на ControlPanel Мениджър на персонализирани оформления< /a>. Бих добавил също фоново изображение и някакъв вид визуална обратна връзка въз основа на състоянието ButtonModel, както е предложено тук.