eepp是一個開源跨平台遊戲和應用程式開發框架,主要專注於豐富的圖形使用者介面的開發。
官方支援 Linux、Windows、macOS、Android 和 iOS。
使用 emscripten 匯出到 HTML5,但有一些小限制。
也適用於 BSD 和 Haiku。
基礎小工具將應用程式/遊戲物件作為節點進行管理,具有所有基本輸入互動事件(單擊、按鍵、滑鼠懸停、焦點等)。
功能齊全的UI系統,動畫支持,縮放,旋轉,剪輯,事件,訊息等。
主題和皮膚/裝飾支援。
像素密度支援(由螢幕像素密度定義的 UI 元素縮放)。
所有基本的小部件都已實現(按鈕、文字方塊、組合框、輸入框、選單、列錶框、捲軸等)。
獲得失效支持。它可以用來製作真正的應用程序,資源使用率低(僅在需要時重繪)。
佈局系統類似 Android 佈局( LinearLayout、RelativeLayout、GridLayout )。
文字選擇、複製和貼上以及按鍵綁定等進階功能。
從 XML 載入佈局並設計樣式
使用層疊樣式表進行樣式設定
OpenGL 2(固定管道)、OpenGL 3(可程式管道)、OpenGL ES 2、OpenGL ES 1 和 OpenGL Core Profile 的渲染器。
批次渲染器(所有渲染均由引擎自動批次處理)。
字型支援(TrueType、BMFont 和 XNA 字型)。
幀緩衝區支援。
著色器支援(透過自動固定管道著色器到可程式轉換器)。
頂點緩衝區物件支援。
粒子系統。
可擴充控制台。
動畫精靈。
紋理圖集支援(自動建立和更新紋理圖集,包括編輯器)。
剪貼蒙版(模板、剪刀、飛機)
九個補丁可調整大小的點陣圖支援。
基元可繪製物件。
支援多種影像格式(包括光柵化 SVG),支援壓縮紋理(如果可能,直接上傳到 GPU)。
基於後端的模組,這意味著您可以輕鬆地為視窗/輸入處理建立後端。
目前支援 SDL 2 作為後端。
剪貼簿支援。
硬體遊標。
顯示管理器
操縱桿支援。
提供庫的完整多執行緒支援、打包檔案格式支援、時鐘、資源管理器、轉換器等的所有基礎知識。
虛擬檔案系統類別(將資產提供者抽象化為單一虛擬檔案系統,將zip檔案和本機檔案系統抽象化為透明載入資源,類似於PhysicsFS)。
可自訂的記憶體管理器。預設在調試模式下用於追蹤記憶體洩漏。
UTF8、UTF-16、UTF-32、Ansi、Wide Char 支援。
內部使用 UTF-32 字元的 String 類別。
偵錯巨集
通用函數和模板(向量、四邊形、多邊形等)。
帶有緩動的插值類。
一些次要的數學實用程序,包括 Mersenne Twister 隨機數產生器實作、柏林噪音等。
使用 HTTP 用戶端進行 Web 請求,並支援 TLS (由 mbedtls 或 openssl 提供)。
非同步 HTTP 請求。
使用 FTP 用戶端和 FTPS 用戶端進行檔案傳輸(具有明確 TLS 的 FTP)。
TCP 和 UDP 套接字。
HTTP 內容編碼和傳輸編碼支援。
HTTP 代理支援。
HTTP 壓縮回應支援。
還有 HTTP 恢復/繼續下載支援和自動跟隨重定向。
基於節點的系統,可輕鬆管理場景。
完全控制節點事件(點擊、滑鼠懸停、焦點等)。
事件系統。
節點訊息系統。
節點的可程式操作(淡入淡出、旋轉、移動、縮放等)。
有軟體動態燈光的平鋪地圖。
全功能地圖編輯器。
非常簡單的 UI 編輯器。從 XML 檔案載入佈局並即時查看所做的變更。
紋理圖集編輯器。一個非常簡單的工具,允許開發人員建立和編輯紋理圖集。
地圖編輯器:用於遊戲引擎的高級但簡單的地圖編輯器。它缺少幾個功能,因為我沒有時間研究它,這個特殊的工具可能會在不久的將來因 TMX 地圖支援而消失(但我不是 TMX 地圖的粉絲,所以我沒有決定那一刻)。
文件位於此處。我目前正在努力改進它。目前該項目約 50% 已記錄在案,因此仍需要大量工作。請檢查位於src/examples
中的程式碼範例,您也可以查看測試 ( src/test
) 和工具 ( src/tools
)。
我正在努力改進 UI 模組的文檔,因為目前它是最重要、最複雜的模組,但缺乏適當的文檔。如果您有任何疑問可以隨時與我聯繫。
此儲存庫使用 git 子模組,因此您需要複製儲存庫及其子模組,為了輕鬆實現此目的,您可以簡單地複製:
git clone --recurse-submodules https://github.com/SpartanJ/eepp.git
ecode 是一個受 lite 啟發的程式碼編輯器。它使用基於預設 Plasma 深色主題的最新純 CSS 主題:Breeze Dark。
即時顯示任何佈局和 CSS 的變更的編輯器,有助於加快使用者介面的開發。螢幕截圖中顯示了 eepp 中可用的一些預設小工具。
小工具,用於建立和編輯紋理圖集。
使用預設皮膚主題的 2D 地圖編輯器(使用帶有 9 個圖像的單一紋理圖集)。
對於任何 Android 開發人員來說,它看起來都應該非常熟悉。這是一個以垂直線性佈局顯示最基本的小部件的視窗。
< window layout_width = " 300dp " layout_height = " 300dp " window-flags = " default|maximize|shadow " >
< LinearLayout id = " testlayout " orientation = " vertical " layout_width = " match_parent " layout_height = " match_parent " layout_margin = " 8dp " >
< TextView text = " Hello World! " gravity = " center " layout_gravity = " center_horizontal " layout_width = " match_parent " layout_height = " wrap_content " backgroundColor = " black " />
< PushButton text = " OK! " textSize = " 16dp " icon = " ok " gravity = " center " layout_gravity = " center_horizontal " layout_width = " match_parent " layout_height = " wrap_content " />
< Image src = " thecircle " layout_width = " match_parent " layout_height = " 32dp " flags = " clip " />
< Sprite src = " gn " />
< TextInput text = " test " layout_width = " match_parent " layout_height = " wrap_content " />
< DropDownList layout_width = " match_parent " layout_height = " wrap_content " selectedIndex = " 0 " >
< item >Test Item</ item >
< item >@string/test_item</ item >
</ DropDownList >
< ListBox layout_width = " match_parent " layout_height = " match_parent " layout_weight = " 1 " >
< item >Hello!</ item >
< item >World!</ item >
</ ListBox >
</ LinearLayout >
</ window >
UI介紹可以在這裡找到。
真實代碼看起來如何?
UITextView::New ()->setText( " Text on test 1 " )
->setCharacterSize( 12 )
->setLayoutMargin( Rect ( 10 , 10 , 10 , 10 ) )
->setLayoutSizePolicy( SizePolicy::MatchParent, SizePolicy::WrapContent )
->setParent( layout );
元素樣式可以透過級聯樣式表的自訂實作來完成,可以使用最常見的CSS2 規則,以及一些CSS3 規則(一些範例:動畫、過渡、自訂屬性、媒體查詢、@font-face at 規則、: root 元素) 。下面是一個有關 CSS 外觀的小範例:
@font-face {
font-family : "OpenSans Regular" ;
src : url ( "https://raw.githubusercontent.com/SpartanJ/eepp/develop/bin/assets/fonts/OpenSans-Regular.ttf" );
}
@import url ( "assets/layouts/imported.css" ) screen and ( min-width : 800 px );
: root {
--font-color : black;
--background-input-color : rgba ( 255 , 255 , 255 , 0.7 );
--border-color : black;
--border-width : 1 dp ;
}
. screen TextView {
color : var ( --font-color );
}
. form {
background-image : @drawable /back;
background-repeat : no-repeat;
background-size : cover;
}
. form . form_inputs {
background-color : var ( --non-existent , var ( --background-input-color ));
margin-left : 100 dp ;
margin-right : 100 dp ;
padding-top : 72 dp ;
padding-left : 57 dp ;
padding-right : 57 dp ;
padding-bottom : 115 dp ;
}
. screen TextView . input ,
. screen TextInput . input {
font-family : AkzidenzGroteskBQ-Cnd;
layout-width : match_parent;
layout-height : 80 dp ;
border-color : var ( --border-color );
border-width : var ( --border-width );
color : var ( --font-color );
padding-left : 40 dp ;
padding-right : 40 dp ;
margin-bottom : 32 dp ;
skin : none;
hint-font-family : AkzidenzGroteskBQ-Cnd;
hint-font-size : 46 dp ;
hint-color : # 818285 ;
background-color : # FFFFFF00 ;
transition : all 0.125 s ;
}
. screen TextInput . input : focus {
background-color : # FFFFFF66 ;
border-color : # 796500 ;
}
. screen TextInput . input : hover {
background-color : # FFFFFF66 ;
}
@media screen and ( max-width : 1024 px ) {
. form . form_inputs {
background-color : red;
}
}
完整的 CSS 規範可以在文件中找到:這裡。
您也可以在 eepp: 此處查看純 CSS 主題的外觀。
由於 eepp 支援 emscripten,您可以快速瀏覽一下該程式庫目前提供的一些範例、演示和工具。請注意,您會發現基於 emscripten 目前的限制(無法存取檔案系統、沒有自訂遊標等)的一些差異,並且演示未針對大小進行最佳化,並且它們比應有的要大是。注意:請使用具有良好 WebGL 和 WASM 支援的現代瀏覽器(Chrome/ium 70+ 或 Firefox 80+)。
ecode - 程式碼編輯器
使用者介面編輯器
使用者介面你好世界
紋理圖集編輯器
地圖編輯器
字體範例
實體模組演示
精靈範例
全面測試
7GUIs 被稱為“GUI 程式設計基準”,它用於比較不同的 GUI 庫並探索每個庫的 GUI 程式設計方法。 7GUIs 中提出的所有 7 個任務已在 eepp 中實現。這些任務很好地代表了 eepp GUI 可以實現的目標,並且對於演示如何使用該程式庫實現不同的任務也非常有用。
7GUI 由以下任務組成:
Counter:示範和程式碼實作。
溫度轉換器:演示和程式碼實作。
Flight Booker:演示和程式碼實作。
定時器:演示和程式碼實作。
CRUD:演示和程式碼實作。
Circle Drawer:示範和程式碼實作。
Cells:演示和程式碼實作。
該庫只有一個外部相依性。您只需要安裝了標頭的SDL2庫。還需要premake5或premake4來產生 Makefile 或專案檔來建置庫。我假設您知道自己在做什麼並跳過基礎知識。
注意:eepp 預設使用 mojoAL 作為 OpenAL 的直接替代品。 OpenAL 可以選擇用作音訊後端。如果您想使用它,您可以選擇啟用它。要啟用它並停用 mojoAL 直接替換,您需要將參數--without-mojoal
新增至任何premake
呼叫(例如: premake5 --without-mojoal gmake2
)。
在 Ubuntu 系統中,它會是這樣的(你也需要 gcc,但無論如何它都會安裝):
sudo apt-get install premake5 libsdl2-2.0-0 libsdl2-dev libopenal1 libopenal-dev
克隆存儲庫並在存儲庫根目錄上運行:
premake5 gmake2
或者如果你安裝了 premake4 你可以運行:
premake4 gmake
然後建構庫:
make -C make/linux
就是這樣。這將建構整個專案。
您有兩種選擇:使用 Visual Studio 或使用 MinGW 建置。為了能夠使用這些選項中的任何一個建置項目,您首先需要使用 premake4 或 premake5 來產生專案檔。然後,您需要將二進位檔案新增至PATH
中定義的任何可執行路徑(或新增一個,或從本機路徑使用它)。根據您的需求下載Visual Studio或MinGW檔案。
您將需要使用 premake5 並運行:
premake5.exe --windows-vc-build vs2022
然後專案文件應該在make/windows/
中找到。完整的解決方案和所有項目都將可用。安裝完所有內容後,您將能夠像其他專案一樣建置Visual Studio解決方案。
使用 commnad 行參數--windows-vc-build
將自動下載 SDL2 依賴項,並將路徑新增至建置流程以連結到它,而無需手動下載任何外部依賴項。
然後只需在 Visual Studio 中建置解決方案或在控制台中手動執行MSBuild
:
"%MSBUILD_PATH%MSBuild.exe" .makewindowseepp.sln -m
其中%MSBUILD_PATH%
是 MSBuild.exe Visual Studio 路徑,例如對於VS2022 Community Edition,路徑通常為:
C:Program FilesMicrosoft Visual Studio2022CommunityMSBuildCurrentBin
Windows MinGW 版本正在使用 w64devkit 發行版進行產生和測試。鑑於在建置過程中發現的一些問題,MSYS 目前尚未得到正式支援(但可以透過一些額外的步驟進行建置)。
如果您使用 w64devkit,則必須下載並解壓縮它,我們假設它是在C:w64devkit
解壓縮的。
以管理員身分執行C:w64devkitw64devkit.exe
( right click
-> Run as administrator
)。
然後轉到eepp
克隆的存儲庫目錄並運行:
premake5.exe --windows-mingw-build gmake2
--windows-mingw-build
將自動下載並連結外部依賴項(SDL2)。
然後只需使用mingw32-make.exe
或任何等效項來建立位於make/windows/
中的項目:
mingw32-make.exe -C make\windows config=release_x86_64
要建置調試建置運行:
mingw32-make.exe -C make\windows config=debug_x86_64
然後確保將位於src/thirdparty/SDL2-2.XX.X/x86_64-w64-mingw32/bin/SDL2.dll
SDL2.dll
檔案複製到bin
。如果因為某些原因eepp.dll
(或eepp-debug.dll
)沒有被自動複製,您可以將它們從libs/windows/x86_64/
複製到bin
。
您將需要 SDL2 的預先建置二進位檔案和開發庫,OpenAL 包含在作業系統中。安裝 SDL2 框架,您應該能夠建置專案。
您有兩種選項來建置專案:使用XCode或使用Makefiles 。要先使用這兩個選項中的任何一個進行構建,您還需要使用 premake4 或 premake5 來建立專案檔。
生成項目:
premake5 --use-frameworks gmake2
並建構它:
make -C make/macosx
您可以使用projects/osx/make.sh
腳本來產生Makefile並建置專案。
跑步:
premake5 --use-frameworks xcode4
並開啟在make/macosx/
產生的 XCode 項目,或簡單地從命令列建置:
xcodebuild -project make/macosx/project-name.xcodeproj
在projects/android-project/
中有一個gradle專案。它將建立包含所有依賴項的庫。使用範例專案作為您的專案的基礎。請注意,有一個用於建立該庫的eepp.mk
專案檔案。該文件可以在您的專案中使用。
該專案提供了兩個文件來建立庫和演示。您可以根據需要使用其中任何一個。這些檔案位於projects/ios
:
此腳本可用於產生 eepp 中所有包含項目(演示、工具、共享庫、靜態庫等)的 xcode 項目和解決方案。它還將下載並建立 SDL2 fat 靜態庫,以便能夠將該庫引用到專案中。遺憾的是,在建立專案後,您需要對您不想建立或測試的任何/所有專案進行一些細微的更改,因為生成的專案缺少一些細微的配置。執行此腳本後,您需要開啟位於make/ios/eepp.xcworkspace
中的解決方案。要建立靜態庫,您不會發現任何問題(開箱即用)。但要測試一些範例,需要:
選擇(點選項目名稱)要測試的項目,例如eepp-empty-window
。您將看到幾個選項卡/選項,轉到Build Settings ,然後找到選項Info.plist文件,雙擊編輯並寫入: Info.plist
。這將指示讀取與項目位於同一目錄中的檔案。前往「常規」選項卡,並使用將產生的應用程式套件的識別碼名稱來完成「套件識別碼」 ,在此範例中,您可以使用類似以下內容的內容: eepp-empty-window
。這將允許您建置並運行該專案。
此eepp-empty-window
演示不使用任何資產/資源,但其他演示需要載入資產,並且需要將此資產添加到專案中才能可供應用程式包使用。例如,專案eepp-ui-hello-world
需要您將assets
資料夾新增至專案。您需要做的是:選擇項目並轉到“構建階段”選項卡,在“複製捆綁資源”中單擊加號圖標 (+),然後轉到“添加其他...” ,找到並選擇bin/assets/
資料夾,然後結束。那應該就夠了。
此腳本可用於將 SDL2 和 eepp 建置為兩個胖靜態庫,其中包含 arm64 和 x86_64 架構(iPhone/iPad 的 arm64 和模擬器的 x86_64)。若要產生發布版本,請傳遞config=release
作為腳本的參數 ( sh compile-all.sh config=release
)。建置的檔案將位於libs/ios/
中,如libSDL2.a
和libeepp.a
(或libeepp-debug.a
用於調試建置)。這兩個文件可以整合到您的專案中。
您首先需要下載並安裝 emscripten。然後在projects/emscripten/make.sh
中有一個用於建立emscripten專案的腳本。在執行此腳本之前,請記住設定 emsdk 環境,它應該類似於: source /path/to/emsdk/emsdk_env.sh
。這在GNU/Linux或macOS中應該就足夠了(僅在 GNU/Linux 上測試過)。
建置後,所有二進位檔案都位於bin
目錄中。二進位檔案需要兩個檔案:eepp 函式庫和 SDL2 函式庫。 eepp 函式庫將位於libs/{OS}/
中。建置腳本將嘗試將 eepp 庫符號連結到bin
中,如果失敗,則應手動複製或符號連結。關於儲存庫中未提供的 SDL2 庫,因此為了執行演示,您需要下載正確的 SDL2 庫作業系統版本和體系結構。
該庫已經開發了好幾年,從一開始就經歷了很多變化,我正在做任何我認為必要的更改來改進它,所以 API 仍然不完全穩定(但接近穩定)。它被用於多個面向宣傳活動的應用程式中,這些應用程式主要是為 Android 裝置和 Windows PC 開發的。
我個人從來沒有時間用它來開發一個複雜的遊戲(幾個失敗的專案),但我為客戶製作了幾個以 UI 為導向的遊戲。
目前專案重點是UI模組。我將繼續專注於此。
該計劃是提供一個替代的 UI 工具包,完全硬體加速,類似於 Android 工具包,但更簡單(易於使用)並且也面向桌面應用程式。
音訊和網路模組基於 SFML 中的模組,但具有上述幾個重要差異。
我喜歡使用做得好的並且適合我的需求的東西,但是由於我對如何實現一些東西有我個人的看法,所以我更喜歡使用程式碼,以完全控制它。
許多想法也取自其他項目。我可以考慮一些: cocos2d-x 、 raylib 、 Android SDK 、 libGDX 、 Godot 、 XNA 、 LÖVE和許多其他專案。
如果出於某種瘋狂的原因,這一切對您來說很有趣,請聯繫我,讓我知道我是否可以幫助您進入圖書館,如果您願意,您將來可以為其做出貢獻。這個項目比其他任何事情都更需要貢獻者。
目前圖書館狀況良好。就功能而言,應該與最常用的 2D 遊戲引擎處於相似的位置。但當然缺乏可以從Godot或cocos2d-x獲得的支持+社群。
該庫的主要思想是專注於一種比其他選項更好的通用方法來開發基於 UI 的應用程式和遊戲,並且具有更清晰的程式碼和實作。
我開發這個函式庫的主要原因是為了樂趣和學習新技術。我喜歡花時間在圖書館上工作,但我知道可能沒有真正的理由去開發這樣的東西與大量類似的替代品。
關於程式碼品質:這個專案很早以前就開始了,隨著時間的推移經歷了很多修改。大部分程式碼庫仍然使用舊的 C++ 實作(例如:原始指標、執行緒自己的實作、互斥體等)。其中一些東西可以“現代化”,但是,另一些東西沒有多大意義,或者徹底修改它們將花費太多時間來證明這項努力的合理性。我正在致力於“現代化”程式碼的某些部分,新程式碼通常看起來更現代。
不斷改進 UI 系統,添加新的小部件和佈局並改進 CSS 支援。
簡化並改進 UI 小部件皮膚/主題支援。
改進/建立 UI 模組的文檔。
添加更多範例和一些工具。
添加腳本支持,但首先我想穩定該庫,但我已經做到了。
添加 2D 骨骼動畫支援(可能是 Spine2D,實現起來不需要太多工作)。
可能會棄用 Maps 模組,因為我將把精力集中在 UI 系統上。
Sean Barrett 用於 stb_image 和所有 stb 庫。
Sam Latinga 用於簡單 DirectMedia 層。
Jonathan Dummer 的簡單 OpenGL 影像庫。
SFML 的洛朗·戈米拉
尤里·科貝茨 for litehtml
Michael RP Ragazzon 的 RmlUI
精簡版 rxi
SerenityOS 的 Andreas Kling
瑞安·C·戈登 (Ryan C. Gordon) 為 mojoAL 設計
大衛·里德 (David Reid) 的 dr_libs
用於 minimp3 及更多的 Lion (Lieff)
劉易斯·範·溫克爾 (Lewis Van Winkle) 的 PlusCallback
Dieter Baron 和 Thomas Klausner 的 libzip
讓-盧·蓋利 (Jean-loup Gailly) 和馬克·阿德勒 (Mark Adler) 的 zlib
米蘭伊基茲 (Milan Ikits) 和馬塞洛馬加隆 (Marcelo Magallon) 為 GLEW 拍攝
米克莫諾寧 (Mikko Mononen) 為 nanosvg 設計
斯科特·萊姆貝克 (Scott Lembcke) 為 Chipmunk2D 設計
克里斯托夫·里奇奧 (Christophe Riccio) 為 glm 設計
Rich Geldreich 用於圖片重採樣器和 jpeg 壓縮器
Arseny Kapoulkine 的 pugixml
傑森·帕金斯的預拍
Martín Lucas Golini(我)以及 SOIL2 和 efsw 的所有貢獻者
libogg 和 libvorbis 的 Xiph 開源社區
mbed TLS 的 ARMmbed 社區
kcat 用於 openal-soft
FreeType 項目
還有很多人!
麻省理工學院許可證