跳到主要內容

C/C++遊戲程式透過Emscripten編譯為javascript移植成web版

最近一兩周利用空檔時間將過去作過的幾個小遊戲,改版成簡單的對應的web版。原來的程式底層都是使用C/C++實作,透過Emscripten將原來的程式build成javascript,然後再結合web應用完成簡單的移植。因為原來的程式一開始在實作時就幾乎是可以跨平台的,所以移植很順利很快。我目前使用的Emscripten是1.35.0版本,因為只是用作移植測試目的,自從安裝後就沒有再更新過。

完成移植的遊戲分別是:
移植的基本原則很簡單:
  1. 首先確定原來的C/C++程式可以在Emscripten的command line環境下編譯。
  2. 再來定義一些API可以讓html綱頁裡的javascript呼,這個部份更多細節可以參考官方網站的文件說明。
  3. C/C++讓javascript呼叫的API定義好後,也編譯成功了。就可以先用printf的方式作簡單的測試,測試方式也很簡單。如下圖的例子,是一個簡單的將兩個數字相加並回傳和數的cAPI cAdd。在mainl裡用一個printf作簡單的測試,然後在cmdline環境下編譯成功後,透過nodejs來執行觀察結果是否正確。
  4. API初步沒有問題了,然後就可以真正撰寫些code來呼叫這些API,主要方式是在javascript裡透過Module.ccall來呼叫我們的API。Module.ccall的第一個參數是API的名稱,第二個參數是API的回傳值類型,第三個參數是API的參數列表類型,第四個參數是參數列表。在我們的例子裡,API名稱叫作cAdd,回傳值是一個數字類型,參數列表是兩個數字類型,輸入1和2。結果用一個alert顯示出來,正確答案是3。
透過以上幾個簡單的原則,很容易就可以把一些原本用C/C++寫成的程式,改版成網頁版。

留言

這個網誌中的熱門文章

單人撲克牌遊戲 - 蒙地卡羅

新增一個簡單的單人撲克牌遊戲: 蒙地卡羅 ,簡單介紹一下玩法。 下載 事先排列好5x5張牌。 每次移動一張可以配對的牌,並消除這對牌。在上下、左右及斜向相隣的二張牌,只要擁有同樣數字(不計花色),即可配對。 消除二張配對的牌後,剩餘的牌以往左往上的方式補滿空隙,接著在發新牌補滿後面的空格。 重覆步驟2~3,直到沒有牌可以配對及發完所有牌為止。 結果有二種。一個是勝利,成功的消除掉所有牌。另一個是Gameover沒有牌可以再作配對。

KillSudoku 4顆星精彩數獨 (三) - XY-Chains

這是數獨解題技巧裡面的高級技巧,比X-Chains還再高一點點。會這個技巧的話,就可以解4或5顆星的題目了。 這個用來測試的題目,用 KillSudoku 來解可以解出,中間使用了2次Naked Subset,1次 W-Wings ,1次 X-Chains ,2次 XY-Chains 。所以算起來,這一題應該是有5顆星的題目。 附帶一提,目前找鍊的演算法並沒有去找一條最短的鍊,所以可以看到用 KillSudoku 解的時候,第36的步驟找到一條超長的鍊,這條鍊足足由13條連線構成,要是沒練過的話,絕對頭昏眼花,找不出這樣的鍊來的。 實際上在這個步驟裡,是可以找到另一條更短的鍊。不過目前以先能work,之後有空會再改進演算法的部份。

猜數字遊戲 (電腦猜人)

前幾天午睡時突然被告知要參加公司內部的程式設計比賽,題目是用C寫一支文字模式的4位數字猜數字遊戲,由使用者來猜電腦的數字。在上星期時其實就已經有公佈了,但我沒有注意到所以是臨時加入,還好這是個簡單的題目,不用花多少時間就可以寫出來。 規則: - 這是一對一比賽,雙方各選擇一4位數字,不讓對方知道。 - 4位數字由數字0至9組成,每位數不得重複。 - 雙方輪流猜對方的數字,直到一方猜中為止。 - A方猜B方的數字後,B方根據A方的猜測回答幾A幾B。 - 一個A表示猜中一個數字且位置正確,一個B表示猜中一個數字但位置不正確。 - 當一方猜中4A0B時即表示猜中對方全部4個數字且位置正確,贏得比賽。 - 例:B的謎底是4208,底下箭頭左測是A的猜測,箭頭右測是B的回答。    1234 ==> 1A1B    5678 ==> 1A0B    2406 ==> 1A2B    ...    4208 ==> 4A0B ; 寫個程式讓玩家來猜電腦的數字不難,不過我從來沒有寫過讓電腦來猜玩家數字的版本,所以花了點時間想想怎麼寫。 研究後歸納出二個點。 1, 使用窮舉法將所有可能數字組合列出。 2, 每次猜測後根據結果排除不可能是答案的組合,重複這個動作直到猜中答案為止。 第1點只是實作問題,第2點概念也很簡單,但要過濾不是答案的組合根據的是什麼?乍看之下沒什麼頭緒,不過想通之後就非常簡單了。 它的基本原理如下:假如謎底是4561,如果猜1524則會得到1A2B。從相反的角度來看,如果謎底是1524,則猜4561時也會得到1A2B的回答。 利用這個方法,每一次猜測一個數字X後,再以這個數字當作答案,來和所有剩下來的候選答案作比對,如果得到的結果(幾A幾B)和數字X是一樣的話,就把這個數字保留下來繼續作為候選答案,否則就過把這個數字過濾掉。下一把,繼續從候選答案裡選一個出來猜,重複上面的動作,直到猜中為止。 ; C++ STL的algorithm裡有個叫作next_permutation的函數,可以用來生成排列。 #include <iostream> #include <algorithm> using namespace std; int main () {   int myints[] = {1,2,3};  ...