劉任昌VS Code俄羅斯方塊maintain維護增加顯示方塊

學習心得

之前用STYLE區塊,現在獨立一個STYLE.CSS檔案。 之前用SCRIPT,現在獨立一個SCRIPT.JS檔案。

JS程式碼

 let canvas = document.getElementById("tetris");
let scoreboard = document.getElementById("score");
let ctx = canvas.getContext("2d");
ctx.scale(30,30);
const FOUR = [                              //設定
    [[0,1,0,0],[0,1,0,0],[0,1,0,0],[0,1,0,0]],//I紅
    [[0,1,0],  [0,1,0],  [1,1,0]],            //J橘
    [[0,1,0],  [0,1,0],  [0,1,1]],            //L黃
    [[1,1,0],  [0,1,1],  [0,0,0]],            //Z綠
    [[0,1,1],  [1,1,0],  [0,0,0]],            //S藍
    [[1,1,1],  [0,1,0],  [0,0,0]],            //T靛
    [[1,1],    [1,1],]];             //M紫,正方形,以上共7個
const COLORS = [
    "lightgray","red","orange","yellow","darkgreen","blue","indigo","purple"];
const ROWS = 20;                    //列數ROWS
const COLS = 10;                    //欄數COLumnS
let grid = generateGrid();          //呼叫函數產生20x10格子
let fallingPieceObj = null;
let score = 0;
setInterval(newGameState,200);      //設定間隔500
function newGameState(){            //函數
    checkGrid();
    if(!fallingPieceObj){           //如果空的,產生新方塊
        fallingPieceObj = randomPieceObject();
        renderPiece();};                //新方塊
    moveDown();}   //繼續往下失效
function checkGrid(){ //函數逐列檢查是否滿格rowFiller?
    let count = 0;
    for(let i=0;i3){score+=100}    //刪4列100分
    document.getElementById("score").innerHTML = "劉任昌分數: " + score;}
function generateGrid(){        //函數一開始就設定格子
    let grid = [];              //宣告空白陣列[]
    for(let i=0; i=0 && p=0 && q0){ return true;};}
            else{ return true;}; }; };};
    return false;}
function renderGame(){
    for(let i=0; i

339

340

341

作業列表

  • 截圖很糟糕!要截到重點,不是截圖整個螢幕應付!https://682amber.blogspot.com/2023/11/blog-post_26.html

留言

  1. https://682amber.blogspot.com/2023/11/blog-post_26.html

    回覆刪除
  2. 作者已經移除這則留言。

    回覆刪除
  3. https://huang-pei-kai.blogspot.com/2023/11/vs-codemaintain.html

    回覆刪除
  4. https://meimei20041026.blogspot.com/2023/11/vs-codemaintain.html

    回覆刪除
  5. https://yiminglinn.blogspot.com/2023/11/vs-codemaintain.html

    回覆刪除
  6. https://earnest-person.blogspot.com/2023/11/vs-codemaintain.html

    回覆刪除
  7. https://pcai766.blogspot.com/2023/11/vs-codemaintain.html

    回覆刪除
  8. https://zheng-fu-zhe.blogspot.com/2023/11/blog-post.html

    回覆刪除
  9. https://sushshshaq119.blogspot.com/2023/11/vs-codemaintain.html

    回覆刪除
  10. https://the-most-great-teacher.blogspot.com/2023/11/vs-codemaintain.html

    回覆刪除
  11. https://manranwen.blogspot.com/2023/11/vs-codemaintain.html

    回覆刪除
  12. https://the-most-great-tony11.blogspot.com/2023/11/blog-post.html

    回覆刪除
  13. https://s10655075.blogspot.com/2023/11/vs-codemaintain.html

    回覆刪除
  14. https://hsiao-yu0711.blogspot.com/2023/11/vs-codemaintain.html

    回覆刪除
  15. https://imyuannn.blogspot.com/2023/11/vs-codemaintain.html

    回覆刪除
  16. https://www.blogger.com/blog/post/edit/preview/2975575936248622997/4231044974053612584

    回覆刪除
  17. https://huilii.blogspot.com/2023/11/vs-codemaintain.html

    回覆刪除
  18. https://michelle814.blogspot.com/2023/11/vs-codemaintain.html

    回覆刪除
  19. https://ruubyy0.blogspot.com/2023/11/339-340-stylestyle.html

    回覆刪除
  20. https://honghikun.blogspot.com/2023/11/vs-codemaintain.html

    回覆刪除
  21. https://the-most-great-hsing-tsen.blogspot.com/2023/11/vs-codemaintain.html

    回覆刪除
  22. https://56788888.blogspot.com/2023/11/vs-codemaintain.html

    回覆刪除
  23. https://ccp19890604.blogspot.com/2023/11/vs-codemaintain.html

    回覆刪除
  24. https://xi-xbox-mmi.blogspot.com/2023/11/vs-codemaintain.html

    回覆刪除
  25. https://the-most-great-chenxi.blogspot.com/2023/12/vs-codemaintain-11-26-2023.html

    回覆刪除

張貼留言

這個網誌中的熱門文章

劉任昌大語言模型協助收集簡報的資料

劉任昌w3schools學習ASCII, Emoji與Javascript迴圈

劉任昌HTML,CSS,樣式style,嵌入iframe