# 俄罗斯方块

**Repository Path**: guodh-su/tetris

## Basic Information

- **Project Name**: 俄罗斯方块
- **Description**: js实现俄罗斯方块小游戏
- **Primary Language**: JavaScript
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2024-03-29
- **Last Updated**: 2024-03-29

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 俄罗斯方块

#### 介绍
js实现俄罗斯方块小游戏



#### 开发思路

1.  创建一个宽为**200px**，高为 **360px**的背景容器
2.  在该容器上创建一个**20*20**的块元素
3.  控制该元素进行移动，每次移动**20px**
4.  将容器进行分割，分割为**18行**，**10列**。行高，列高均为**20**
5.  以16宫格为基准，定义L型形状模型的4个方块位置
6.  控制该模块进行移动 ----> 控制16宫格进行移动
7.  控制该模块进行旋转
8.  控制该模块能在容器中移动
9.  当模块触底时，将块元素变为灰色固定在底部，同时生成一个新的模块
10. 判断模块与模块之间的碰撞，分为**左右接触**和**底部接触**
11. 处理**左右接触**时的场景
12. 处理**底部接触**时候的场景
13. 判断**一行**是否被铺满
14. 清理被铺满的一行
15. 被清理行之上的块元素下落
16. 创建多种样式的模型，根据随机数生成随机样式
17. 创建自动坠落方式

#### 旋转算法

1.  移动后的行 = 移动前的列；
2.  移动后的列 = 3 – 移动前的行；

#### 难点

1.  容器分割，构建16宫格的概念
2.  观察块元素的位置变化，找出其中的规律(旋转算法)
3.  判断块元素与块元素之间的碰撞
4.  判断一行被铺满的情况


#### 特技

1.  使用 Readme\_XXX.md 来支持不同的语言，例如 Readme\_en.md, Readme\_zh.md
2.  Gitee 官方博客 [blog.gitee.com](https://blog.gitee.com)
3.  你可以 [https://gitee.com/explore](https://gitee.com/explore) 这个地址来了解 Gitee 上的优秀开源项目
4.  [GVP](https://gitee.com/gvp) 全称是 Gitee 最有价值开源项目，是综合评定出的优秀开源项目
5.  Gitee 官方提供的使用手册 [https://gitee.com/help](https://gitee.com/help)
6.  Gitee 封面人物是一档用来展示 Gitee 会员风采的栏目 [https://gitee.com/gitee-stars/](https://gitee.com/gitee-stars/)