使用JPanel创建一个象棋棋盘

13

我在一个JPanel中使用GridLayout(8,8)作为布局管理器,实现了一个简单的国际象棋棋盘。

我尝试添加用于显示棋盘列名和行号的面板。

目前,我创建了另一个面板,使用BorderLayout作为布局管理器,并在该面板中将棋盘添加到BorderLayout.CENTER。在棋盘本身旁边,我添加了一个使用GridLayout(0,8)的面板,在BorderLayout.SOUTH中添加了一个使用GridLayout(8,0)的面板。由于左侧JPanel中的行数与棋盘中的行数匹配,因此行号完美地放置在了棋盘旁边,但是位于棋盘下方的JPanel中的列名(A、B、C、D、E、F、G、H)位置不正确,因为在BorderLayout.WEST中有一个JPanel。

我应该怎么做才能制作出带有侧边面板以显示棋盘数字/名称的适当国际象棋棋盘呢?

我已经尝试将南面板的布局设置为GridLayout(0,9),并将第一个字段留空,但是左侧面板的宽度与棋盘中的每个字段不相等,因此这不是一个好的解决方法。


https://dev59.com/lkzSa4cB1Zd3GeqPqNpJ 无法帮助您。 - Ashish
没错,Andrew Thompson。我没有问题制作字段,但是我无法像您那样对齐字母和数字面板。您是如何做到的?一个2x2的网格吗? - Jamgreen
1个回答

20

注意

这里所看到的GUI已经得到改进并移至创建一个强大的、可调整大小的Swing Chess GUI

我将保留这个动画GIF(因为它很可爱),以及原始的简化代码(仅125行代码,其他线程上看到的最终代码是218 LOC)。

国际象棋游戏布局

import java.awt.*;
import java.awt.image.BufferedImage;
import javax.swing.*;
import javax.swing.border.*;

public class ChessBoardWithColumnsAndRows {

    private final JPanel gui = new JPanel(new BorderLayout(3, 3));
    private JButton[][] chessBoardSquares = new JButton[8][8];
    private JPanel chessBoard;
    private final JLabel message = new JLabel(
            "Chess Champ is ready to play!");
    private static final String COLS = "ABCDEFGH";

    ChessBoardWithColumnsAndRows() {
        initializeGui();
    }

    public final void initializeGui() {
        // set up the main GUI
        gui.setBorder(new EmptyBorder(5, 5, 5, 5));
        JToolBar tools = new JToolBar();
        tools.setFloatable(false);
        gui.add(tools, BorderLayout.PAGE_START);
        tools.add(new JButton("New")); // TODO - add functionality!
        tools.add(new JButton("Save")); // TODO - add functionality!
        tools.add(new JButton("Restore")); // TODO - add functionality!
        tools.addSeparator();
        tools.add(new JButton("Resign")); // TODO - add functionality!
        tools.addSeparator();
        tools.add(message);

        gui.add(new JLabel("?"), BorderLayout.LINE_START);

        chessBoard = new JPanel(new GridLayout(0, 9));
        chessBoard.setBorder(new LineBorder(Color.BLACK));
        gui.add(chessBoard);

        // create the chess board squares
        Insets buttonMargin = new Insets(0,0,0,0);
        for (int ii = 0; ii < chessBoardSquares.length; ii++) {
            for (int jj = 0; jj < chessBoardSquares[ii].length; jj++) {
                JButton b = new JButton();
                b.setMargin(buttonMargin);
                // our chess pieces are 64x64 px in size, so we'll
                // 'fill this in' using a transparent icon..
                ImageIcon icon = new ImageIcon(
                        new BufferedImage(64, 64, BufferedImage.TYPE_INT_ARGB));
                b.setIcon(icon);
                if ((jj % 2 == 1 && ii % 2 == 1)
                        //) {
                        || (jj % 2 == 0 && ii % 2 == 0)) {
                    b.setBackground(Color.WHITE);
                } else {
                    b.setBackground(Color.BLACK);
                }
                chessBoardSquares[jj][ii] = b;
            }
        }

        //fill the chess board
        chessBoard.add(new JLabel(""));
        // fill the top row
        for (int ii = 0; ii < 8; ii++) {
            chessBoard.add(
                    new JLabel(COLS.substring(ii, ii + 1),
                    SwingConstants.CENTER));
        }
        // fill the black non-pawn piece row
        for (int ii = 0; ii < 8; ii++) {
            for (int jj = 0; jj < 8; jj++) {
                switch (jj) {
                    case 0:
                        chessBoard.add(new JLabel("" + (ii + 1),
                                SwingConstants.CENTER));
                    default:
                        chessBoard.add(chessBoardSquares[jj][ii]);
                }
            }
        }
    }

    public final JComponent getChessBoard() {
        return chessBoard;
    }

    public final JComponent getGui() {
        return gui;
    }

    public static void main(String[] args) {
        Runnable r = new Runnable() {

            @Override
            public void run() {
                ChessBoardWithColumnsAndRows cb =
                        new ChessBoardWithColumnsAndRows();

                JFrame f = new JFrame("ChessChamp");
                f.add(cb.getGui());
                f.setDefaultCloseOperation(JFrame.DISPOSE_ON_CLOSE);
                f.setLocationByPlatform(true);

                // ensures the frame is the minimum size it needs to be
                // in order display the components within it
                f.pack();
                // ensures the minimum size is enforced.
                f.setMinimumSize(f.getSize());
                f.setVisible(true);
            }
        };
        SwingUtilities.invokeLater(r);
    }
}

注意事项

  • 棋盘是由9x9的GridLayout提供的,左侧有列,上方有行。网格布局的第一个单元格是没有文本的标签。
  • 为了简化游戏逻辑,我们维护一个独立的8x8按钮数组。
  • 为了允许键盘功能,我们使用按钮来代表棋盘上的位置。这也提供了内置的焦点指示。去掉按钮的边距,以允许它们缩小到图标的大小。向按钮添加ActionListener,它将响应键盘和鼠标事件。
  • GUI左侧的小问号表示该区域“保留以供将来使用”。我们可以用它来显示被吃掉的棋子列表、选择兵变时棋子的类型、游戏统计等内容...
  • 棋子图片来自于Example images for code and mark-up Q&As,该网站又来自于'Fill' Unicode characters in labels

    使用图像更简单,而填充Unicode字符则更具通用性,并且更加轻量级。即,要支持3种不同棋子风格的3种不同尺寸的4种颜色,需要36个单独的精灵图表!

关于这段代码,有一个问题想问一下。如何为棋盘上的每个按钮添加ActionListener?我在尝试这段代码时,无法弄清楚如何使得每次单击其中一个方格时都能添加一个图像。 - Valrok

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接