ソースを参照

docs:fix>统一文档格式,2048修改中

jxing 4 年 前
コミット
38e11d9da8

+ 1 - 1
docs/.vuepress/components/edit/items/edittext/edittext.vue

@@ -261,7 +261,7 @@ class TestView extends SGraphView {
             /**
              * 鼠标抬起事件
              *
-             * @param    event   事件参数
+             * @param  event   事件参数
              */
             onMouseUp(event) {
                 const dom = "<textarea autofocus ref='textarea' class='text'></textarea>";

+ 1 - 1
docs/.vuepress/components/engine/arrow.vue

@@ -66,7 +66,7 @@ class Polyline extends SGraphItem {
     /**
      * 矩形数据类型绘制
      *
-     * @return  边界区域
+     * @return 边界区域
      */
     boundingRect(): SRect {
         return new SRect(0, 0, 2000, 1800);

+ 1 - 1
docs/.vuepress/components/engine/composite.vue

@@ -52,7 +52,7 @@ class Circle extends SGraphItem {
     /**
      * 矩形数据类型绘制
      *
-     * @return  边界区域
+     * @return 边界区域
      */
     boundingRect(): SRect {
         return new SRect(-500, -500, 1500, 1500);

+ 446 - 31
docs/.vuepress/components/engine/demo/2048.vue

@@ -1,25 +1,88 @@
 <template>
-    <div>
-        <canvas id="canvas" width="400" height="400"></canvas>
-        <el-button @click="reset" type="primary">重新开始</el-button>
+    <div style="position: relative;">
+        <canvas id="canvas" width="400" height="400" style="border: 1px #ccc solid;background: #bbada0" tabindex="0"/>
+        <div style="position: absolute;top: 0;left: 450px;">
+            <p>分数:{{ view ? view.score : 0 }}</p>
+            <el-button @click="reset" type="primary">重新开始</el-button>
+            <p>W:上移</p>
+            <p>S:下移</p>
+            <p>A:左移</p>
+            <p>D:右移</p>
+        </div>
     </div>
 </template>
 
 <script lang="ts">
-import { Component, Vue } from "vue-property-decorator"
-import { SCanvasView, SColor, SPainter, STextAlign } from "@persagy-web/draw/lib";
+import {Component, Vue} from "vue-property-decorator"
+import {SCanvasView, SColor, SPainter, STextAlign, STextBaseLine} from "@persagy-web/draw/lib";
 
 /**
- * 2048
+ * 游戏 2048
  *
  * @author 郝洁 <haojie@persagy.com>
  */
 class GameView extends SCanvasView {
-    /** 游戏结束 */
+    /** 网格数组初始化 */
+    gridMap = Array(4).fill(null).map(() => Array(4).fill(0))
+    /** 游戏结束标识 */
     gameOver: boolean = false
-    /** 格子宽度 */
-    box_width: number = this.width * 0.8 * 0.25;
-    margin_width: number = this.width * 0.2 * 0.20;
+    /** 游戏累计分数 */
+    score = 0;
+    /** 数字画笔 */
+    // numPaint = new SPainter();
+    /** 文字画笔 */
+    // textPaint = new SPainter();
+    /** 格子顏色 */
+    color = {
+        0: {
+            font: "#ffffffff",
+            background: "#eee4da59"
+        },
+        2: {
+            font: "#776e65",
+            background: "#eee4da"
+        },
+        4: {
+            font: "#776e65",
+            background: "#ede0c8"
+        },
+        8: {
+            font: "#f9f6f2",
+            background: "#f2b179"
+        },
+        16: {
+            font: "#f9f6f2",
+            background: "#f59563"
+        },
+        32: {
+            font: "#f9f6f2",
+            background: "#f67c5f"
+        },
+        64: {
+            font: "#f9f6f2",
+            background: "#f65e3b"
+        },
+        128: {
+            font: "#f9f6f2",
+            background: "#edcf72"
+        },
+        256: {
+            font: "#f9f6f2",
+            background: "#edcc61"
+        },
+        512: {
+            font: "#f9f6f2",
+            background: "#edc850"
+        },
+        1024: {
+            font: "#f9f6f2",
+            background: "#edc53f"
+        },
+        2048: {
+            font: "#f9f6f2",
+            background: "#edc22e"
+        },
+    };
 
     /**
      * 构造函数
@@ -28,6 +91,7 @@ class GameView extends SCanvasView {
      */
     constructor(id: string) {
         super(id);
+        // 初始化游戏
         this.init()
     }
 
@@ -35,16 +99,32 @@ class GameView extends SCanvasView {
      * 初始化游戏
      */
     init(): void {
+        // 遍历网格的行
+        for (let r = 0; r < 4; r++) {
+            // 遍历网格的列
+            for (let c = 0; c < 4; c++) {
+                this.gridMap[r][c] = 0
+            }
+        }
+        // 随机填充两个 2
+        this.gridMap[Math.floor(Math.random() * 4)][Math.floor(Math.random() * 4)] = 2
+        this.gridMap[Math.floor(Math.random() * 4)][Math.floor(Math.random() * 4)] = 2
+
+        // 初始化游戏分数
+        this.score = 0
+
+        // 游戏结束标识标记
+        this.gameOver = false
 
     }
 
     /**
      * 键盘按下事件
      *
-     * @param   event   事件对象
+     * @param event   事件对象
      */
     onKeyDown(event: KeyboardEvent): void {
-        if ( /* 游戏结束*/ 1) {
+        if (this.gameOver) {
             return;
         }
         // 按键判断
@@ -52,94 +132,429 @@ class GameView extends SCanvasView {
             case "KeyW": // 上移动作
             case "ArrowUp":
                 // 判断游戏是否继续,底部产生随机位置随机数
+                this.moveUp();
                 break;
 
             case "KeyA": // 左移动作
             case "ArrowLeft":
                 // 判断游戏是否继续,右部产生随机位置随机数
+                this.moveLeft();
                 break;
 
             case "KeyD":    // 右移动作
             case "ArrowRight":
+                this.moveRight();
                 // 判断游戏是否继续,左部产生随机位置随机数
                 break;
             // 按键 下
             case "KeyS": // 下移动作
             case "ArrowDown":
                 // 判断游戏是否继续,上部产生随机位置随机数
+                this.moveDown();
                 break;
             default :
             // do nothing
         }
-
         // 更新视图
+        this.update();
     }
 
     /**
-     * 生成随机的格子
+     * 上移
      */
-    generateOneNumber(): void {
-        if ( /* 游戏结束*/ 1) {
-            return;
+    moveUp(): void {
+        // 数字是否移动
+        let moved = false
+        // 遍历所有的列
+        for (let i = 0; i < 4; i++) {
+            // 进行合并操作的列表
+            const numArr = Array(4)
+            // 依次从网格中取要合并的元素
+            for (let j = 0; j < 4; j++) {
+                // 取数
+                numArr[j] = this.gridMap[j][i]
+            }
+            // 移动与合并
+            if (this.moveNum(numArr)) {
+                moved = true;
+                // 合并后的下列表反填入网格
+                for (let j = 0; j < 4; j++) {
+                    // 反填
+                    this.gridMap[j][i] = numArr[j]
+                }
+            }
         }
 
-        //随机一个位置,取新方块出现的位置
+        // 如果移动了数字
+        if (moved) {
+            // 索引列表
+            const indexArr = []
+            // 依次从网格取空格元素的下标索引
+            for (let i = 0; i < 4; i++) {
+                // 如果为空格
+                if (this.gridMap[3][i] == 0) {
+                    // 保存下标
+                    indexArr.push(i)
+                }
+            }
+            // 生成新的数的下标
+            const index = this.newIndex(indexArr);
+            if (index >= 0) {
+                this.gridMap[3][index] = this.newNum()
+            }
+        }
+        // 测试是否游戏结束
+        this.gameOver = this.checkGameover()
+    }
 
-        //随机一个数字 2 或 4 ,在随机位置显示随机数字
+    /**
+     * 下移
+     */
+    moveDown(): void {
+        // 是否移动了数字
+        let moved = false;
 
-        return;
+        // 遍历所有列
+        for (let i = 0; i < 4; i++) {
+            // 进行合并操作的列表
+            const numArr = Array(4);
+            // 依次从网格中取要合并的元素
+            for (let j = 0; j < 4; j++) {
+                // 取数
+                numArr[j] = this.gridMap[3 - j][i];
+            }
+
+            // 移动与合并
+            if (this.moveNum(numArr)) {
+                moved = true;
+                // 合并后的下列表反填入网格
+                for (let j = 0; j < 4; j++) {
+                    // 反填
+                    this.gridMap[3 - j][i] = numArr[j];
+                }
+            }
+        }
+
+        // 如果移动了数字
+        if (moved) {
+            // 索引列表
+            const indexArr = [];
+            // 依次从网格取空格元素的下标索引
+            for (let i = 0; i < 4; i++) {
+                // 如果为空格
+                if (this.gridMap[0][i] == 0) {
+                    // 保存下标
+                    indexArr.push(i)
+                }
+            }
+
+            // 新生成的数的下标
+            const index = this.newIndex(indexArr);
+            if (index >= 0) {
+                this.gridMap[0][index] = this.newNum();
+            }
+        }
+
+        // 测试是否游戏结束
+        this.gameOver = this.checkGameover();
     }
 
     /**
-     * 新生成的数的位置,位置随机产生,位置不可被占用,不可重叠
+     * 左移
+     */
+    moveLeft(): void {
+        // 是否移动了数字
+        let moved = false;
+
+        // 遍历所有行
+        for (let i = 0; i < 4; i++) {
+            // 进行合并操作的列表
+            const numArr = Array(4);
+            // 依次从网格中取要合并的元素
+            for (let j = 0; j < 4; j++) {
+                // 取数
+                numArr[j] = this.gridMap[i][j];
+            }
+
+            // 移动与合并
+            if (this.moveNum(numArr)) {
+                moved = true;
+                // 合并后的下列表反填入网格
+                for (let j = 0; j < 4; j++) {
+                    // 反填
+                    this.gridMap[i][j] = numArr[j];
+                }
+            }
+        }
+
+        // 如果移动了数字
+        if (moved) {
+            // 索引列表
+            const indexArr = [];
+            // 依次从网格取空格元素的下标索引
+            for (let i = 0; i < 4; i++) {
+                // 如果为空格
+                if (this.gridMap[i][3] == 0) {
+                    // 保存下标
+                    indexArr.push(i)
+                }
+            }
+
+            // 新生成的数的下标
+            const index = this.newIndex(indexArr);
+            if (index >= 0) {
+                this.gridMap[index][3] = this.newNum();
+            }
+        }
+
+        // 测试是否游戏结束
+        this.gameOver = this.checkGameover();
+    }
+
+    /**
+     * 右移移
+     */
+    moveRight(): void {
+        // 是否移动了数字
+        let moved = false;
+
+        // 遍历所有行
+        for (let i = 0; i < 4; i++) {
+            // 进行合并操作的列表
+            const numArr = Array(4);
+            // 依次从网格中取要合并的元素
+            for (let j = 0; j < 4; j++) {
+                // 取数
+                numArr[j] = this.gridMap[i][3 - j];
+            }
+
+            // 移动与合并
+            if (this.moveNum(numArr)) {
+                moved = true;
+                // 合并后的下列表反填入网格
+                for (let j = 0; j < 4; j++) {
+                    // 反填
+                    this.gridMap[i][3 - j] = numArr[j];
+                }
+            }
+        }
+
+        // 如果移动了数字
+        if (moved) {
+            // 索引列表
+            const indexArr = [];
+            // 依次从网格取空格元素的下标索引
+            for (let i = 0; i < 4; i++) {
+                // 如果为空格
+                if (this.gridMap[i][0] == 0) {
+                    // 保存下标
+                    indexArr.push(i)
+                }
+            }
+
+            // 新生成的数的下标
+            const index = this.newIndex(indexArr);
+            if (index >= 0) {
+                this.gridMap[index][0] = this.newNum();
+            }
+        }
+
+        // 测试是否游戏结束
+        this.gameOver = this.checkGameover();
+    }
+
+    /**
+     * 移动或合并数字,数据相同则合并
      *
-     * @param indexArray    小格子对应的索引
+     * @param numArr  长度为 4 的数组
+     * @return 移动数字返回 true,否则返回 false
      */
-    newLocationRandomNumber(indexArray: []) {
+    private moveNum(numArr: number[]): boolean {
+        // 记录所有合并数字的和
+        let moved = false;
 
+        // 从第二格开始取数
+        for (let i = 1; i < numArr.length; i++) {
+            const num = numArr[i];
+            // 如果选定的格为0,则取下一格
+            if (num == 0) {
+                continue;
+            }
+
+            // 将除去的数往前移
+            for (let j = i = 1; j >= 0; j--) {
+                if (numArr[j] == 0) {
+                    // 前移
+                    numArr[j] = num;
+                    numArr[j + 1] = 0;
+                    moved = true
+                } else if (numArr[j] == num) {
+                    // 合并
+                    numArr[j] += num;
+                    numArr[j + 1] = 0;
+                    this.score += num * 2;
+                    moved = true;
+                    break;
+                } else {
+                    break;
+                }
+            }
+        }
+        // 返回所有合并的数组的和
+        return moved
     }
 
     /**
+     * 新生成数字的下标
+     *
+     * @param indexArr 空格的下标列表的长度大于 0,返回随机的下标;否则返回 0。
+     */
+    private newIndex(indexArr: number[]): number {
+        return indexArr.length > 0 ? indexArr[Math.floor(Math.random() * indexArr.length)] : -1
+    }
+
+    /**
+     * 返回新生成的数(2 或 4)
+     *
+     * @return 新生成的数(2 或 4)
+     */
+    private newNum(): number {
+        // 30% 的概率为 4,70% 概率为 2。调整比例可增加或减小游戏的难度。
+        return Math.random() > 0.3 ? 4 : 2
+    }
+
+    /**
+     * 检查是否游戏结束。(没有为空的格,没有相邻两格的数字相同)
+     *
+     * @return 如果结束返回 true,否则返回 false;
+     */
+    private checkGameover(): boolean {
+        // 依次遍历行与列
+        for (let i = 0; i < 4; i++) {
+            // 依次取相邻(横向/纵向)的两个格的数字
+            for (let j = 0; j < 3; j++) {
+                // 判断相邻的格是否相同,或是否为空。
+                if (this.gridMap[i][j] == this.gridMap[i][j + 1] || this.gridMap[i][j] == 0 || this.gridMap[i][j + 1] == 0
+                    || this.gridMap[j][i] == this.gridMap[j + 1][i] || this.gridMap[j][i] == 0 || this.gridMap[j + 1][i] == 0) {
+                    // 返回游戏未结束
+                    return false
+                }
+            }
+        }
+        // 返回游戏结束
+        return true
+    }
+
+
+    /**
      * 绘制游戏画面
      *
-     * @param   canvas      画布
+     * @param canvas  绘制对象
      */
     onDraw(canvas: SPainter): void {
         canvas.clearRect(0, 0, this.width, this.height)
-        //绘制格子
+        canvas.pen.color = SColor.Transparent;
+        this.drawMap(canvas);
+        this.drawNum(canvas);
+
+        //如果游戏结束,绘制格子
         if (this.gameOver) {
             canvas.brush.color = SColor.Red;
             canvas.font.size = 40;
             canvas.font.textAlign = STextAlign.Center;
-            canvas.drawText("Game Over");
+            if (Date.now() % 100 > 500) {
+                canvas.drawText("Game Over", 200, 200);
+            }
+            this.update();
+            return
         }
+
+        // 刷新游戏画面
         this.update();
-        return;
     }
+
+    /**
+     * 绘制背景图
+     */
+    drawMap(painter: SPainter) {
+        // 遍历行
+        for (let row = 0; row < 4; row++) {
+            // 遍历列
+            for (let col = 0; col < 4; col++) {
+                this.drawCell(painter, row, col, this.gridMap[row][col]);
+            }
+        }
+    }
+
+    /**
+     * 绘制数字
+     */
+    drawNum(painter: SPainter): void {
+        // 遍历行
+        for (let row = 0; row < 4; row++) {
+            // 遍历列
+            for (let col = 0; col < 4; col++) {
+                this.drawCellNum(painter, row, col, this.gridMap[row][col]);
+            }
+        }
+    }
+
+    /**
+     * 绘制格子中的数字
+     */
+    drawCellNum(painter: SPainter, row: number, col: number, type: number): void {
+        const x = col * 100;
+        const y = row * 100;
+        if (type != 0) {
+            painter.font.textAlign = STextAlign.Center;
+            painter.font.size = 30;
+            // @ts-ignore
+            painter.brush.color = new SColor(this.color[type].font);
+            painter.drawText(type + '', x + 45, y + 45);
+        }
+    }
+
+    /**
+     * 绘制具体格子
+     *
+     * @param painter   绘制对象
+     * @param row       行
+     * @param col       列
+     * @param type      图类型
+     */
+    private drawCell(painter: SPainter, row: number, col: number, type: number): void {
+        const x = col * 100 + 10;
+        const y = row * 100 + 10;
+        painter.brush.color = new SColor(this.color[type].background);
+        painter.drawRoundRect(x, y, 90, 90, 10);
+    }
+
 }
 
 @Component
 export default class Gcanvas extends Vue {
-    /** 实例化 */
-    view: GameView | null = null;
+    /** 实例化 view */
+    view: GameView | null = null
 
     /**
      * 页面挂载完成
      */
     mounted(): void {
-        this.view = new GameView('canvas')
+        this.view = new GameView('canvas');
+        document.getElementById("canvas")!!.focus();
     }
 
     /**
      * 重置操作
      */
     reset(): void {
+        // 初始化游戏
         this.view!!.init()
         document.getElementById("canvas")!!.focus()
     }
 }
 </script>
 
-<style scoped>
+<style scoped lang="less">
 
 </style>

+ 1 - 3
docs/.vuepress/components/engine/demo/2048test.vue

@@ -112,7 +112,7 @@ import {STextAlign} from "@persagy-web/draw/lib";
         /**
          * 键盘按下事件
          *
-         * @param   event   事件对象
+         * @param event   事件对象
          */
         onKeyDown(event: KeyboardEvent): void {
             if (this.isGameOver) {
@@ -339,10 +339,8 @@ import {STextAlign} from "@persagy-web/draw/lib";
          */
         onDraw(painter: SPainter): void {
             painter.clearRect(0, 0, this.width, this.height);
-
             painter.pen.color = SColor.Transparent;
             this.drawMap(painter);
-
             this.drawNum(painter);
 
             // 如果游戏结束,绘制文字

+ 14 - 14
docs/.vuepress/components/engine/demo/elsfk.vue

@@ -249,7 +249,7 @@ class TetrisView extends SCanvasView {
     /**
      * 键盘按下事件
      *
-     * @param   event   事件对象
+     * @param event   事件对象
      */
     onKeyDown(event: KeyboardEvent): void {
         // 如果游戏结束, 不响应任何键
@@ -287,7 +287,7 @@ class TetrisView extends SCanvasView {
     /**
      * 绘制游戏画面
      *
-     * @param   canvas      画布
+     * @param canvas      画布
      */
     onDraw(canvas: SPainter): void {
         // 清空画布
@@ -329,7 +329,7 @@ class TetrisView extends SCanvasView {
     /**
      * 绘制网格
      *
-     * @param   canvas      画布
+     * @param canvas      画布
      */
     private drawGridMap(canvas: SPainter): void {
         // 遍历行
@@ -345,7 +345,7 @@ class TetrisView extends SCanvasView {
     /**
      * 绘制下落的 Box
      *
-     * @param   canvas      画布
+     * @param canvas      画布
      */
     private drawFallBox(canvas: SPainter): void {
         // 遍历 box 的行
@@ -394,10 +394,10 @@ class TetrisView extends SCanvasView {
     /**
      * 画一个小格
      *
-     * @param   canvas      画布
-     * @param   type        小格的图类型
-     * @param   row         行
-     * @param   col         列
+     * @param canvas      画布
+     * @param type        小格的图类型
+     * @param row         行
+     * @param col         列
      */
     private drawGird(canvas: SPainter, type: number, row: number, col: number): void {
         // 如果类型不为 0
@@ -412,11 +412,11 @@ class TetrisView extends SCanvasView {
     /**
      * 判断当前下落的方块是否会发生碰撞
      *
-     * @param   type        下落广场的类型
-     * @param   dir         方块的朝向
-     * @param   row         下落方块的行坐标
-     * @param   col         下落广场的列坐标
-     * @return  碰撞返回 true,否则返回 false 。
+     * @param type        下落广场的类型
+     * @param dir         方块的朝向
+     * @param row         下落方块的行坐标
+     * @param col         下落广场的列坐标
+     * @return 碰撞返回 true,否则返回 false 。
      */
     private checkCollide(type: number, dir: number, row: number, col: number): boolean {
         // 遍历 box 的行
@@ -483,7 +483,7 @@ class TetrisView extends SCanvasView {
     /**
      * 消除满行(即不存在空格的行)
      *
-     * @return  消除的行数
+     * @return 消除的行数
      */
     private removeFullRow(): number {
         // 用于统计消除的行数

+ 1 - 1
docs/.vuepress/components/engine/gradient/GradRect.ts

@@ -35,7 +35,7 @@ export class GradRect extends SGraphItem {
     /**
      * 矩形数据类型绘制
      *
-     * @return  边界区域
+     * @return 边界区域
      */
     boundingRect() {
         return new SRect(

+ 4 - 4
docs/.vuepress/components/scene/Align.vue

@@ -33,7 +33,7 @@ class RectItem extends SGraphItem {
     /**
      * 矩形数据类型绘制
      *
-     * @return  边界区域
+     * @return 边界区域
      */
     boundingRect() {
         return new SRect(0, 0, this.width, this.height);
@@ -74,7 +74,7 @@ class CircleItem extends SGraphItem {
     /**
      * 矩形数据类型绘制
      *
-     * @return  边界区域
+     * @return 边界区域
      */
     boundingRect() {
         return new SRect(0, 0, this.r * 2, this.r * 2);
@@ -110,8 +110,8 @@ class SScene extends SGraphScene {
     /**
      * 鼠标抬起事件
      *
-     * @param    event   事件参数
-     * @return    是否处理
+     * @param  event   事件参数
+     * @return   是否处理
      */
     onMouseUp(event) {
         switch (this.cmd) {

+ 3 - 3
docs/.vuepress/components/scene/Undo1.vue

@@ -46,7 +46,7 @@ class RectItem extends SGraphItem {
     /**
      * 矩形数据类型绘制
      *
-     * @return  边界区域
+     * @return 边界区域
      */
     boundingRect(): SRect {
         return new SRect(0, 0, this.width, this.height);
@@ -119,8 +119,8 @@ class SScene extends SGraphScene {
     /**
      * 鼠标抬起事件
      *
-     * @param    event   事件参数
-     * @return    是否处理
+     * @param  event   事件参数
+     * @return   是否处理
      */
     onMouseUp(event: SMouseEvent): boolean {
         switch (this.cmd) {

+ 20 - 20
docs/.vuepress/components/scene/items/ClockItem.vue

@@ -41,26 +41,26 @@ class SGraphClockItem extends SGraphItem {
     /**
      * 构造函数
      *
-     * @param   parent      指向父Item
-     * @param   size        大小
+     * @param parent      指向父Item
+     * @param size        大小
      */
     constructor(parent: SGraphItem | null, size: SSize);
 
     /**
      * 构造函数
      *
-     * @param   parent      指向父Item
-     * @param   width       宽度
-     * @param   height      高度
+     * @param parent      指向父Item
+     * @param width       宽度
+     * @param height      高度
          */
         constructor(parent: SGraphItem | null, width: number, height: number);
 
         /**
          * 构造函数
          *
-         * @param   parent      指向父Item
-         * @param   width       宽度
-         * @param   height      高度
+         * @param parent      指向父Item
+         * @param width       宽度
+         * @param height      高度
          */
         constructor(
             parent: SGraphItem | null,
@@ -78,7 +78,7 @@ class SGraphClockItem extends SGraphItem {
         /**
          * 对象边界区域
          *
-         * @return  边界区域
+         * @return 边界区域
          */
         boundingRect(): SRect {
             return new SRect(0, 0, this.width, this.height);
@@ -87,7 +87,7 @@ class SGraphClockItem extends SGraphItem {
         /**
          * Item 绘制操作
          *
-         * @param   painter       painter对象
+         * @param painter       painter对象
          */
         onDraw(painter: SPainter): void {
             painter.translate(this.width / 2, this.height / 2);
@@ -104,7 +104,7 @@ class SGraphClockItem extends SGraphItem {
         /**
          * 绘制表刻度
          *
-         * @param   painter     painter对象
+         * @param painter     painter对象
          */
         private drawScale(painter: SPainter): void {
             let scaleLength = Math.max(this.radius / 10.0, 2.0);
@@ -145,10 +145,10 @@ class SGraphClockItem extends SGraphItem {
         /**
          * 绘制时针
          *
-         * @param   painter     painter对象
-         * @param   hour        时
-         * @param   minute      分
-         * @param   second      秒
+         * @param painter     painter对象
+         * @param hour        时
+         * @param minute      分
+         * @param second      秒
          */
         private drawHour(
             painter: SPainter,
@@ -169,9 +169,9 @@ class SGraphClockItem extends SGraphItem {
         /**
          * 绘制秒针
          *
-         * @param   painter     painter对象
-         * @param   minute      分
-         * @param   second      秒
+         * @param painter     painter对象
+         * @param minute      分
+         * @param second      秒
          */
         private drawMinute(
             painter: SPainter,
@@ -189,8 +189,8 @@ class SGraphClockItem extends SGraphItem {
         /**
          * 绘制秒针
          *
-         * @param   painter     painter对象
-         * @param   second      秒
+         * @param painter     painter对象
+         * @param second      秒
          */
         private drawSecond(painter: SPainter, second: number): void {
             painter.save();

+ 20 - 20
docs/.vuepress/components/scene/items/SEditPolygon.vue

@@ -395,8 +395,8 @@ export default {
         /**
          * 鼠标双击事件
          *
-         * @param    event         事件参数
-         * @return    boolean
+         * @param  event         事件参数
+         * @return   boolean
          */
 
         onDoubleClick(event: SMouseEvent): boolean {
@@ -413,8 +413,8 @@ export default {
         /**
          * 键盘事件
          *
-         * @param    event         事件参数
-         * @return    boolean
+         * @param  event         事件参数
+         * @return   boolean
          */
 
         onKeyDown(event: KeyboardEvent): boolean {
@@ -438,8 +438,8 @@ export default {
         /**
          * 键盘键抬起事件
          *
-         * @param    event         事件参数
-         * @return    boolean
+         * @param  event         事件参数
+         * @return   boolean
          */
         onKeyUp(event: KeyboardEvent): boolean {
             if (this._status == SRelationState.Edit) {
@@ -454,8 +454,8 @@ export default {
         /**
          * 鼠标按下事件
          *
-         * @param    event         事件参数
-         * @return    boolean
+         * @param  event         事件参数
+         * @return   boolean
          */
         onMouseDown(event: SMouseEvent): boolean {
             console.log("aaaaaa");
@@ -473,8 +473,8 @@ export default {
         /**
          * 鼠标移入事件
          *
-         * @param    event         事件参数
-         * @return    boolean
+         * @param  event         事件参数
+         * @return   boolean
          */
         onMouseEnter(event: SMouseEvent): boolean {
             return true;
@@ -483,8 +483,8 @@ export default {
         /**
          * 鼠标移出事件
          *
-         * @param    event         事件参数
-         * @return    boolean
+         * @param  event         事件参数
+         * @return   boolean
          */
 
         onMouseLeave(event: SMouseEvent): boolean {
@@ -494,8 +494,8 @@ export default {
         /**
          * 鼠标移动事件
          *
-         * @param    event         事件参数
-         * @return    boolean
+         * @param  event         事件参数
+         * @return   boolean
          */
 
         onMouseMove(event: SMouseEvent): boolean {
@@ -515,8 +515,8 @@ export default {
         /**
          * 鼠标抬起事件
          *
-         * @param    event   事件参数
-         * @return    是否处理
+         * @param  event   事件参数
+         * @return   是否处理
          */
         onMouseUp(event: SMouseEvent): boolean {
             if (this._status == SRelationState.Edit) {
@@ -528,8 +528,8 @@ export default {
         /**
          * 适配事件
          *
-         * @param    event         事件参数
-         * @return    boolean
+         * @param  event         事件参数
+         * @return   boolean
          */
 
         onResize(event: SMouseEvent): boolean {
@@ -539,7 +539,7 @@ export default {
         /**
          * Item对象边界区域
          *
-         * @return  边界区域
+         * @return 边界区域
          */
         boundingRect(): SRect {
             return new SRect(
@@ -553,7 +553,7 @@ export default {
         /**
          * Item绘制操作
          *
-         * @param   painter     绘制对象
+         * @param painter     绘制对象
          */
         onDraw(painter: SPainter): void {
             this.scenceLen = painter.toPx(this.len);

+ 6 - 6
docs/.vuepress/components/scene/items/SImgTextItem.vue

@@ -149,8 +149,8 @@ class SImgTextItem extends SObjectItem {
     /**
      * 宽高发发生变化
      *
-     * @param   oldSize 改之前的大小
-     * @param   newSize 改之后大小
+     * @param oldSize 改之前的大小
+     * @param newSize 改之后大小
      */
     onResize(oldSize: SSize, newSize: SSize) {
         console.log(arguments);
@@ -159,8 +159,8 @@ class SImgTextItem extends SObjectItem {
     /**
      * 鼠标双击事件
      *
-     * @param   event   鼠标事件
-     * @return  是否处理事件
+     * @param event   鼠标事件
+     * @return 是否处理事件
      */
     onDoubleClick(event: SMouseEvent): boolean {
         this.status = SItemStatus.Edit;
@@ -170,7 +170,7 @@ class SImgTextItem extends SObjectItem {
         /**
          * 宽高发发生变化
          *
-         * @return  所有子对象的并集
+         * @return 所有子对象的并集
          */
         boundingRect(): SRect {
             let rect = this.img.boundingRect().adjusted(this.img.pos.x, this.img.pos.y, 0, 0);
@@ -183,7 +183,7 @@ class SImgTextItem extends SObjectItem {
         /**
          * Item绘制操作
          *
-         * @param   painter painter对象
+         * @param painter painter对象
          */
         onDraw(painter: SPainter): void {
             painter.pen.lineWidth = painter.toPx(1);

+ 14 - 14
docs/guides/big/factory/src/SItemFactory.ts

@@ -54,8 +54,8 @@ export class SItemFactory {
     /**
      * 创建柱子item
      *
-     * @param   data    柱子数据
-     * @return  柱子item
+     * @param data    柱子数据
+     * @return 柱子item
      */
     createColumn(data: Column): SColumnItem {
         return new SColumnItem(null, data);
@@ -64,8 +64,8 @@ export class SItemFactory {
     /**
      * 创建墙item
      *
-     * @param   data    墙数据
-     * @return  墙item
+     * @param data    墙数据
+     * @return 墙item
      */
     createWall(data: Wall): SWallItem {
         return new SWallItem(null, data);
@@ -74,8 +74,8 @@ export class SItemFactory {
     /**
      * 创建虚拟墙item
      *
-     * @param   data    虚拟墙数据
-     * @return  虚拟墙item
+     * @param data    虚拟墙数据
+     * @return 虚拟墙item
      */
     createVirtualWall(data: VirtualWall): SVirtualWallItem {
         return new SVirtualWallItem(null, data);
@@ -84,8 +84,8 @@ export class SItemFactory {
     /**
      * 创建空间item
      *
-     * @param   data    空间数据
-     * @return  空间item
+     * @param data    空间数据
+     * @return 空间item
      */
     createSpace(data: Space): SSpaceItem {
         return new SSpaceItem(null, data);
@@ -94,8 +94,8 @@ export class SItemFactory {
     /**
      * 创建门item
      *
-     * @param   data    门数据
-     * @return  门item
+     * @param data    门数据
+     * @return 门item
      */
     createDoor(data: Door): SDoorItem {
         return new SDoorItem(null, data);
@@ -104,8 +104,8 @@ export class SItemFactory {
     /**
      * 创建窗item
      *
-     * @param   data    窗户数据
-     * @return  窗户item
+     * @param data    窗户数据
+     * @return 窗户item
      */
     createWindow(data: Casement): SWindowItem {
         return new SWindowItem(null, data);
@@ -114,8 +114,8 @@ export class SItemFactory {
     /**
      * 创建业务空间item
      *
-     * @param   data    业务空间数据
-     * @return  业务空间item
+     * @param data    业务空间数据
+     * @return 业务空间item
      */
     createZone(data: Zone): SZoneItem {
         return new SZoneItem(null, data);

+ 21 - 21
docs/guides/edit/items/src/EditLineItem.ts

@@ -124,31 +124,31 @@ export class EditLineItem extends SGraphItem {
     /**
      * 构造函数
      *
-     * @param   parent  父级
+     * @param parent  父级
      */
     constructor(parent: SGraphItem | null);
 
     /**
      * 构造函数
      *
-     * @param   parent  父级
-     * @param   line    坐标集合
+     * @param parent  父级
+     * @param line    坐标集合
      */
     constructor(parent: SGraphItem | null, line: SPoint[]);
 
     /**
      * 构造函数
      *
-     * @param   parent  父级
-     * @param   point   第一个点坐标
+     * @param parent  父级
+     * @param point   第一个点坐标
      */
     constructor(parent: SGraphItem | null, point: SPoint);
 
     /**
      * 构造函数
      *
-     * @param   parent  父级
-     * @param   l       坐标集合|第一个点坐标
+     * @param parent  父级
+     * @param l       坐标集合|第一个点坐标
      */
     constructor(parent: SGraphItem | null, l?: SPoint | SPoint[]) {
         super(parent);
@@ -166,7 +166,7 @@ export class EditLineItem extends SGraphItem {
     /**
      * 添加点至数组中
      *
-     * @param   p       添加的点
+     * @param p       添加的点
      */
     private addPoint(p: SPoint): void {
         if (this.line.length < 2) {
@@ -203,8 +203,8 @@ export class EditLineItem extends SGraphItem {
     /**
      * 鼠标按下事件
      *
-     * @param   event   鼠标事件
-     * @return  是否处理事件
+     * @param event   鼠标事件
+     * @return 是否处理事件
      */
     onMouseDown(event: SMouseEvent): boolean {
         this.curIndex = -1;
@@ -258,8 +258,8 @@ export class EditLineItem extends SGraphItem {
     /**
      * 鼠标移动事件
      *
-     * @param   event   鼠标事件
-     * @return  是否处理事件
+     * @param event   鼠标事件
+     * @return 是否处理事件
      */
     onMouseMove(event: SMouseEvent): boolean {
         if (event.shiftKey || this._verAndLeve) {
@@ -284,7 +284,7 @@ export class EditLineItem extends SGraphItem {
     /**
      * 获取点击点与Point[]中的点距离最近点
      *
-     * @param   p   鼠标点击点
+     * @param p   鼠标点击点
      */
     findNearestPoint(p: SPoint): void {
         let len = this.sceneDis;
@@ -318,8 +318,8 @@ export class EditLineItem extends SGraphItem {
     /**
      * 移动后处理所有坐标,并肩原点置为场景原点
      *
-     * @param   x   x坐标
-     * @param   y   y坐标
+     * @param x   x坐标
+     * @param y   y坐标
      */
     moveToOrigin(x: number, y: number): void {
         super.moveToOrigin(x, y);
@@ -335,7 +335,7 @@ export class EditLineItem extends SGraphItem {
     /**
      * shift垂直水平创建或编辑
      *
-     * @param   event   事件
+     * @param event   事件
      */
     compare(event: SMouseEvent): SMouseEvent {
         if (this.line.length) {
@@ -363,9 +363,9 @@ export class EditLineItem extends SGraphItem {
     /**
      * 判断点是否在区域内
      *
-     * @param   x
-     * @param   y
-     * @return  true-是
+     * @param x
+     * @param y
+     * @return true-是
      */
     contains(x: number, y: number): boolean {
         if (this.line.length == 2) {
@@ -417,7 +417,7 @@ export class EditLineItem extends SGraphItem {
     /**
      * Item 对象边界区域
      *
-     * @return  边界区域
+     * @return 边界区域
      */
     boundingRect(): SRect {
         if (this.line.length) {
@@ -453,7 +453,7 @@ export class EditLineItem extends SGraphItem {
     /**
      * Item绘制操作
      *
-     * @param   painter painter对象
+     * @param painter painter对象
      */
     onDraw(painter: SPainter): void {
         this.sceneDis = painter.toPx(this.dis);

+ 10 - 10
docs/guides/edit/items/src/EditPolygonItem.ts

@@ -151,7 +151,7 @@ export class EditPolygonItem extends SGraphItem {
      * 删除点位
      *
      * @param i   删除点所在的索引
-     * @return    SPoint|null。索引不在数组范围则返回null
+     * @return   SPoint|null。索引不在数组范围则返回null
      */
     deletePoint(i: number | null = null): SPoint | null {
         let point = null;
@@ -182,7 +182,7 @@ export class EditPolygonItem extends SGraphItem {
      * @param x   点位得x坐标
      * @param y   点位得y坐标
      * @param i   点位得i坐标
-     * @return    移动对应得点。如果索引无法找到移动顶点,则返回null
+     * @return   移动对应得点。如果索引无法找到移动顶点,则返回null
      */
     movePoint(x: number, y: number, i: number): SPoint | null {
         let point = null;
@@ -200,7 +200,7 @@ export class EditPolygonItem extends SGraphItem {
     /**
      * 打印出多边形数组
      *
-     * @return  顶点数组
+     * @return 顶点数组
      */
     PrintPointList(): SPoint[] {
         return this.pointList;
@@ -643,7 +643,7 @@ export class EditPolygonItem extends SGraphItem {
     /**
      * shift垂直水平创建或编辑
      *
-     * @param   event   事件
+     * @param event   事件
      */
     compare(event: SMouseEvent): SMouseEvent {
         if (this.pointList.length) {
@@ -669,8 +669,8 @@ export class EditPolygonItem extends SGraphItem {
     /**
      * 鼠标抬起事件
      *
-     * @param    event   事件参数
-     * @return    是否处理
+     * @param  event   事件参数
+     * @return   是否处理
      */
     onMouseUp(event: SMouseEvent): boolean {
         if (this.status == SItemStatus.Edit) {
@@ -696,8 +696,8 @@ export class EditPolygonItem extends SGraphItem {
     /**
      * 移动后处理所有坐标,并肩原点置为场景原点
      *
-     * @param   x   x坐标
-     * @param   y   y坐标
+     * @param x   x坐标
+     * @param y   y坐标
      */
     moveToOrigin(x: number, y: number): void {
         super.moveToOrigin(x, y);
@@ -739,7 +739,7 @@ export class EditPolygonItem extends SGraphItem {
     /**
      * Item 对象边界区域
      *
-     * @return  边界区域
+     * @return 边界区域
      */
     boundingRect(): SRect {
         if (this.pointList.length) {
@@ -789,7 +789,7 @@ export class EditPolygonItem extends SGraphItem {
     /**
      * Item绘制操作
      *
-     * @param   painter       painter对象
+     * @param painter       painter对象
      */
     onDraw(painter: SPainter): void {
         this.scenceLen = painter.toPx(this.len);

+ 27 - 27
docs/guides/edit/items/src/EditPolylineItem.ts

@@ -100,24 +100,24 @@ export class EditPolylineItem extends SGraphItem {
     /**
      * 构造函数
      *
-     * @param   parent  父级
-     * @param   list    坐标集合
+     * @param parent  父级
+     * @param list    坐标集合
      */
     constructor(parent: null | SGraphItem, list: SPoint[]);
 
     /**
      * 构造函数
      *
-     * @param   parent  父级
-     * @param   list    第一个坐标
+     * @param parent  父级
+     * @param list    第一个坐标
      */
     constructor(parent: null | SGraphItem, list: SPoint);
 
     /**
      * 构造函数
      *
-     * @param   parent  父级
-     * @param   list    第一个坐标|坐标集合
+     * @param parent  父级
+     * @param list    第一个坐标|坐标集合
      */
     constructor(parent: null | SGraphItem, list: SPoint | SPoint[]) {
         super(parent);
@@ -131,8 +131,8 @@ export class EditPolylineItem extends SGraphItem {
     /**
      * 添加点至数组中
      *
-     * @param   p       添加的点
-     * @param   index   添加到的索引
+     * @param p       添加的点
+     * @param index   添加到的索引
      */
     private addPoint(p: SPoint, index?: number): void {
         if (index && this.canHandle(index)) {
@@ -152,8 +152,8 @@ export class EditPolylineItem extends SGraphItem {
     /**
      * 是否可以添加点到数组中
      *
-     * @param   index   要添加到的索引
-     * @return  boolean 是否可添加
+     * @param index   要添加到的索引
+     * @return boolean 是否可添加
      */
     private canHandle(index: number): boolean {
         return index >= 0 && index <= this.pointList.length;
@@ -162,7 +162,7 @@ export class EditPolylineItem extends SGraphItem {
     /**
      * 根据索引删除点
      *
-     * @param   index   删除点
+     * @param index   删除点
      */
     deletePoint(index: number): void {
         if (this.canHandle(index) && this.pointList.length > 2) {
@@ -185,8 +185,8 @@ export class EditPolylineItem extends SGraphItem {
     /**
      * 鼠标按下事件
      *
-     * @param   event   鼠标事件
-     * @return  boolean 是否处理事件
+     * @param event   鼠标事件
+     * @return boolean 是否处理事件
      */
     onMouseDown(event: SMouseEvent): boolean {
         this.curIndex = -1;
@@ -221,8 +221,8 @@ export class EditPolylineItem extends SGraphItem {
     /**
      * 鼠标移动事件
      *
-     * @param   event   鼠标事件
-     * @return  boolean 是否处理事件
+     * @param event   鼠标事件
+     * @return boolean 是否处理事件
      */
     onMouseMove(event: SMouseEvent): boolean {
         if (event.shiftKey || this.verAndLeve) {
@@ -254,8 +254,8 @@ export class EditPolylineItem extends SGraphItem {
     /**
      * 鼠标抬起事件
      *
-     * @param    event   事件参数
-     * @return    是否处理
+     * @param  event   事件参数
+     * @return   是否处理
      */
     onMouseUp(event: SMouseEvent): boolean {
         if (this.status == SItemStatus.Edit) {
@@ -329,8 +329,8 @@ export class EditPolylineItem extends SGraphItem {
     /**
      * 移动后处理所有坐标,并肩原点置为场景原点
      *
-     * @param   x   x坐标
-     * @param   y   y坐标
+     * @param x   x坐标
+     * @param y   y坐标
      */
     moveToOrigin(x: number, y: number): void {
         super.moveToOrigin(x, y);
@@ -346,7 +346,7 @@ export class EditPolylineItem extends SGraphItem {
     /**
      * 获取点击点与点集中距离最近点
      *
-     * @param   p   鼠标点击点
+     * @param p   鼠标点击点
      */
     findNearestPoint(p: SPoint): void {
         let len = this.sceneDis;
@@ -371,7 +371,7 @@ export class EditPolylineItem extends SGraphItem {
     /**
      * 计算增加点的位置
      *
-     * @param   p   鼠标点击点
+     * @param p   鼠标点击点
      */
     findAddPos(p: SPoint): void {
         let len = SMathUtil.pointToLine(
@@ -401,7 +401,7 @@ export class EditPolylineItem extends SGraphItem {
     /**
      * shift垂直水平创建或编辑
      *
-     * @param   event   事件
+     * @param event   事件
      */
     compare(event: SMouseEvent): SMouseEvent {
         if (this.pointList.length) {
@@ -439,7 +439,7 @@ export class EditPolylineItem extends SGraphItem {
     /**
      * Item对象边界区域
      *
-     * @return  边界区域
+     * @return 边界区域
      */
     boundingRect(): SRect {
         if (this.pointList.length) {
@@ -475,9 +475,9 @@ export class EditPolylineItem extends SGraphItem {
     /**
      * 判断点是否在区域内
      *
-     * @param   x
-     * @param   y
-     * @return  true-是
+     * @param x
+     * @param y
+     * @return true-是
      */
     contains(x: number, y: number): boolean {
         let p = new SPoint(x, y);
@@ -555,7 +555,7 @@ export class EditPolylineItem extends SGraphItem {
     /**
      * Item绘制操作
      *
-     * @param   painter painter对象
+     * @param painter painter对象
      */
     onDraw(painter: SPainter): void {
         // 缓存场景长度

+ 6 - 6
docs/guides/edit/items/src/EditText.ts

@@ -105,8 +105,8 @@ export class EditText extends SObjectItem {
     /**
      * 构造函数
      *
-     * @param   parent      指向父Item
-     * @param   str         文本内容
+     * @param parent      指向父Item
+     * @param str         文本内容
      */
     constructor(parent: SGraphItem | null, str: string = "") {
         super(parent);
@@ -118,7 +118,7 @@ export class EditText extends SObjectItem {
     /**
      * 对象边界区域
      *
-     * @return  边界区域
+     * @return 边界区域
      */
     boundingRect(): SRect {
         return new SRect(
@@ -132,8 +132,8 @@ export class EditText extends SObjectItem {
     /**
      * 移动后处理所有坐标,并肩原点置为场景原点
      *
-     * @param   x   x坐标
-     * @param   y   y坐标
+     * @param x   x坐标
+     * @param y   y坐标
      */
     moveToOrigin(x: number, y: number): void {
         this.moveTo(this.x + x, this.y + y);
@@ -206,7 +206,7 @@ export class EditText extends SObjectItem {
     /**
      * Item绘制操作
      *
-     * @param   painter      绘画类
+     * @param painter      绘画类
      */
     onDraw(painter: SPainter): void {
         if (!(this._painter instanceof SPainter)) { // 实例在 SPainter 绘制对象中

+ 3 - 3
docs/guides/edit/undo/src/SGraphAddCommand.ts

@@ -45,8 +45,8 @@ export class SGraphAddCommand extends SGraphCommand {
     /**
      * 构造函数
      *
-     * @param   scene   item所在场景
-     * @param   item    命令item对象
+     * @param scene   item所在场景
+     * @param item    命令item对象
      */
     constructor(scene: SGraphScene, item: SGraphItem) {
         super(scene);
@@ -59,7 +59,7 @@ export class SGraphAddCommand extends SGraphCommand {
     /**
      * 合并命令
      *
-     * @return  boolean 是否已执行合并
+     * @return boolean 是否已执行合并
      */
     mergeWith(command: SUndoCommand): boolean {
         return false;

+ 1 - 1
docs/guides/edit/undo/src/SGraphCommand.ts

@@ -39,7 +39,7 @@ export abstract class SGraphCommand extends SUndoCommand {
     /**
      * 构造函数
      *
-     * @param   scene       命令所属的场景类
+     * @param scene       命令所属的场景类
      */
     protected constructor(scene: SGraphScene | null) {
         super();

+ 1 - 1
docs/guides/engine/demo/2048.md

@@ -4,7 +4,7 @@
 [[toc]]
 :::
 
-<engine-demo-2048 />
+<engine-demo-2048test />
 
 规则 游戏画布大小 4 * 4