Theme

的概念#xff0c;支持主题的扩…手撸俄罗斯方块五——游戏主题

当确定游戏载体如控制台后界面将呈现出来。

但是游戏的背景色、方块的颜色、方框颜色都应该支持扩展。

Theme

系统抽象了一个AbstractTheme它将一些渲染过程中的行为进行了抽象抽象定义如下

abstract

指代外框对象的元素通过修改其内容改变显示样式。

*/abstract

outStyle(outer:

指代内框对象的元素通过修改其内容改变显示样式。

*/abstract

innerStyle(inner:

指代分数对象的元素通过修改其内容改变显示样式。

*/abstract

scoreStyle(score:

当前小方块如一个IBlock会拆分成4各BlockItem。

*

param

当前小方块的位置信息包括x轴和y轴的坐标等信息*/abstract

any,

为了使主题生效需要在AbstractCanvas子类中调用Theme提供的方法。

这里以ConsoleCanvas为例它的实现如下

export

this.getOutterLine(this.outerLeftTopChar

this.rightWidth,

this.outerRightTopChar);printArray.push(outLine1);}//

渲染scoreconst

this.theme.scoreTemplate(score);const

scoreConsoleChar

ConsoleChar.create(scoreText);this.theme.scoreStyle(scoreConsoleChar);//

leftSpace

this.getOutterLine(this.outerLeftVerticalChar)

leftSpace)

this.getOutterLine(this.outerRightVerticalChar);printArray.push(scoreLine);//

line1

this.getOutterLine(this.outerLeftVerticalChar)

this.getInnerLine(this.innerLeftTopChar);for

(let

this.getInnerLine(bold(this.horizonalChar));}

else

this.getInnerLine(this.horizonalChar);}}line1

this.getInnerLine(this.innerRightTopChar)

this.createChar(this.rightWidth)

this.getOutterLine(this.outerRightVerticalChar);printArray.push(line1);let

line2

this.getOutterLine(this.outerLeftVerticalChar)

this.getInnerLine(this.innerLeftBottomChar);for

(let

this.getInnerLine(bold(this.horizonalChar));}

else

this.getInnerLine(this.horizonalChar);}}line2

this.getInnerLine(this.innerRightBottomChar)

this.createChar(this.rightWidth)

this.getOutterLine(this.outerRightVerticalChar);printArray.push(line2);if

(!this.isHideOuter)

this.getOutterLine(this.outerLeftBottomChar

this.rightWidth,

this.outerRightBottomChar);printArray.push(outLine2);}if

(this.exitMessage)

{printArray.push(this.exitMessage);}

else

{printArray.push();}process.stdout.write(this.handleOutput(outLength,

}我们看到渲染上边框调用了getOutterLine方法这个方法是在AbstractCanvas中定义的它的实现如下

export

|);this.theme.outStyle(consoleChar);return

consoleChar.ch;}//

类似的对于内边框的渲染也是调用了getInnerLine方法它的实现如下

export

|);this.theme.innerStyle(consoleChar);return

consoleChar.ch;}//

我们可以通过继承AbstractTheme实现自己的主题比如实现一个RedTheme

export

https://github.com/shushanfx/tetris

自此手撸俄罗斯方块的代码部分就讲到这里后续将依次为开始展开从俄罗斯方块开始我们能走多远。