mirror of https://github.com/libsdl-org/SDL.git
Added INTRO-emscripten.md
This commit is contained in:
parent
21b433536a
commit
0eaa8c6d81
|
|
@ -0,0 +1,38 @@
|
|||
|
||||
# Introduction to SDL with Emscripten
|
||||
|
||||
First, you should have the Emscripten SDK installed from:
|
||||
|
||||
https://emscripten.org/docs/getting_started/downloads.html
|
||||
|
||||
We'll start by creating a simple project to build and run [hello.c](hello.c)
|
||||
|
||||
## Building SDL
|
||||
|
||||
Once you have a command line interface with the Emscripten SDK set up and you've changed directory to the SDL directory, you can build SDL like this:
|
||||
|
||||
```sh
|
||||
mkdir hello
|
||||
cd hello
|
||||
emcmake cmake ..
|
||||
emmake make
|
||||
```
|
||||
|
||||
## Building your app
|
||||
|
||||
In this case we'll just run a simple command to compile our source with the SDL library we just built:
|
||||
```sh
|
||||
emcc -o index.html ../docs/hello.c -I../include -L. -lSDL3
|
||||
```
|
||||
|
||||
## Running your app
|
||||
|
||||
You can now run your app by pointing a webserver at your build directory and connecting a web browser to it.
|
||||
|
||||
## More information
|
||||
|
||||
A more complete example is available at:
|
||||
|
||||
https://github.com/Ravbug/sdl3-sample
|
||||
|
||||
Additional information and troubleshooting is available in [README-emscripten.md](README-emscripten.md)
|
||||
|
|
@ -239,13 +239,13 @@ If you want to build with thread support, something like this works:
|
|||
```bash
|
||||
mkdir build
|
||||
cd build
|
||||
emcmake cmake -DSDL_THREADS=On ..
|
||||
emcmake cmake -DSDL_THREADS=ON ..
|
||||
# you can also do `emcmake cmake -G Ninja ..` and then use `ninja` instead of this command.
|
||||
emmake make -j4
|
||||
```
|
||||
|
||||
To build the tests, add `-DSDL_TESTS=On` to the `emcmake cmake` command line.
|
||||
To build the examples, add `-DSDL_EXAMPLES=On` to the `emcmake cmake` command line.
|
||||
To build the tests, add `-DSDL_TESTS=ON` to the `emcmake cmake` command line.
|
||||
To build the examples, add `-DSDL_EXAMPLES=ON` to the `emcmake cmake` command line.
|
||||
|
||||
|
||||
## Building your app
|
||||
|
|
|
|||
80
docs/hello.c
80
docs/hello.c
|
|
@ -9,52 +9,60 @@
|
|||
including commercial applications, and to alter it and redistribute it
|
||||
freely.
|
||||
*/
|
||||
#define SDL_MAIN_USE_CALLBACKS 1 /* use the callbacks instead of main() */
|
||||
#include <SDL3/SDL.h>
|
||||
#include <SDL3/SDL_main.h>
|
||||
|
||||
int main(int argc, char *argv[])
|
||||
static SDL_Window *window = NULL;
|
||||
static SDL_Renderer *renderer = NULL;
|
||||
|
||||
/* This function runs once at startup. */
|
||||
SDL_AppResult SDL_AppInit(void **appstate, int argc, char *argv[])
|
||||
{
|
||||
/* Create the window */
|
||||
if (!SDL_CreateWindowAndRenderer("Hello World", 800, 600, SDL_WINDOW_FULLSCREEN, &window, &renderer)) {
|
||||
SDL_Log("Couldn't create window and renderer: %s\n", SDL_GetError());
|
||||
return SDL_APP_FAILURE;
|
||||
}
|
||||
return SDL_APP_CONTINUE;
|
||||
}
|
||||
|
||||
/* This function runs when a new event (mouse input, keypresses, etc) occurs. */
|
||||
SDL_AppResult SDL_AppEvent(void *appstate, SDL_Event *event)
|
||||
{
|
||||
if (event->type == SDL_EVENT_KEY_DOWN ||
|
||||
event->type == SDL_EVENT_QUIT) {
|
||||
return SDL_APP_SUCCESS; /* end the program, reporting success to the OS. */
|
||||
}
|
||||
return SDL_APP_CONTINUE;
|
||||
}
|
||||
|
||||
/* This function runs once per frame, and is the heart of the program. */
|
||||
SDL_AppResult SDL_AppIterate(void *appstate)
|
||||
{
|
||||
SDL_Window *window = NULL;
|
||||
SDL_Renderer *renderer = NULL;
|
||||
const char *message = "Hello World!";
|
||||
int w = 0, h = 0;
|
||||
float x, y;
|
||||
const float scale = 4.0f;
|
||||
bool done = false;
|
||||
|
||||
/* Create the window */
|
||||
if (!SDL_CreateWindowAndRenderer("Hello World", 0, 0, SDL_WINDOW_FULLSCREEN, &window, &renderer)) {
|
||||
SDL_Log("Couldn't create window and renderer: %s\n", SDL_GetError());
|
||||
return 1;
|
||||
}
|
||||
/* Center the message and scale it up */
|
||||
SDL_GetRenderOutputSize(renderer, &w, &h);
|
||||
SDL_SetRenderScale(renderer, scale, scale);
|
||||
x = ((w / scale) - SDL_DEBUG_TEXT_FONT_CHARACTER_SIZE * SDL_strlen(message)) / 2;
|
||||
y = ((h / scale) - SDL_DEBUG_TEXT_FONT_CHARACTER_SIZE) / 2;
|
||||
|
||||
while (!done) {
|
||||
SDL_Event event;
|
||||
/* Draw the message */
|
||||
SDL_SetRenderDrawColor(renderer, 0, 0, 0, 255);
|
||||
SDL_RenderClear(renderer);
|
||||
SDL_SetRenderDrawColor(renderer, 255, 255, 255, 255);
|
||||
SDL_RenderDebugText(renderer, x, y, message);
|
||||
SDL_RenderPresent(renderer);
|
||||
|
||||
/* Handle events */
|
||||
while (SDL_PollEvent(&event)) {
|
||||
if (event.type == SDL_EVENT_KEY_DOWN ||
|
||||
event.type == SDL_EVENT_MOUSE_BUTTON_DOWN ||
|
||||
event.type == SDL_EVENT_QUIT) {
|
||||
done = true;
|
||||
}
|
||||
}
|
||||
|
||||
/* Center the message and scale it up */
|
||||
SDL_GetRenderOutputSize(renderer, &w, &h);
|
||||
SDL_SetRenderScale(renderer, scale, scale);
|
||||
x = ((w / scale) - SDL_DEBUG_TEXT_FONT_CHARACTER_SIZE * SDL_strlen(message)) / 2;
|
||||
y = ((h / scale) - SDL_DEBUG_TEXT_FONT_CHARACTER_SIZE) / 2;
|
||||
|
||||
/* Draw the message */
|
||||
SDL_SetRenderDrawColor(renderer, 0, 0, 0, 255);
|
||||
SDL_RenderClear(renderer);
|
||||
SDL_SetRenderDrawColor(renderer, 255, 255, 255, 255);
|
||||
SDL_RenderDebugText(renderer, x, y, message);
|
||||
SDL_RenderPresent(renderer);
|
||||
}
|
||||
SDL_Quit();
|
||||
|
||||
return 0;
|
||||
return SDL_APP_CONTINUE;
|
||||
}
|
||||
|
||||
/* This function runs once at shutdown. */
|
||||
void SDL_AppQuit(void *appstate, SDL_AppResult result)
|
||||
{
|
||||
}
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue