In diesem Beitrag beschreibe ich eine Möglichkeit, BGFX-Anwendungen für das Web (WebAssembly) mit Emscripten zu erstellen.
Die Installationsplattform ist Linux x86-64, zum Beispiel Arch Linux.
Lassen Sie uns zunächst Emscripten Version 3.1.51 installieren, sonst werden Sie keinen Erfolg haben, und zwar aufgrund der Änderung des Typs der dynamischen Bibliotheken in der neuesten Version von Emscripten. Mehr können Sie hier lesen:
https://github.com/bkaradzic/bgfx/discussions/3266
Das geht so:
git clone https://github.com/emscripten-core/emsdk.git
cd emsdk
./emsdk install 3.1.51
./emsdk activate 3.1.51
source ./emsdk_env.sh
Lassen Sie uns bgfx für WebAssembly zusammenbauen – Emscripten:
mkdir bgfx-build-test
cd bgfx-build-test
git clone https://github.com/bkaradzic/bx.git
git clone https://github.com/bkaradzic/bimg.git
git clone https://github.com/bkaradzic/bgfx.git
cd bgfx
emmake make wasm-debug
Als Ergebnis finden Sie im .build-Ordner Bitcode-Dateien mit der Erweiterung .bc, die mit Ihrer bgfx-Anwendung verknüpft werden müssen.
Sollte bgfx.bc, bx.bc, bimg.bc sein; Verschiedene Assemblys haben je nach Assemblytyp (Release/Debug) unterschiedliche Namen für diese Dateien.
Fügen Sie einen Link zur Datei CMakeLists.txt mit .bc-Dateien hinzu, zum Beispiel absolute Pfade zu Dateien aus dem bgfx-experiments-Projekt:
target_link_libraries(${PROJECT_NAME} SDL2 GL /home/demensdeum_stream/Sources/bgfx-build/bgfx/.build/wasm/bin/bgfxDebug.bc /home/demensdeum_stream/Sources/bgfx-build/bgfx/.build/wasm/bin/bxDebug.bc /home/demensdeum_stream/Sources/bgfx-build/bgfx/.build/wasm/bin/bimgDebug.bc)
Ändern Sie nun das native Fensterhandle in den Plattformdaten in „BGFX-Initialisierung“:
bgfx::PlatformData platformData{};
platformData.context = NULL;
platformData.backBuffer = NULL;
platformData.backBufferDS = NULL;
platformData.nwh = (void*)"#canvas";
Sie müssen außerdem den Rendertyp in OpenGL ändern:
bgfx::Init init;
init.type = bgfx::RendererType::OpenGL;
init.resolution.width = screenWidth;
init.resolution.height = screenHeight;
init.resolution.reset = BGFX_RESET_VSYNC;
init.platformData = platformData;
if (!bgfx::init(init))
{
throw std::runtime_error("Failed to initialize bgfx");
}
GLSL-Shader auf 120 neu kompilieren:
shaderc -f "VertexShader.vs" -o "VertexShader.glsl" --type "v" -p "120"
shaderc -f "FragmentShader.fs" -o "FragmentShader.glsl" --type "f" -p "120"
Ja, aber .glsl-Dateien müssen zu CMakeLists.txt als –preload-file:
hinzugefügt werden
set(CMAKE_CXX_FLAGS ... <Остальная часть>
--preload-file VertexShader.glsl \
--preload-file FragmentShader.glsl \
Es bleibt noch, die Hauptrenderschleife in Ihrer Anwendung durch einen While-Funktionsaufruf über emscripten_set_main_loop zu ersetzen.
Sie können hier darüber lesen:
https ://demensdeum.com/blog/ru/2017/03/29/porting-sdl-c-game-to-html5-emscripten/
Als nächstes stellen Sie Ihr Emscripten-Projekt wie gewohnt zusammen, alles sollte funktionieren.
Interessant – Im Emscripten 3.1.51-Build scheint OpenAL zu fehlen (oder nur ich).
Quellcode des Projekts, der mit bgfx und Emscripten korrekt kompiliert wird:
https://github.com/demensdeum/ bgfx-experiments/tree/main/2-emscripten-build
Quellen
https://github.com/bkaradzic/bgfx/discussions/3266
https://bkaradzic.github.io/bgfx/build.html
https://emscripten.org/docs/getting_started/downloads.html
https ://demensdeum.com/blog/ru/2017/03/29/porting-sdl-c-game-to-html5-emscripten/
https://llvm.org/docs/BitCodeFormat.html
