Dealing with keyboard layout for input on Qt WebAssembly

48 Views Asked by At

I am writing the Super Mario clone game for learning a programming, OpenGL ES, Box2D, OpenAL and so on (not for commerce). A keyboard works well when the system keyboard layout is set to English. But if the system keyboard layout is set to another language Mario cannot move and jump.

I solved this problem for Windows only by setting the system keyboard layout to English using WinAPI but how to solve it for WebAssembly?

#ifdef _WIN32
#include <windows.h>
#endif

OpenGLWindow::OpenGLWindow()
{
#ifdef _WIN32
    PostMessage(GetForegroundWindow(), WM_INPUTLANGCHANGEREQUEST, 1, 0x04090409);
#endif

Download my example to reproduce the problem: keyboard-layout-qt6.zip. If your system keyboard layout is English you can press WAS or arrow-keys and see "left", "right", "jump" in the debug console. But if you change the system keyboard layout to another language you do not see the debug output.

keyboard-layout-qt6.pro

QT += core opengl gui widgets

win32: LIBS += -lopengl32

CONFIG += c++17

SOURCES += \
    main.cpp

main.pp

#include <QtGui/QKeyEvent>
#include <QtGui/QOpenGLFunctions>
#include <QtOpenGL/QOpenGLWindow>
#include <QtWidgets/QApplication>

class OpenGLWindow : public QOpenGLWindow, private QOpenGLFunctions
{
    void initializeGL() override
    {
        initializeOpenGLFunctions();
    }

    void keyPressEvent(QKeyEvent *event) override
    {
        if (event->key() == Qt::Key::Key_W || event->key() == Qt::Key::Key_Up)
        {
            qDebug() << "jump";
        }
        if (event->key() == Qt::Key::Key_A || event->key() == Qt::Key::Key_Left)
        {
            qDebug() << "left";
        }
        if (event->key() == Qt::Key::Key_D || event->key() == Qt::Key::Key_Right)
        {
            qDebug() << "right";
        }
    }
};

int main(int argc, char *argv[])
{
    QApplication::setAttribute(Qt::ApplicationAttribute::AA_UseDesktopOpenGL);
    QApplication app(argc, argv);
    OpenGLWindow w;
    w.show();
    return app.exec();
}

I made a level using Free Texture Packer and Tiled Map Editor.

Desktop:

enter image description here

Android:

enter image description here

Added 3/25/2024

All resources (sprites, music and sounds) have been replaced with free ones. You can see a list of free resources here. For example, I took the sprites here: https://webfussel.itch.io/more-bit-8-bit-mario

enter image description here

0

There are 0 best solutions below