中国象棋游戏Chess（1） - 棋盘绘制以及棋子的绘制

本项目都使用QT来实现绘图，没有任何第三方的资源。

工程详情：Github

首先将棋盘设计为一个类Board

// Board.h
// Board类实现了棋盘的绘制以及显示
//

#ifndef BOARD_H
#define BOARD_H

#include <QWidget>
#include "Stone.h"

class Board : public QWidget
{
Q_OBJECT
public:
explicit Board(QWidget *parent = 0);

Stone _s[32]; // 定义32个棋子
int _r; // 棋子的半径

// 返回棋盘行列对应的像素坐标
QPoint center(int row, int col);
QPoint center(int id);

void drawStone(QPainter &painter, int id); // 绘制棋子

virtual void paintEvent(QPaintEvent *);

void DrawBackground(); // 设置背景颜色

signals:

public slots:
};

#endif // BOARD_H

// Board.cpp

#include "Board.h"
#include <QPainter> // 绘制棋盘需要

Board::Board(QWidget *parent) : QWidget(parent)
{
for (int i = 0; i < 32; ++i) {
_s[i].init(i);
}
}

// 绘制棋盘
void Board::paintEvent(QPaintEvent *)
{
DrawBackground();

QPainter painter(this);

int d = 40; // d表示棋盘格子的直径，也就是棋子的直径
_r = d / 2;

// 绘制10条横线
for (int i = 1; i <= 10; ++i) {
painter.drawLine(QPoint(d, i * d), QPoint(9 * d, i * d));
}

// 绘制9条竖线
for (int i = 1; i <= 9; ++i) {
if (1 == i || 9 == i) { // 中间有楚河汉界，不能全部都画通
painter.drawLine(QPoint(i * d, d), QPoint(i * d, 10 * d));
}
else {
painter.drawLine(QPoint(i * d, d), QPoint(i * d, 5 * d));
painter.drawLine(QPoint(i * d, 6 * d), QPoint(i * d, 10 * d));
}
}

// 绘制九宫格
painter.drawLine(QPoint(4 * d, d), QPoint(6 * d, 3 * d));
painter.drawLine(QPoint(4 * d, 3 * d), QPoint(6 * d, d));
painter.drawLine(QPoint(4 * d, 8 * d), QPoint(6 * d, 10 * d));
painter.drawLine(QPoint(4 * d, 10 * d), QPoint(6 * d, 8 * d));

// 绘制32个棋子
for (int i = 0; i < 32; ++i) {
drawStone(painter, i);
}
}

// 设置背景颜色
void Board::DrawBackground()
{
QPalette p = this->palette();
<pre style="margin-top: 0px; margin-bottom: 0px;">    p.setColor(<span style=" color:#800080;">QPalette</span>::<span style=" color:#800080;">Window</span>,<span style=" color:#c0c0c0;"> </span><span style=" color:#800080;">QColor</span>(<span style=" color:#000080;">224</span>,<span style=" color:#c0c0c0;"> </span><span style=" color:#000080;">255</span>,<span style=" color:#c0c0c0;"> </span><span style=" color:#000080;">255</span>));

this->setPalette(p);}QPoint Board::center(int row, int col){ QPoint ret; ret.rx() = (col + 1) * _r * 2; ret.ry() = (row + 1) * _r * 2; return ret;}// 重载center函数，方便调用QPoint Board::center(int id){ return center(_s[id]._row, _s[id]._col);}void
Board::drawStone(QPainter &painter, int id){ QPoint c = center(id); QRect rect = QRect(c.x() - _r, c.y() - _r, _r * 2, _r * 2); painter.setBrush(QBrush(QColor(255, 228, 181))); // 将棋子底色设置为鹿皮色 painter.setPen(Qt::black); // 先将画笔设置成黑色绘制圆形 painter.drawEllipse(center(id),
_r, _r); // 绘制圆形 if (_s[id]._red) { // 将上方的棋子字体颜色设置为红色 painter.setPen(Qt::red); } painter.setFont(QFont("system", _r, 700)); // 设置字体大小和类型 painter.drawText(rect, _s[id].getText(), QTextOption(Qt::AlignCenter));}

然后将其中的棋子也设计为一个类Stone

// Stone.h
// 棋子类，存储了棋子的基础信息

#ifndef STONE_H
#define STONE_H

#include <QString>

class Stone
{
public:
Stone();

enum TYPE{JIANG, CHE, PAO, MA, BING, SHI, XIANG};
int _row; // 棋子所处的行
int _col; // 棋子所处的列
int _id; // 棋子的id
bool _dead;
bool _red;
TYPE _type;

// 棋子的初始化
void init(int id);

// 判断_type返回相应字符串
QString getText();

};

#endif // STONE_H

// Stone.cpp

#include "Stone.h"

Stone::Stone()
{

}

void Stone::init(int id)
{
struct {
int row, col;
Stone::TYPE type;
} pos[16] = {
{0, 0, Stone::CHE},
{0, 1, Stone::MA},
{0, 2, Stone::XIANG},
{0, 3, Stone::SHI},
{0, 4, Stone::JIANG},
{0, 5, Stone::SHI},
{0, 6, Stone::XIANG},
{0, 7, Stone::MA},
{0, 8, Stone::CHE},

{2, 1, Stone::PAO},
{2, 7, Stone::PAO},
{3, 0, Stone::BING},
{3, 2, Stone::BING},
{3, 4, Stone::BING},
{3, 6, Stone::BING},
{3, 8, Stone::BING},
};

_id = id;
_dead = false;
_red = id < 16;

if (_red) { // 上方的棋子
_row = pos[id].row;
_col = pos[id].col;
_type = pos[id].type;
}
else { // 下方的棋子
_row = 9 - pos[id - 16].row;
_col = 8 - pos[id - 16].col;
_type = pos[id - 16].type;
}
}

QString Stone::getText()
{
switch (this->_type)
{
case CHE:
return "车";
case MA:
return "马";
case PAO:
return "炮";
case BING:
return "兵";
case JIANG:
return "将";
case SHI:
return "士";
case XIANG:
return "相";
}
return "错误";
}

最后实现的棋盘效果为：