开启掘金成长之旅！这是我参与「掘金日新计划 · 12 月更文挑战」的第12天，点击查看活动详情
前言
在前面两篇文章中，我们已经介绍了设计一款五子棋游戏的所使用的一些思想以及部分的代码，以便我们更好地对设计模式进行理解。这次我们全面把代码铺开来讲，注意，我们这次的设计是完全使用Flutter自带的包进行设计。
正文
1.前情回顾
在上一篇文章中，我们对棋子的代码进行了设计。现在我们再进行回顾一下。先放个整个项目所使用到的类图的概览图。
棋子创建——享元模式
对于棋子的创建，我们使用享元模式，因为享元模式的设计思路就是将大量相同的对象进行复用。
在本项目中，棋子创建的类图如下：
在编码上，我们定义了抽象类Chess，他本质上是一个抽象享元。
///棋子的抽象类
///使用了桥接模式，外观和颜色是两个不同的维度
abstract class Chess{
Color? _color;
Color get color => _color!;
ChessShape? _chessShape;
ChessShape get chessShape => _chessShape!;
set chessShape(ChessShape? __chessShape);
}
随后对具体的两个棋子进行了设计。也就是设计模式中的具体享元进行设计。
而对于具体的黑白棋子，则需要继承自Chess类
class BlackChess extends Chess{
BlackChess() {
_color = Colors.black;
}
set chessShape(ChessShape? __chessShape) {
super._chessShape = __chessShape;
}
}
白色棋子同理，代码如下：
class WhiteChess extends Chess{
WhiteChess() {
_color = Colors.*white*;
}
set chessShape(ChessShape? __chessShape) {
super._chessShape = __chessShape;
}
}
而对于享元工厂，我们则可以使用单例模式进行创建。
类图如下：
代码如下：
class ChessFlyweightFactory {
ChessFlyweightFactory._();
static ChessFlyweightFactory? *_factory*;
static ChessFlyweightFactory *getInstance*() {
if ( *_factory* == null) {
*_factory* = ChessFlyweightFactory._();
}
return *_factory*!;
}
HashMap<String, Chess> _hashMap = HashMap<String, Chess>();
Chess getChess(String type) {
Chess chess;
if (_hashMap[type] != null) {
chess = _hashMap[type]!;
} else {
if (type == "white") {
chess = WhiteChess();
} else {
chess = BlackChess();
}
_hashMap[type] = chess;
}
return chess;
}
}
至此，我们对基本的棋子编写也已经完成了。
2.其他设计
棋子形状——桥接模式
因为形状主要是用来装饰棋子的，比如玩家根据自身等级可以购买不同的棋子皮肤、形状，因此我们这里抽出来单独设计。这里使用到
在本次的设计中，我们的棋子可以有方棋子和圆棋子。
类图如下：
由于Chess、WhiteChess、BlackChess已经在上方给出了代码， 因此这里我们只给出剩下的三个类。
abstract class ChessShape{
int? _shape;
int get shape => _shape!;
set shape(int value) {
_shape = value;
}
}
ChessShape是一个抽象类，定义了其返回的形状类型。这里我们使用1代表圆，0代表方。具体的类设计如下：
class CircleShape extends ChessShape{
CircleShape(){
shape = 1;
}
}
class RectShape extends ChessShape{
RectShape(){
shape = 2;
}
}
玩家状态的切换——状态模式
游戏玩家状态的可以进行切换，如是否可以悔棋等，因此在这里使用了状态模式。
玩家类设计如下：
class UserContext {
late State _state;
State get state => _state;
UserContext(){
_state = StartState(this);
}
play() {
_state.play();
}
//悔棋只能悔棋三次
bool regretChess() {
return _state.regretChess();
}
// 认输 10步之内不能认输
bool surrender() {
return _state.surrender();
}
setState(State state){
_state = state;
}
void reset() {
_state = StartState(this);
}
}
这里对玩家的一些动作进行了限制，比如悔棋只能悔棋三次，前10步不能认输。这个玩家类在状态模式中也叫环境类。
随后我们设计抽象状态类：
abstract class State {
int _step = 0;
int get step => _step;
int _reg = 0;
int get reg => _reg;
UserContext _userContext;
State(UserContext userContext):_userContext = userContext;
// 悔棋只能悔棋三次
bool regretChess();
// 认输10步之内不能认输
bool surrender();
play() {
_step++;
}
}
随后设计具体的状态类：
class StartState extends State {
StartState(UserContext userContext) : super(userContext);
//悔棋只能悔棋三次
@override
bool regretChess(){
return false;
}
@override
bool surrender() {
return false;
}
@override
play() {
super.play();
if(_step >= 4) {
_userContext.setState(MidState(_userContext).._step = _step.._reg = _reg);
}
}
}
在开始状态中，我们设置不能悔棋，也不能投降。当步数大于4时，我们进行状态转移到MidState。效果图如下：
class MidState extends State {
MidState(UserContext userContext) : super(userContext);
@override
int get _reg{
return super._reg;
}
//悔棋只能悔棋三次
@override
bool regretChess(){
_reg++;
if(_reg == 3) {
print('切换到白热化阶段');
_userContext.setState(EndState(_userContext).._step = _step.._reg = _reg);
}
return true;
}
@override
bool surrender() {
return true;
}
}
在这个MidState中，我们允许投降，也允许悔棋。当悔棋超过3次，则进入到EndState。效果图如下：
class EndState extends State {
EndState(UserContext userContext) : super(userContext);
//悔棋只能悔棋三次
@override
regretChess(){
return false;
}
@override
surrender() {
return true;
}
}
在EndState中，我们只允许投降。效果图如下：
3.总结
今天在复习了原有的享元模式上，再介绍了桥接模式以及状态模式。关于棋子的创建以及玩家的状态我们也就已经设计完成，后续我们将把悔棋、以及App主题变换加上，基本就大功告成了。
