SFML 官方示例

SFML 官方示例 的 JavaScript 移植，包含图形、原生窗口、输入、音频和网络等 24 个示例。Android 尚未移植。

全部示例 · 构建要求 · 功能示例 · 游戏与应用

快速开始

在仓库根目录执行：

npm ci
cd examples/official
node tennis/Tennis.cjs

下文命令均在 examples/official 中运行，各脚本会自动加载所需资源。图形示例需要显示服务与 OpenGL 窗口支持。

浏览：图形 · 输入与事件 · 音频 · 网络 · 平台集成

图形

Island

地形与光照

操作 · 方向键修改参数，Enter 重新生成

node island/Island.cjs

Shader

五种 shader 场景

sfml.js 标识的边缘检测预览

操作 · 左／右切换，鼠标调整参数

node shader/Shader.cjs

Tennis

乒乓球

操作 · Space 或触摸开始，上／下移动，Esc 退出

node tennis/Tennis.cjs

Stencil

模板遮罩与图形动画

node stencil/Stencil.cjs

Text

40 个多语言样本

操作 · 点击选择，F1／F2／F3 切换边框和光标，F4 切换预处理，左／右移动光标

node text/Text.cjs

输入与事件

Keyboard

物理键位、按键事件、文字输入与声音反馈

node keyboard/Keyboard.cjs

Event handling

五种事件分发形式

操作 · Enter 切换

node event_handling/EventHandling.cjs

Raw input

鼠标原始移动输入

node raw_input/RawInput.cjs

Joystick

摇杆轴与按键

操作 · 0～7 选择设备，Tab 切换通用／游戏手柄视图

node joystick/Joystick.cjs

音频

录音示例需要麦克风及系统录音权限。

Sound effects

九种音效

操作 · 左／右切换，鼠标调整，上／下选择衰减模型或波形，Space 旁路 DSP，F1 切换输出设备

node sound_effects/SoundEffects.cjs

Sound

播放 WAV 音效及 OGG、FLAC、MP3 音乐

node sound/Sound.cjs

Sound capture

选择设备与采样率，录音后播放或保存

node sound_capture/SoundCapture.cjs

Sound device

设备通知、自动路由与设备丢失恢复；Ctrl+C 退出

node sound_device/SoundDevice.cjs

网络

HTTP

带重定向处理的交互式 HTTP GET

node http/Http.cjs

FTP

交互式 FTP 客户端，端口 21

node ftp/Ftp.cjs

SFTP

交互式 SFTP 客户端；先确认主机指纹，再登录

node sftp/Sftp.cjs

Sockets

TCP、TLS 或 UDP 消息交换，端口 50001

node sockets/Sockets.cjs

VoIP

TCP 语音采集、播放和回放，端口 2435

node voip/VoIP.cjs

sockets 和 VoIP 各开两个终端，分别选择服务端、客户端；本机测试填写 127.0.0.1。

平台集成

编译 nodegl 需要 CMake、C++ 编译器和 OpenGL 开发库，Linux 可安装 libgl1-mesa-dev。Vulkan 还需要 Vulkan 加载器和支持 4 倍各向异性过滤的驱动。

Window

OpenGL 窗口中的六色旋转立方体

操作 · 拖动窗口边缘调整大小，Esc 或关闭窗口退出

node window/Window.cjs

macOS、Linux、Windows · 根目录的 npm ci 会安装 @wettstein/nodegl

OpenGL

SFML 背景、文字与 OpenGL 纹理立方体混合绘制

操作 · 鼠标移动立方体，Enter 切换 mipmap，Space 切换 sRGB，Esc 退出

node opengl/OpenGL.cjs

macOS、Linux、Windows · 根目录的 npm ci 会安装 @wettstein/nodegl

Vulkan

Vulkan 渲染的旋转纹理立方体

操作 · 鼠标移动立方体，拖动窗口边缘调整大小，Esc 或关闭窗口退出

node vulkan/Vulkan.cjs

Linux x64（X11）或 Windows x64、Node.js 20+ · npm ci --prefix vulkan --ignore-scripts

Vulkan 面向 x64 的 Linux／X11 和 Windows，使用 nvk 0.8.0，需要 Vulkan 加载器及支持 4 倍各向异性过滤的驱动与设备。SFML 负责窗口、事件和 surface，nvk 直接调用 Vulkan，无自定义原生桥接；SFML Graphics 仍使用 OpenGL。SFML 在编译期不支持 macOS Vulkan 集成，仅安装 MoltenVK 无法启用。Linux／X11 和 Windows 的原生绘制及交互验证均已通过。操作与要求见 平台集成说明。

Cocoa

macOS 原生控件与嵌入的 SFML 视图

操作 · Update 或 Enter 更新文字，Visible 切换标识显隐，旋钮控制旋转，Color 选择背景色，Up／Down 缩放；关闭窗口、Cmd+Q 或 Ctrl+C 退出

node cocoa/Cocoa.cjs

macOS · npm ci --prefix cocoa --ignore-scripts

Win32

Windows 原生窗口中的两个 SFML 动画视图与 Quit 按钮

操作 · Quit、关闭窗口或 Ctrl+C 退出

node win32/Win32.cjs

Windows x64、Node.js 20+ · npm ci --prefix win32 --ignore-scripts

X11

两个嵌入的 SFML 窗口，以不同速度旋转的立方体

操作 · 任意键、关闭窗口或 Ctrl+C 退出

node X11/X11.cjs

带 X11 显示服务的 Linux · 根目录的 npm ci 会安装 x11 和 @wettstein/nodegl

来源与许可证

示例移植自 SFML，源码版本与资源来源记录在 provenance.json。

• SFML 源码：zlib 许可证。
• 上游素材与作者：asset_licenses.md。
• Noto 字体：SIL Open Font License 1.1。
• 移植的 stb Perlin 实现：MIT／公有领域双许可证。