鐵人檔案
會採用Vue3開發遊戲介面，最終目標是做一個好玩的紙牌接龍遊戲。
預計會從怎麼用網頁顯示紙牌、拖曳紙牌，翻轉紙牌等技巧說起，雖然寫得當下我還不會...
希望能以一層層疊大樓的方式說明實現遊戲的進度。
前言 最終目標是做一個個人版的紙牌接龍，中途也會嘗試做一些延伸的紙牌遊戲。 遊戲的畫面預計會使用我不熟悉的前端框架 Vue3，若有充足的時間我也會結合後端去做整...
動工前的準備 因為昨天標題在畫面縮放的情況下會擋住放卡牌的地方，所以早上就先看CSS相關的網站學習並且如何在Vue專案中使用。 意外發現原來App.vue檔(放...
原本今天預計製作發牌和卡牌自動翻面的效果，希望兩個都能有動畫效果，但現實的能力讓我想先說說今天的開發方式 實際思考/開發的過程 卡牌翻面 想像的實作過程 沿用...
改變翻牌效果 研究Transition的文件後發現跟我想像的動畫變換不同，官方用法<Transition></Transition> 包...
因為想留著昨天完成的撲克牌連連看，預計將不同遊戲的頁面可以做保留並切換，所以我打算在做牌堆之前，首先應該要了解Vue3在路由頁面的實作是如何切換頁面。 引入 V...
今日目標 [x] 研究如何製作牌堆 製作牌堆 製作CardBox元件負責用來擺放卡片的容器，所以結構上就只是比原本卡片元件的稍寬，所以設計成可放子元件進去的...
今日完成目標 多張卡牌實現垂直重疊，但露出非交疊的部分 垂直重疊 為了產生重疊的效果，個人覺得最酷的方式應該是使用CSS的grid排版，所以在這之前我利用一個G...
重點提醒: 沒有真的成功實作卡牌無中斷的移動 在實作的過程中遇到了一些問題，找到替代方案先記錄下來。 最初的思路 在前一篇文章中，我們已經完成了牌堆的製作，接下...
玩紙牌接龍最重要的就是卡牌會移來移去，之前都是用點的移動定點，今天來試試看如何撰寫拖曳紙牌的功能。 安裝依賴 因為重頭學習理解拖曳，對我來說太麻煩也太無聊，乾脆...
今天來研究兩個列表的拖曳和如何限制列表的拖曳，學習內容主要來自vue.draggable文件的內容和親身實作進行分析。 先實現兩個列表的拖曳 昨天已學過如何製作...
