[閒聊] 自製版~ 轉珠模擬器

看板ToS作者 (louisalflame)時間7年前 (2016/09/07 22:55), 7年前編輯推噓139(13904)
留言143則, 136人參與, 最新討論串1/2 (看更多)
大家安安,隔了許久我終於又有進度惹 轉珠模擬器的網址: http://louisalflame.github.io/TOSwebsite/canvas.html ......雖然這次的進度是負的(疑?) 好啦,其實這次的進度是~ 我終於成功把他改寫成能在手機上使用惹!! (至少可以在我的手機的safari上跑了~^^) 不過我幾乎是把code打掉重練 所以還沒寫到原本的進度QAQ 隊伍功能只剩下隊長隊友的隊長技,有關落珠消珠的部分 (不過原本的舊網頁我沒砍還留著就是了) 順便提一下 從頂端有連結可以到另一頁我做的卡片收集記錄表格喔 模擬器的使用方式,這次參照原版PAD定石網頁的流程 先按"版面"設定好屬珠顏色 再按"隊伍"可以設定特殊的隊長技 (目前先只放有影響的: 希臘、二消、巴比、古希) 按"移動"後,就可以開始模擬轉珠了 最後按"重播"可以檢查轉珠結果 和 分享連結 --------------------以下是CODING牢騷-------------------- 原本我的JS程式都是依靠jquery的library 之前的轉珠效果是用jquery-UI內建的drag-drop程式 將6*5 table內的屬珠img做出drag和效果 為了解決手機也可以模擬轉珠的效果 我一開始查jquery都查不到怎麼做手機支援的drag-drop 後來我只好去偷看一下原版PAD定石是怎麼做的wwwwww 發現他是把版面設為canvas,再畫出6*5個屬珠 好啦我就把我的table和img的架構砍掉 學他一樣用canvas自己慢慢畫6*5個屬珠image 一開始我還很天真的繼續用jquery內建的jcanvas 後來發現不管怎麼設定 jcanvas的圖層依然不能在手機上drag-drop ...\囧/ 完蛋啦,最後我只好心一橫... 再從頭開始,從最底層看PAD定石的網頁是怎麼寫的... 這才發現我之前都想錯啦啦啦QAQ 拖拉屬珠的效果根本就不是甚麼drag-drop 而是他每一幀frame都自己刻出來畫 不斷偵測mouse位置才去在canvas上畫相對應的屬珠 所以最後就是要自己從頭刻一個canvas animate啊啊啊 結果花了大半時間就是把之前寫好的程式 用更底層的方式去重寫一遍QAQ.... -------------------------------------------------------- 如果有用的話 希望可以盡量推文給我鼓勵喔 > w < / -- ※ 發信站: 批踢踢實業坊(ptt.cc), 來自: 114.39.171.14 ※ 文章網址: https://www.ptt.cc/bbs/ToS/M.1473260158.A.9E8.html

09/07 22:57, , 1F
推爆的化 樓下開始 隨機15樓 稅後100P
09/07 22:57, 1F

09/07 22:58, , 2F
幫忙推推喔
09/07 22:58, 2F

09/07 22:58, , 3F
給推!
09/07 22:58, 3F

09/07 22:59, , 4F
路過推一下
09/07 22:59, 4F

09/07 22:59, , 5F
09/07 22:59, 5F

09/07 22:59, , 6F
推~
09/07 22:59, 6F

09/07 23:01, , 7F
09/07 23:01, 7F

09/07 23:01, , 8F
09/07 23:01, 8F

09/07 23:02, , 9F
09/07 23:02, 9F

09/07 23:05, , 10F
PUSH
09/07 23:05, 10F

09/07 23:06, , 11F
有二消 古希 先推
09/07 23:06, 11F

09/07 23:08, , 12F
09/07 23:08, 12F

09/07 23:08, , 13F
很棒
09/07 23:08, 13F

09/07 23:09, , 14F
09/07 23:09, 14F

09/07 23:09, , 15F
感激推
09/07 23:09, 15F

09/07 23:10, , 16F
推,後面完全看不懂不過真得好厲害!
09/07 23:10, 16F

09/07 23:11, , 17F
推~~
09/07 23:11, 17F

09/07 23:12, , 18F
推!
09/07 23:12, 18F

09/07 23:14, , 19F
推!
09/07 23:14, 19F

09/07 23:15, , 20F
end推
09/07 23:15, 20F

09/07 23:17, , 21F
推 隊長選擇感覺可以用其他方式比較好
09/07 23:17, 21F
這是為了預備留位子給主動技等功能才這樣設計的 不過目前中間四個的確是沒有用到就是惹www

09/07 23:18, , 22F
09/07 23:18, 22F

09/07 23:18, , 23F
09/07 23:18, 23F

09/07 23:18, , 24F
09/07 23:18, 24F

09/07 23:20, , 25F
09/07 23:20, 25F

09/07 23:21, , 26F
推推!!
09/07 23:21, 26F

09/07 23:21, , 27F
感謝你的熱情~
09/07 23:21, 27F

09/07 23:23, , 28F
不推不行
09/07 23:23, 28F
※ 編輯: louisalflame (114.39.171.14), 09/07/2016 23:28:32

09/07 23:27, , 29F
純推有研究精神自製轉珠模擬
09/07 23:27, 29F

09/07 23:28, , 30F
推推
09/07 23:28, 30F

09/07 23:32, , 31F
09/07 23:32, 31F

09/07 23:32, , 32F
09/07 23:32, 32F

09/07 23:35, , 33F
09/07 23:35, 33F

09/07 23:37, , 34F
好厲害
09/07 23:37, 34F

09/07 23:38, , 35F
09/07 23:38, 35F

09/07 23:39, , 36F
推 pad 網頁掛很久了
09/07 23:39, 36F

09/07 23:40, , 37F
推個
09/07 23:40, 37F
還有 66 則推文
09/08 08:29, , 104F
09/08 08:29, 104F

09/08 08:42, , 105F
好猛好強!!!
09/08 08:42, 105F

09/08 08:47, , 106F
碼農辛苦了!
09/08 08:47, 106F

09/08 09:13, , 107F
推 強者
09/08 09:13, 107F

09/08 09:31, , 108F
讚讚 辛苦了
09/08 09:31, 108F

09/08 09:33, , 109F
09/08 09:33, 109F

09/08 09:42, , 110F
09/08 09:42, 110F

09/08 10:15, , 111F
幹爆強
09/08 10:15, 111F

09/08 10:17, , 112F
路過推
09/08 10:17, 112F

09/08 10:48, , 113F
09/08 10:48, 113F

09/08 10:51, , 114F
用心的人值得讚許。推個。(P 幣給原PO)
09/08 10:51, 114F

09/08 10:54, , 115F
厲害!完全看不懂在抱怨啥 XD
09/08 10:54, 115F

09/08 11:03, , 116F
09/08 11:03, 116F

09/08 11:55, , 117F
推!
09/08 11:55, 117F

09/08 12:08, , 118F
(・∀・)
09/08 12:08, 118F

09/08 12:14, , 119F
推 看不懂在抱怨什麼+1
09/08 12:14, 119F

09/08 13:07, , 120F
09/08 13:07, 120F

09/08 13:11, , 121F
推,但推幣一樣給原PO
09/08 13:11, 121F

09/08 13:55, , 122F
推~
09/08 13:55, 122F

09/08 14:05, , 123F
這個有自動導引路徑功能嗎
09/08 14:05, 123F

09/08 14:11, , 124F
09/08 14:11, 124F

09/08 14:44, , 125F
推一個 辛苦了~
09/08 14:44, 125F

09/08 14:51, , 126F
09/08 14:51, 126F

09/08 14:53, , 127F
09/08 14:53, 127F

09/08 15:20, , 128F
厲害!推~
09/08 15:20, 128F

09/08 15:54, , 129F
感謝,推一個~~~~~
09/08 15:54, 129F

09/08 16:38, , 130F
09/08 16:38, 130F

09/08 16:41, , 131F
GOOD
09/08 16:41, 131F

09/08 16:43, , 132F
推!!!
09/08 16:43, 132F

09/08 17:14, , 133F
大推 有考慮來個WebGL 3D版嗎XDD
09/08 17:14, 133F

09/08 17:51, , 134F
推 感謝
09/08 17:51, 134F

09/08 18:31, , 135F
推 來用看看
09/08 18:31, 135F

09/08 20:15, , 136F

09/08 20:15, , 137F
發了
09/08 20:15, 137F

09/08 20:27, , 138F
收到了,謝謝
09/08 20:27, 138F

09/08 20:58, , 139F
09/08 20:58, 139F

09/08 21:59, , 140F
超棒的 不推不行
09/08 21:59, 140F

09/08 22:05, , 141F
收到推
09/08 22:05, 141F

09/09 01:42, , 142F
09/09 01:42, 142F

09/09 10:59, , 143F
有熱血有推,現在很難有熱血了…
09/09 10:59, 143F
文章代碼(AID): #1Nq2f-de (ToS)
文章代碼(AID): #1Nq2f-de (ToS)