Flutter从头到尾设计一款简单的五子棋游戏(四) | 设计模式代码完结
开启生长之旅!这是我参加「日新方案 12 月更文应战」的第13天,点击查看活动概况

前语

在前面几篇的文章中,咱们现已今天在温习了原有的享元形式上,再介绍了桥接形式以及状态形式。完成了关于棋子的创建以及玩家的状态咱们也就现已规划完成,现在咱们将把悔棋、以及App主题改换加上,一切规划形式基本就功德圆满了。留意,咱们这次的规划是彻底运用Flutter自带的包进行规划。

正文

1. 规划总图纸

现在咱们先放个整个项目所运用到的类图的概览图。然后,咱们将把主题规划运用的笼统工厂形式以及悔棋所运用的备忘录形式给大家解说。

Flutter从头到尾设计一款简单的五子棋游戏(四) | 设计模式代码完结

2. 主题切换——笼统工厂形式

考虑到玩家或许会在晚上悄悄在被窝玩手机,咱们专门规划了一套深色的主题,更好地对玩家的眼睛进行维护。那这两套主题怎么规划与切换呢?

由于主题所需求进行改换的一些组件都是固定的,因而在这儿咱们运用笼统工厂形式。

类图如下:

Flutter从头到尾设计一款简单的五子棋游戏(四) | 设计模式代码完结

关于笼统工厂,咱们界说如下:

abstract class ThemeFactory {
 Theme getTheme();  
}

关于蓝色的默许主题工厂(详细工厂),咱们界说如下:

class BlueThemeFactory extends ThemeFactory{
 @override  
 Theme getTheme() {  
 return new BlueTheme();  
 }  
}

同样地,关于深色的主题工厂(详细工厂),咱们界说如下:

class BlackThemeFactory extends ThemeFactory{
 @override  
 Theme getTheme() {  
 return new BlackTheme();  
 }  
}

工厂类的规划就完成了,下面咱们对着类图规划产品类,下方是笼统产品:

abstract class Theme{
 Color getThemeColor();  
}

然后咱们进行详细的产品规划,下方分别是蓝色主题类,以及深色主题类:


import 'Theme.dart' as t;// 留意,这儿的theme是刚刚咱们自己界说的,由于跟Flutter自己的重名,一切需求运用别号
class BlueTheme extends t.Theme{  
 @override  
 Color getThemeColor() {  
 return Colors.blue;  
 }  
}
class BlackTheme extends t.Theme{  
 @override  
 Color getThemeColor() {  
 return Colors.black;  
 }  
}

留意,这儿的theme是刚刚咱们自己界说的,由于跟Flutter自己的重名,所以需求运用别号。

到这儿,主题的规划形式就规划完了。

效果如下:

Flutter从头到尾设计一款简单的五子棋游戏(四) | 设计模式代码完结

Flutter从头到尾设计一款简单的五子棋游戏(四) | 设计模式代码完结

3.玩家的下棋步骤记录——备忘录形式

首要,先放上类图:

Flutter从头到尾设计一款简单的五子棋游戏(四) | 设计模式代码完结

关于Checkerboard(原发器)的规划如下:

class Checkerboard {
 Checkerboard._();  
 static Checkerboard? _originator;  
 static getInstance(){  
 if( _originator == null){  
 _originator = Checkerboard._();  
 }  
 return _originator;  
 }  
 bool _canAdd = true; //是否需求增加  
  List<Position> _state = [];  
 List<Position> get state{  
 return _state;  
 }  
 CareTaker _careTaker = CareTaker();  
 add(Position position) {  
 if(_canAdd) { //由于每次烘托完默许会把最终一个下棋的方位增加上,但在悔棋阶段最终一个是不需求,因而需求这个判断。  
      _state.add(position);  
 _careTaker.add(_save());  
 }  
 _canAdd = true;  
 }  
 _from(Memo memo) {  
 this._state = memo.state;  
 }  
 Memo _save() {  
 return new Memo()..state.addAll(this._state);  
 }  
 clean(){  
 _state = [];  
 }  
 undo() {  
 Memo memo = _careTaker.getLast();  
 _from(memo);  
 _canAdd = false;  
 }  
}

Checkerboard这儿就首要担任对外暴露运用了,其内部有一个担任人类。

而下面的担任人类则首要将信息进行缓存以及记录,是真正的缓存保存者。

class CareTaker{
 List<Memo> mementoList = [];  
 void add(Memo memo) {  
 mementoList.add(memo);  
 if (mementoList.length > 10) {  
 mementoList.removeRange(0, 1);  
 }  
 }  
 Memo get(int index){  
 return mementoList[index];  
 }  
 Memo getLast() {  
 Memo memo = mementoList[mementoList.length-3];  
 mementoList.removeLast();  
 mementoList.removeLast();  
 return memo;  
 }  
}

下面的Memo则是一个数据类,保存了棋盘上一切棋子的方位数据。

class Memo {
 List<Position> state = [];  
}

4.总结

至此,一切的规划形式都现已规划完成了,咱们下一步的方针便是将这些规划形式与Flutter交融起来,让整个App能动起来,用起来。