如何使用 SDL 将纹理加载到使用 emscripten 的 WebAssembly 项目中？

Question

我正在尝试使用 SDL 将纹理加载到我的应用程序中。当构建为本机应用程序时，它可以正常工作。但是当我用 Emscripten 构建它时，无法加载纹理。

纹理图像的宽度是64像素，我可以通过打印出SDL_Surface实例的w成员来验证。但是当我尝试在 WebAssembly 应用程序中打印出相同的成员时，它会产生 5076...

用emscripten打包后图片会变成"broken"吗？

这是加载纹理的代码：

SDL_Surface *image = IMG_Load("resources/binaries/crate.jpg");
GLuint textureID;
glGenTextures(1, &textureID);
glBindTexture(GL_TEXTURE_2D, textureID);
std::cout << image->w << std::endl;
glTexImage2D(GL_TEXTURE_2D, 0, 3, 64, 64, 0, GL_RGB, GL_UNSIGNED_BYTE, image->pixels);

这是使用 Emscripten 构建网络应用程序的命令

emcc --bind -s USE_SDL=2 -s USE_SDL_IMAGE=2 -o webapp.js src/webapp.cpp --preload-file resources

我在启动网络应用程序时收到浏览器的错误消息是

webapp.js:9533 WebGL: INVALID_VALUE: texImage2D: width or height out of range

这是有道理的，因为图像的分辨率太疯狂了...

Answer 1

原来我在执行 emcc 时必须使用 --use-preload-plugins 来创建预加载文件。最后，命令如下所示：

emcc --bind -s USE_SDL=2 -s USE_SDL_IMAGE=2 -o webapp.js src/webapp.cpp --preload-file resources --use-preload-plugins

如何使用 SDL 将纹理加载到使用 emscripten 的 WebAssembly 项目中？

How to load textures using SDL to a WebAssembly project using emscripten?

c++

emscripten

sdl-image

webassembly