iT邦幫忙

2024 iThome 鐵人賽

DAY 2
0
Mobile Development

用Flutter Flame做遊戲!Live!系列 第 2

從Canvas開始講起 (為什麼你應該來試著學學看怎麼用這東西)

  • 分享至 

  • xImage
  •  

自從有了「Canvas AI Image Generator」後,跟很多年輕程式人說「我的興趣/專長是Canvas繪圖」,他們竟然誤以為我是在講前面那套AI工具。

Canvas是很多種程式語言在平台上構成畫面的基礎工具,概念上它就是模擬一張畫布,然後用程式指令在這張畫布上作畫,畫完將整張畫布投放到螢幕上、或螢幕的局部。
既然這功能這麼重要且基本,那它必然存在於很多程式語言中,而且這些程式語言似乎都很有默契、有志一同的把自己的Canvas做得很相似,也因為相似,所以有相通的函數功能與使用邏輯,所以學一個就幾乎等於都學過,最主要的差別就是運行的平台特性而已。

所以學這工具的投資報酬率...不是沒有,就看敢不敢將它應用在實際專案中了。


所有提供給程式設計師方便使用的介面元件,其實都是「如何使用Canvas」的包裝而已。
Text/TextView/TextWidget?其實都是「如何在特定位置畫上指定格式的文字」而已。
圖片?按鈕?動畫?滾動軸?.....應該無一例外吧!

但是,研究怎麼使用Canvas,難道是要自己搞一套屬於自己的介面元件?這又有點多餘。
其實研究Canvas大多是為了做遊戲。(或是為了製作一些比較刁專的介面效果。)
在以前的古董電腦上、還沒有辦法大量產生數位影像的年代,程式開發者要做遊戲就是使用類似Canvas的工具。(那個年代,Canvas的功能是分散的。不懂?沒關係。因為沒影響。往事只能追憶。)

雖然遊戲引擎這幾年已經「很發達」了,但...
Google自己為Flutter上的Flame引擎提供的教學教程來看看吧!
這個教程除了提供程式碼複製貼上、並暗示你「如何替換美術元件」「如何調整參數值」以外,幾乎沒有教導「程式新手」任何程式概念上的東西,它直接預設「你應該在其他平台上累積了很多開發經驗了,所以現在看一眼就應該知道這些程式套件有些什麼功能,可以讓你完美的復現你過往做的作品。」
(知道市面上那麼多的換皮小遊戲怎麼來的嗎?)

所以,如果你想做的遊戲是遊戲引擎模組教程不提供的範本,但你真的很堅持要做出那套遊戲,或許該是時候來摸索怎麼使用Canvas了!
又或者,你是個技能完全只集中在程式設計與企劃上,不具備美術能力的獨立開發者,那過度著重如何管理存取卸載美術元件的幾個主流遊戲引擎對你來說有點大而無當,或許該是時候來摸索怎麼使用Canvas了!

下一篇,從簡單的動畫開始吧!


上一篇
前言:3A級規模的價值
下一篇
用CustomPaint與CustomPainter畫朵花
系列文
用Flutter Flame做遊戲!Live!26
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言