PTT遊戲區 / GameDesign (遊戲設計)

[程式] 超新手 shader language 教學文 (三)

看板GameDesign (遊戲設計)作者meowyih (meowyih)時間3年前 (2021/09/27 14:08)推噓4(4推 0噓 1→)

留言5則, 5人參與討論串1/1

畫一條雷射光下面程式會在畫面中間畫出一道雷射光，原理 (只有一行) 請看 code 裡面的說明。 code https://i.imgur.com/BFoKfEo.jpg

效果 https://i.imgur.com/zSovp0B.png

朝中心縮小的雷射光接下來加點變化，我們更改 laser_coeff，讓該值越靠近中間就越細。方法就是直接乘 abs(uv.x)，因為 uv.x 越中間就越接近 0。 code https://i.imgur.com/ypU7t9Y.jpg

效果 https://i.imgur.com/bF6Tglb.png

日出感覺雷射光我們也可以反過來，讓雷射越靠中間就越粗，看起來也很像日出效果了。 code https://i.imgur.com/uSJM8Vz.jpg

效果 https://i.imgur.com/ru1N2NI.png

變成一支光箭把右邊變短，左邊變長，讓它看起來像一支光箭。 code https://i.imgur.com/u2WY39O.jpg

效果 https://i.imgur.com/8ibgccT.png

讓光箭射出去從左邊射到右邊，只需要用 iTime 改變 uv.x 的值就好。 iTime 是 ShaderToy 提供的參數，就是左邊撥放器看到的撥放時間 (秒)。這個程式只會射一次，要再看一次需要點重頭開始的按鈕。 code https://i.imgur.com/7fV0t2x.jpg

Godot 作法在 Godot 上，時間參數是執行時從 Script 提供的。 shader code https://i.imgur.com/VEqQJWN.jpg

GDScript code https://i.imgur.com/PKSC9o0.jpg

用 mod 和 sin/cos 讓光箭扭來扭去一直射最後，讓直線的移動變成曲線，只要加一行改變 uv.y 就好。 code https://i.imgur.com/5aV3IIJ.jpg

效果 https://www.youtube.com/watch?v=EjFOMY3xuxA

-- 寫這比想像中花時間，所以寫個三篇就好， "萬一" 真的有人在看我再寫吧 XD。 -- ※ 發信站: 批踢踢實業坊(ptt.cc), 來自: 61.228.97.156 (臺灣) ※ 文章網址: https://www.ptt.cc/bbs/GameDesign/M.1632722926.A.564.html ※ 編輯: meowyih (61.228.97.156 臺灣), 09/27/2021 14:10:25

推

peien0312

09/27 14:14, 3年前 , 1^F

09/27 14:14, 1^F

推

nicetw20xx

09/27 23:45, 3年前 , 2^F

09/27 23:45, 2^F

推

louisalflame

09/28 09:01, 3年前 , 3^F

09/28 09:01, 3^F