SFML 簡介及環境設置

Simple and Fase Media Library (SFML) 是一個由 C++ 寫成的跨平台(cross-platfrom)的用於遊戲、多媒體應用開發的 Library,有多個語言的綁定 (Binding) ,分成幾大模塊:系統、視窗、圖形、音訊跟網路。


https://github.com/SFML/SFML

  • SFML 分成幾大模塊
    • System 一些基礎建設,例如:向量(vector)、字串、thread、timer
    • Window 管理視窗以及輸入(鍵盤、滑鼠、搖桿等)及 OpenGL
    • Graphics 硬體加速的 2D 圖形:sprite, text, shapes
    • Audio 音訊、錄音、3D音效
    • Network TDP 與 UDP socket 與 HTTP 跟 FTP

繼續閱讀全文 »

OpenGL 筆記 - Coordinate System

OpenGL 座標的值在 經過 Vertex Shader 之後變成 $[-1.0, 1.0]$ 的座標,稱作 標準化設備座標 Normalized Device Coordinates (NDC),只有在此座標內的頂點最終才會顯示在螢幕上。

座標在被轉換成螢幕座標(Screen-Space)時還會經過多次轉換

  • 座標系統
    • 局部空間 Local Space 或是 物體空間(Object Space)
    • 世界空間 World Space
    • 觀察空間 View Space 或 Eye Space
    • 裁剪空間 Clip Space
    • 螢幕空間 Screen Space

繼續閱讀全文 »

OpenGL 筆記 - Texture

可以用為每個頂點增加顏色來為圖形添增細節,來建構有趣的圖像。但必須要有足夠多的頂點、顏色,這會帶來很多開銷,每個模型的頂點就會變得很多。

紋理(Texture)是一個 2D 的圖片,可以用來增添物體的細節,可以想像 Texture 就像是個有圖案的紙,貼合在 3D 的物體上,這樣就可以讓物體不用增加頂點就增加細節。
題外話,Texture 除了圖像之外還能用來儲存大量資訊發送到 Shader 上。

繼續閱讀全文 »

NCPU 2020 心得

Day 01

由於比賽地點在台中,所以我們學校的隊伍會在前一天下午搭遊覽車下去,住在旅店隔天再搭車到逢甲。這天睡到 10 點多才起來,從床上爬起來後,前一天已經先打包行李的緣故,沒花多少時間就出門了(然後就忘記帶手機充電器了)
到了學校後準備要印 codebook ,發現有個隊員已經先到,印好 codebook 後,稍微消磨下時間後就跟隊友前往校門口的十字架下等遊覽車來(體感溫度有 3X 度,實在有夠熱)

大約兩個多小時的車程後,到了台中的旅店,下車後覺得新奇的是台中的市區怎麼是規劃的方方正正的,一條路可以直接看到底部。旅店的房間是八個人一間房,床是上下舖,放好行李後我們便走到附近的一家烤肉飯吃晚餐,仰角很小的太陽不但很刺眼還很炙熱,尤其是人又很多,我們等了約 15-20 分鐘才開始吃飯。當然比賽前一天晚上喝酒的優良傳統依然有保留下來,原本打算一點多睡的我,因為室友響亮的鼾聲,我到了三點才睡著。

繼續閱讀全文 »

OpenGL 筆記 - Shader

GLSL

GLSL(OpenGL Shading Language Language)是 OpenGL 的著色器語言,它長得有點像C語言,一個 Shader 通常長這樣:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
#version version_number
in type in_variable_name;
in type in_variable_name;

out type out_variable_name;

uniform type uniform_name;

int main()
{
// 處理輸入並進行一些圖形操作
...
// 輸出處理過的結果到輸出變數
out_variable_name = weird_stuff_we_processed;
}

繼續閱讀全文 »

OpenGL 筆記 - 第一個三角形

  • 在 OpenGL 中,所有東西都在 3D 的空間中,而螢幕是 2D 的陣列

    • OpenGL 負責將 3D 座標經過一系列操作轉換成 2D 螢幕的座標
      • 稱作「圖形渲染管線(Graphics Render Pipeline)」
        • 圖形數據經過一個管道,中間經過各種轉換,最後輸出在畫面上
      • 可以分成兩個部分:轉換座標(3D -> 2D)、把 2D 座標轉換成有顏色的像素(pixel)
  • Render Pipeline 被劃分成多個階段,前一個階段的輸出會作為下一個階段的輸入,每個階段都是高度專門化的

    • GPU 中有成千上萬個小處理核心,為 Pipeline 上的每個階段處理
    • 跑在 GPU 中的小程式稱作 Shader (著色器)
    • OpenGL 使用的 Shader 語言是: OpenGL Shading Language (GLSL)

Render Pipeline 的大概流程

繼續閱讀全文 »