Browse Source

俄罗斯方块添加

haojianlong 4 years ago
parent
commit
fe68ed5c54

+ 27 - 12
docs/.vuepress/components/engine/demo/elsfkDifficult.vue

@@ -1,8 +1,10 @@
 <template>
-    <div>
+    <div style="position: relative;">
         <canvas :id="id" width="320" height="620" tabindex="0"/>
-        <p>{{score}}</p>
-        <el-button @click="reset">reset</el-button>
+        <div style="position: absolute;top: 0;left: 350px;">
+            <p>{{score}}</p>
+            <el-button @click="reset">reset</el-button>
+        </div>
     </div>
 </template>
 
@@ -189,11 +191,12 @@
         y = 0;
         t = Date.now();
         gameOver: boolean = false;
-        xzColor: SColor = new SColor(254*this.random(), 254*this.random(), 254*this.random());
+        xzColor: SColor = new SColor();
 
         constructor(id: string) {
             super(id);
             this.initMap();
+            this.initColor();
         }
 
         onKeyDown(event: KeyboardEvent): void {
@@ -238,7 +241,7 @@
             painter.brush.color = new SColor("#2accc7");
             this.drawMap(painter);
 
-            painter.pen.color = SColor.Transparent;
+            painter.pen.color = this.xzColor;
             painter.brush.color = this.xzColor;
             this.drawFk(painter);
 
@@ -269,12 +272,27 @@
             }
         }
 
+        initXZ(){
+            this.x = 5;
+            this.y = 0;
+            this.fkType = Number((Math.random() * 6).toFixed());
+            this.dir = Number((Math.random() * 2).toFixed());
+            this.initColor();
+        }
+
+        initColor(){
+            const a = Number((200*Math.random()).toFixed());
+            const b = Number((200*Math.random()).toFixed());
+            const c = Number((200*Math.random()).toFixed());
+            this.xzColor = new SColor(a, b, c);
+        }
+
         private drawMap(painter: SPainter): void {
             for (let row = 0; row < 22; row++) {
                 for (let col = 0; col < 14; col++) {
                     const n = this.map[row][col];
                     if (n == 1 || n == 2) {
-                        painter.drawRect(col * 30 + 11 - 60, row * 30 + 11, 28, 28);
+                        painter.drawRoundRect(col * 30 + 11 - 60, row * 30 + 11, 28, 28, 6);
                     }
                     // if (n == 0) {
                     //     painter.drawRect(col * 30 + 11 - 60, row * 30 + 11, 28, 28);
@@ -287,7 +305,7 @@
             for (let row = 0; row < 4; row++) {
                 for (let col = 0; col < 4; col++) {
                     if (this.fk[this.fkType * 4 + this.dir][row][col] == 1) {
-                        painter.drawRect((col + this.x) * 30 + 11 - 60, (row + this.y) * 30 + 11, 28, 28);
+                        painter.drawRoundRect((col + this.x) * 30 + 11 - 60, (row + this.y) * 30 + 11, 28, 28, 6);
                     }
                 }
             }
@@ -313,16 +331,12 @@
                 }
             }
 
-            this.x = 5;
-            this.y = 0;
-            this.fkType = Number((Math.random() * 6).toFixed());
-            this.dir = Number((Math.random() * 2).toFixed());
+            this.initXZ();
 
             if(this.isPz(this.x, this.y, this.dir)){
                 this.gameOver = true;
             }
             this.xc();
-            this.xzColor = new SColor(254*this.random(), 254*this.random(), 254*this.random());
         }
 
         private xc(): void{
@@ -371,6 +385,7 @@
 
         reset(){
             this.view!!.initMap();
+            this.view!!.initXZ();
             this.score = 0;
             this.view!!.update();
             document.getElementById(this.id)!!.focus();

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

@@ -4,7 +4,7 @@
 [[toc]]
 :::
 
-## 直线
+## 俄罗斯方块
 
 <engine-demo-elsfk /> 
 

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

@@ -4,7 +4,7 @@
 [[toc]]
 :::
 
-## 直线
+## 俄罗斯方块
 
 <engine-demo-elsfkDifficult />