SDL3 для Desktop (MinGW): Создаём пустое окно с нуля для 2D-графики на SDL3, Си и C++

• hello-sdl3-c.zip
• hello-sdl3-cpp.zip

• Установите CMake и MinGW 13.1 по пошаговой инструкции: Установка CMake и MinGW 13.1 для сборки С и C++ приложений из консоли и из Qt Creator в EXE
• Скачайте библиотеку SDL3 по ссылке: SDL3-devel-3.4.2-mingw.zip
• Примечание. Эту библиотеку в собранном виде я скачал по этой ссылке с официальной страницы со сборками под разные платформы. Но я немного сократил путь к вложенным папкам
• Скачайте архив с динамической библиотекой SDL3.dll: SDL3-3.4.2-win32-x64.zip
• Примечание. Этот архив я скачал по этой ссылке с официальной страницы.
• Извлеките содержимое архивов выше в какую-нибудь общую папку, например, с именем "libs" на C:
  
• Путь к SDL3.dll (C:\libs\SDL3-3.4.2-win32-x64) добавьте в переменную окружения Path:
  
• Примечание. Диалоговое окно с Path можно открыть, если нажать Win + R и набрать команду:
  

  Bash
  1 sysdm.cpl ,3

• Примечание. ",3" означает, что будет открыта третья вкладка в диалоговом окне настроек:
  
• Создайте новую пустую папку под названием "hello-sdl3-c"
• Откройте эту папку в текстовом редакторе - например, в Sublime Text 4, Notepad++, VS Code и т.д.
• Создайте внутри этой папки файл "CMakeLists.txt" и скопируйте в него следующий код:
  
  CMakeLists.txt
  
  

  Bash
  1 2 3 4 5 6 7 8 9 10 11 12 13 14 cmake_minimum_required(VERSION 3.21) project(hello-world-c)   # Задаем название будущего приложения (в Windows это app.exe, а в вебе было бы app.js / app.wasm) add_executable(app)   # Устанавливаем стандарт C set(CMAKE_C_STANDARD 11)   # Добавляем исходный код к проекту target_sources(app     PRIVATE     src/main.c )

• В проекте создайте папку "src", а в папке "src" файл "main.c"
• Перейдите по этой ссылке на официальный пример "clear.c" и скопируйте содержимое файла "clear.c"
• Вставьте содержимое файла "clear.c" в промпт ИИ, например, Gemini и попросите в промпте:
  
  

  Переведи комментарии на русский не меняя код

• Скопируйте полученный код и вставьте его в файл "src/main.c"
  
  main.c
  
  

  C

  1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 /*  * Этот пример создает окно и рендерер SDL, а затем очищает  * окно разным цветом каждый кадр, так что в итоге вы получите окно,  * цвет которого плавно меняется.  *  * Этот код является общественным достоянием. Используйте его для любых целей!  */   #define SDL_MAIN_USE_CALLBACKS 1  /* использовать функции обратного вызова вместо main() */ #include <SDL3/SDL.h> #include <SDL3/SDL_main.h>   /* Мы будем использовать этот рендерер для рисования в этом окне каждый кадр. */ static SDL_Window *window = NULL; static SDL_Renderer *renderer = NULL;   /* Эта функция запускается один раз при старте. */ SDL_AppResult SDL_AppInit(void **appstate, int argc, char *argv[]) {     SDL_SetAppMetadata("Example Renderer Clear", "1.0", "com.example.renderer-clear");       if (!SDL_Init(SDL_INIT_VIDEO)) {         SDL_Log("Не удалось инициализировать SDL: %s", SDL_GetError());         return SDL_APP_FAILURE;     }       if (!SDL_CreateWindowAndRenderer("examples/renderer/clear", 640, 480, SDL_WINDOW_RESIZABLE, &window, &renderer)) {         SDL_Log("Не удалось создать окно/рендерер: %s", SDL_GetError());         return SDL_APP_FAILURE;     }     SDL_SetRenderLogicalPresentation(renderer, 640, 480, SDL_LOGICAL_PRESENTATION_LETTERBOX);       return SDL_APP_CONTINUE;  /* продолжаем работу программы! */ }   /* Эта функция запускается, когда происходит новое событие (ввод мыши, нажатие клавиш и т.д.). */ SDL_AppResult SDL_AppEvent(void *appstate, SDL_Event *event) {     if (event->type == SDL_EVENT_QUIT) {         return SDL_APP_SUCCESS;  /* завершаем программу, сообщая ОС об успехе. */     }     return SDL_APP_CONTINUE;  /* продолжаем работу программы! */ }   /* Эта функция запускается один раз за кадр и является сердцем программы. */ SDL_AppResult SDL_AppIterate(void *appstate) {     const double now = ((double)SDL_GetTicks()) / 1000.0;  /* конвертируем миллисекунды в секунды. */     /* выбираем цвет для кадра, который будем рисовать. Трюк с синусоидой заставляет цвета плавно сменять друг друга. */     const float red = (float) (0.5 + 0.5 * SDL_sin(now));     const float green = (float) (0.5 + 0.5 * SDL_sin(now + SDL_PI_D * 2 / 3));     const float blue = (float) (0.5 + 0.5 * SDL_sin(now + SDL_PI_D * 4 / 3));     SDL_SetRenderDrawColorFloat(renderer, red, green, blue, SDL_ALPHA_OPAQUE_FLOAT);  /* новый цвет, полная непрозрачность. */       /* очищаем окно цветом отрисовки. */     SDL_RenderClear(renderer);       /* выводим свежеочищенный результат на экран. */     SDL_RenderPresent(renderer);       return SDL_APP_CONTINUE;  /* продолжаем работу программы! */ }   /* Эта функция запускается один раз при завершении работы. */ void SDL_AppQuit(void *appstate, SDL_AppResult result) {     /* SDL сама очистит окно и рендерер за нас. */ }

• Здесь вы можете копировать функции и строки кода в ИИ, например, в Gemini и просить объяснить простыми словами, что делает код. Читайте комментарии в коде выше. Код в итоге покажет окно, а фон холста будет плавно менять цвет. На официальном репозитории много примеров для начинающих в папке examples, которые необходимо изучать с помощью ИИ, а чтобы ИИ вам доходчиво объяснял, просите его объяснять простыми словами
  
• Перейдите в папку "C:\libs" и скопируйте следующий путь:
  
  
  
• Вставьте этот пусть в файл "CMakeLists.txt", создав переменную SDL3_DIR, и замените обратные косые черты на прямые, вот так:
  
  

  Bash
  1 set(SDL3_DIR "C:/libs/SDL3-devel-3.4.2-mingw/lib/cmake/SDL3")

• Добавьте команду поиска библиотеки и команду для линковки:
  
  

  Bash
  1 2 3 4 5 6 7 # Проверяем наличие библиотек в системе # Если она не будет найдены, CMake прервет настройку с ошибкой # REQUIRED - переводится, как «обязательно» или «требуется» find_package(SDL3 REQUIRED)   # Привязываем библиотеки к нашему приложению (настройка линковки и путей include) target_link_libraries(app PRIVATE SDL3::SDL3)

• В итоге получился файл:
  
  CMakeLists.txt
  
  

  Bash

  1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 cmake_minimum_required(VERSION 3.21) project(hello-sdl3-c)   # Задаем название будущего приложения (в Windows это будет app.exe, а в вебе было бы app.js / app.wasm) add_executable(app)   # Устанавливаем стандарт C set(CMAKE_C_STANDARD 11)   # Указываем точное местоположение конфигурационных файлов библиотек # Имя переменной должно строго соответствовать: НазваниеБиблиотеки_DIR set(SDL3_DIR "C:/libs/SDL3-devel-3.4.2-mingw/lib/cmake/SDL3")   # Добавляем исходный код к проекту target_sources(app     PRIVATE     src/main.c )   # Проверяем наличие библиотек в системе # Если она не будет найдены, CMake прервет настройку с ошибкой # REQUIRED - переводится, как «обязательно» или «требуется» find_package(SDL3 REQUIRED)   # Привязываем библиотеки к нашему приложению (настройка линковки и путей include) target_link_libraries(app PRIVATE SDL3::SDL3)

• Откройте консоль в папке проекта и введите команду конфигурирования проекта:
  
  

  Bash
  1 cmake -G "MinGW Makefiles" -S . -B dist/win -DCMAKE_BUILD_TYPE=Debug

  , где элементы команды означают следующее:
  
  • cmake - команда CMake
  • -G "MinGW Makefiles" - используем MinGW
  • -S . - указываем, что источник "Source", то есть файл CMakeLists.txt находится в текущей папке
  • -B dist/win - указываем куда сохранять конфигурационные файлы и для этого мы указываем, что нужно создать папку "dist/win"
  • -DCMAKE_BUILD_TYPE=Debug - указываем, что сборка будет отладочная. Она больше чем Release, но Debug собирается быстрее (хотя для Desktop разницы в скорости сборки для маленьких проектов нет, а для WebAssembly разница огромная - пара секунд для Debug и 15 и более секунд на Release)
• Введите команды для сборки приложения в EXE:
  

  Bash
  1 cd dist\win

  Bash
  1 cmake --build .

• Создан EXE с именем "app.exe". Для его запуска здесь же в открытой консоли введите команду:
  

  Bash
  1 app

• Появится окно, где фон холста будет плавно переливаться разными цветами
• Примечание. Теперь вы можете менять код и сохранять на Ctrl+S, а в консоли достаточно будет нажать кнопку-стрелку вверх, чтобы выбрать команду "cmake --build ." и нажать Enter. Команда конфигурирования выполняется только один раз. Если вы куда-то перенесёте папку "hello-world-c" или переименуете её, то нужно будет удалить папку "dist" и сделать конфигурирование снова той же командой:
  

  Bash
  1 cmake -G "MinGW Makefiles" -S . -B dist/win -DCMAKE_BUILD_TYPE=Debug

• Создайте три батника, чтобы проще было делать конфигурирование, сборку и запуск приложения:
  
  config-exe.bat
  
  

  Bash
  1 cmake -G "MinGW Makefiles" -S . -B dist/win -DCMAKE_BUILD_TYPE=Debug

  build-exe.bat
  
  

  Bash
  1 2 3 cd dist\win cmake --build . cd ..\..

  run-exe.bat
  
  

  Bash
  1 dist\win\app

• Теперь можно набирать очень быстро команды:
  
  

  Bash
  1 config-exe

  Bash
  1 build-exe

  Bash
  1 run-exe

• После первого запуска команд их можно выбирать клавишами-стрелками в CMD. Например, изменили что-то в коде и клавишами-стрелками в CMD выбрали "build-exe", а после сборки выбрали "run-exe"

Сборка созданного примера в Qt Creator

• Скачайте и установите Qt Creator версии 18 по ссылке. Установщик вы найдёте в списке "Assets"
• Запустите Qt Creator, набрав в поиске программ "Qt Creator"
• В левом верхнем углу нажмите "Fire" > "Open File or Project..."
• В открывшемся диалоговом окне перейдите в папку "hello-sdl3-c" и выберите файл "CMakeLists.txt"
• Проект будет открыт в Qt Creator. Вы может запустить проект на выполнение нажав зелёный треугольник в левом нижнем углу
• Поставьте точку остановка, кликнув мышкой слева от номера строки кода и нажмите зелёный треугольник с жуком в левом нижнем углу. Запустится отладка по шагам. Вы можете нажимать кнопки на панели инструментов - например, кнопку для выполнения кода без захода внутрь функции или с заходом внутрь функции

Переделываем Си-проект в C++

• Сделайте копию папки "hello-sdl3-c" и переименуйте её в "hello-sdl3-cpp"
• В этом новом проекте удалите папку "dist"
• Откройте папку "hello-sdl3-cpp" в каком-нибудь редакторе кода, например, в Sublime Text 4, Nodepad++, либо в IDE Qt Creator ("File" > "Open File or Project" -> выберите файл "CMakeLists.txt")
• В редакторе кода или IDE откройте файл "CMakeLists.txt" для редактирования
• Измените имя проекта в строке:
  
  Было:
  

  Bash
  1 project(hello-sdl3-c)

  Стало:
  

  Bash
  1 project(hello-sdl3-cpp)

• Замените стандарт Си на стандарт C++:
  
  Было:
  

  Bash
  1 set(CMAKE_C_STANDARD 11)

  Стало:
  

  Bash
  1 2 3 # Устанавливаем стандарт C++ set(CMAKE_CXX_STANDARD 20) set(CMAKE_CXX_STANDARD_REQUIRED ON)

• Измените расширение файла исходного кода:
  
  Было:
  

  Bash
  1 2 3 4 target_sources(app     PRIVATE     src/main.c )

  Стало:
  

  Bash
  1 2 3 4 target_sources(app     PRIVATE     src/main.cpp )

• Переименуйте файл "src/main.c" в "src/main.cpp"
  
• Введите следующие команды в консоли для конфигурирования, сборки и запуска EXE:
  
  

  Bash
  1 2 3 config-exe build-exe run-exe

Миниатюры