一個簡單圖形學項目的介紹

項目簡介

渲染器展示

1 / 2

實現流程

一、引擎部分

1. 組件結構

簡單來說：

• 借助Opengl等圖形庫得以渲染圖像
• 編寫游戲物體和組件來創作內容
• 游戲的進行依托于每個組件的Awake、Update等函數的個簡運行

2. 引擎運行

int main(void){    Application::set_data_path("../data/");//設置資源目錄    Application::InitOpengl();//初始化引擎?    GameObject* go=new GameObject("LoginSceneGo");    go->AddComponent("Transform");    go->AddComponent("LoginScene");    Application::Run();//開始引擎主循環}

• Scene組件執行Awake函數時，將需要的游戲物體創建出來
• Scene組件也會執行Update函數，負責移動相機，接收輸入等

3. 具體實現

Application類

• 初始化OpenGL服務，設置數據下載地址，更新窗口大小
• 在初始化時調用所有組件的Awake函數，每幀調用所有物體的Update函數，來進行邏輯運算
• 每幀調用所有物體的Render函數來實現渲染

class Application {public:    static const std::string& data_path(){return data_path_;}    static void set_data_path(std::string data_path){data_path_=data_path;}?    /// 初始化OpenGL    static void InitOpengl();?    static void Run();?    static void UpdateScreenSize();?    /// 每一幀內邏輯代碼。    static void Update();?    /// 邏輯代碼執行后，應用到渲染。    static void Render();?private:    static std::string data_path_;//資源目錄?    static GLFWwindow* glfw_window_;?};

GameObject類

class GameObject {public:    GameObject(std::string name);    ~GameObject();?    std::string& name(){return name_;}    void set_name(std::string name){name_=name;}?    /// 添加組件    Component* AddComponent(std::string component_type_name);    /// 添加父物體    GameObject* SetParent(GameObject* parent);    /// 添加子物體    GameObject* AddChildObject(std::string child_type_name, GameObject* child);    /// 獲取組件    Component* GetComponent(std::string component_type_name);    /// 獲取所有同名組件    std::vector<Component*>& GetComponents(std::string component_type_name);    /// 獲取子物體    GameObject* GetChildObject(std::string child_type_name);    /// 遍歷自身所有Component    void ForeachComponent(std::function<void(Component* component)> func);?    /// 遍歷所有GameObject    static void Foreach(std::function<void(GameObject* game_object)> func);        unsigned char layer(){return layer_;}    void set_layer(unsigned char layer){layer_=layer;}private:    std::string name_;    unsigned char layer_;//將物體分不同的層，用于相機分層、物理碰撞分層等。    GameObject* parent_;    std::unordered_map<std::string,std::vector<Component*>> component_type_instance_map_;    std::unordered_map<std::string,GameObject*> childrenObjects_instance_map;?    static std::list<GameObject*> game_object_list_;//存儲所有的GameObject。};

Component類

class Component {public:    Component(bool active = true);    virtual ~Component();?    GameObject* game_object(){return game_object_;}    void set_game_object(GameObject* game_object){game_object_=game_object;}?    void set_isActive(bool active);    virtual void Awake();    virtual void Update();protected:    bool isActive;private:    GameObject* game_object_;};

二、渲染部分

1. MeshFilt=er&模型文件.mesh

• 頂點：存儲單個頂點的位置、顏色、uv
• 頂點數組：存儲模型所有的頂點
• 頂點索引數組：根據頂點數組組成面的指導
• 頂點數組長度，頂點索引數組長度

struct Vertex{    glm::vec3 pos_;    glm::vec4 color_;    glm::vec2 uv_;};?//Mesh文件頭struct MeshFileHead{    char type_[4];    unsigned short vertex_num_;//頂點個數    unsigned short vertex_index_num_;//索引個數};?//Mesh數據struct Mesh{    unsigned short vertex_num_;//頂點個數    unsigned short vertex_index_num_;//頂點索引個數    Vertex* vertex_data_;//頂點數據    unsigned short* vertex_index_data_;//頂點索引數據};

1. 創建Mesh結構體對象
2. 先讀取頂點數和索引數，再依次讀取頂點數組和索引數組的內容，并存入Mesh

class MeshFilter:public Component{public:    MeshFilter(bool active = true);    ~MeshFilter();public:    void LoadMesh(string mesh_file_path);//加載Mesh文件    Mesh* mesh(){return mesh_;};//Mesh對象private:    Mesh* mesh_;//Mesh對象};

2. Shader

頂點著色器

#version 330 core?uniform mat4 u_mvp;?layout(location = 0) in vec3 a_pos;layout(location = 1) in vec4 a_color;layout(location = 2) in vec2 a_uv;?out vec4 v_color;out vec2 v_uv;?void main(){    gl_Position = u_mvp * vec4(a_pos, 1.0);    v_color = a_color;    v_uv = a_uv;}?

片元著色器

#version 330 core?uniform sampler2D u_diffuse_texture;?in vec4 v_color;in vec2 v_uv;layout(location = 0) out vec4 o_fragColor;void main(){    o_fragColor =  v_color;}

3. Material類&材質文件.mat

//tile.mat?<material shader="shader/tile">    <texture name="None" image="None"/></material>

//Material.cpp?void Material::Parse(string material_path) {    //解析xml    rapidxml::file<> xml_file((Application::data_path()+material_path).c_str());    rapidxml::xml_document<> document;    document.parse<0>(xml_file.data());?    //根節點    rapidxml::xml_node<>* material_node=document.first_node("material");    if(material_node == nullptr){        return;    }?    rapidxml::xml_attribute<>* material_shader_attribute=material_node->first_attribute("shader");    if(material_shader_attribute == nullptr){        return;    }    shader_=Shader::Find(material_shader_attribute->value());        ...}

4. 單個物體渲染&MeshRenderer

1. MeshRenderer會保存Material類的引用，使用其解析.mat文件的功能
2. 之后獲取自身MeshFilter組件的.mesh文件，使用其導入頂點數據的功能
3. 最后上傳這些數據，完成渲染

class MeshRenderer:public Component{public:    MeshRenderer(bool active = true);    ~MeshRenderer();?    void SetMaterial(Material* material);//設置Material    Material* material(){return material_;}?    void Render();//渲染private:    Material* material_;?    unsigned int vertex_buffer_object_=0;//頂點緩沖區對象    unsigned int element_buffer_object_=0;//索引緩沖區對象    unsigned int vertex_array_object_=0;//頂點數組對象};

5. 啟用渲染

//Application.cpp?void Application::Render(){    //每幀清除顏色和深度緩沖    glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);?    //遍歷所有相機，每個相機的View Projection，都用來做一次渲染。    Camera::Foreach([&](){        GameObject::Foreach([](GameObject* game_object){            auto component=game_object->GetComponent("MeshRenderer");            if (!component){                return;            }            auto mesh_renderer=dynamic_cast<MeshRenderer*>(component);            if(!mesh_renderer){                return;            }            mesh_renderer->Render();        });    });}

三、TileMap系統

1. 原理

• 將需要繪制的地形切割成瓦片
• 將瓦片貼到地圖上

• Tile邊角的模型
• 去掉一個邊角的磚塊模型
• 去掉兩個相對邊角的磚塊模型
• 四分之一大小的磚塊模型

2. 模型創建及導入

3. 實現

TileMap類

• Map的長寬
• 所有Tile的Tile類型
• 所有Tile組件的引用

class TileMap {?    public:    TileMap(int width, int height);    ~TileMap();?    unsigned int GetMapHeight() const {return height_data;}    unsigned int GetMapWidth() const {return width_data;}    const vector<vector<unsigned short>>& GetMap_Data() const {return tileMap_data;}    const vector<vector<Tile*>>& GetMap_Instance() const {return tileMap_instance;}?    unordered_map<unsigned short,int> TileMap::GetTile_Data(pair<int,int> position);    void SetMap_Data(const vector<vector<unsigned short>>& map);    void SetMap_Instance(const vector<vector<Tile*>>& map);?    private:    vector<vector<unsigned short>> tileMap_data;    vector<vector<Tile*>> tileMap_instance;    unsigned int width_data;    unsigned int height_data;    unsigned int width_instance;    unsigned int height_instance;?};

TileCreater組件

• 加載地圖文件，并存儲在二維數組中
• 根據地圖文件，創建Tile對象，為它們添加Tile組件
• 開啟每個Tile的初始化，開啟渲染

class TileCrater: public Component {?  public:  TileCrater(){};  ~TileCrater(){};?  void LoadTileMap(const std::string& filename);  void CreateTiles();  void InitTiles() const;?  private:  TileMap* tileMap;?};

Tile組件

• 創建子瓦片，添加渲染組件
• 獲得渲染類型，確定渲染方式
• 開啟子瓦片渲染

class Tile: public Component {?public:    Tile(){};    ~Tile(){};    void SetMap(TileMap* map){tileMap = map;};    void TileCreate(float x, float z);    void TileInitialize(pair<int,int> tilePos);?private:    TileMap* tileMap;    /// Tile在TileMap中的相對位置    pair<int,int> tile_orientation;    /// 存儲Tile子塊的Tile類型    std::unordered_map<unsigned short,int> childTiles_data_map;    /// 存儲子塊位置和引用的map    std::unordered_map<unsigned short,GameObject*> childTiles_instance_map;?    GameObject* SetChildTile(unsigned short childPos, GameObject* childTile);    vector<pair<unsigned short,unsigned short>> GetTileRenderLine();};