QOpenGLWidget support on Win10/iOS

[yalnte]

Update: I had a dialog popping up on first execution that took the focus from the main window (not sure why it only appears and with screen reader on iOS.) Suppressing that allows the app to be tested on iOS too…

The QOpenGLWidget is also black on iOS. On updating the display it sometimes shows artefacts from the sibling windows.

So:

WASM Firefox / Ubuntu 20 - QOGLW works in my app. WASM FF / Win 10 & iIOS Safari - black window. Same WASM file hosted on same server.

Anyone else seen similar please?

[yalnte]

Have now tried on Chrome browser in Android and it gives a 2/3 size OGL display with QPainter overlay at correct size. Starting to wonder if black widget is an issue with the QPainter as the text it displays has a black background rather than transparent.

[yalnte]

I'm wondering if this is actually memory related as a very large OGL model on Ubuntu gives a black screen too and these messages in the debug console:

Uncaught TypeError: ringbuffer is undefined
    getTempVertexBuffer http://localhost:6931/qtloader.js line 461 > eval:6780
    preDrawHandleClientVertexAttribBindings http://localhost:6931/qtloader.js line 461 > eval:6840
    _emscripten_glDrawArrays http://localhost:6931/qtloader.js line 461 > eval:7377
qtloader.js line 461 > eval:6780:19
    getTempVertexBuffer http://localhost:6931/qtloader.js line 461 > eval:6780
    preDrawHandleClientVertexAttribBindings http://localhost:6931/qtloader.js line 461 > eval:6840
    _emscripten_glDrawArrays http://localhost:6931/qtloader.js line 461 > eval:7377
    emscripten_glDrawArrays http://localhost:6931/lucid.wasm:0
    QOpenGLFunctions::glDrawArrays(unsigned int, int, int)

and these results in the memory console:

476 904 616        99%      11      0%       476 904 616       99%       11      0% ArrayBuffer
1 444 376                0%     9 590      34%       1 444 376       0%     9 590      34%      strings
476 288    0%    8 168    29%     476 288     0%      8 168      29%     Function
471 936         0%       1         0%     471 936       0%     1    0%     #document
363 696       0%     1 342     5%       301 056      0%1 146     4%    js::BaseScript

So I'm now wondering if its reaching an upper limit (512MB on x86 Linux?) and being prevented from accessing more memory? Presumably the WebGL allowance (=>ArrayBuffer?) comes from the overall pot for the WASM process? I've tried playing with QMAKE WASM TOTAL_MEMORY (and QT WASM TOTAL_MEMORY - not sure which is correct?) but doesn't seem to reach linker command in Makefile and I haven't seen any difference in results.

[yalnte]

I've tried again on Win10 qnd noticed this message in the Console Window of Firefox:

WebGL warning: copyTexSubImage: Copying to a LUMINANCE, ALPHA, or LUMINANCE_ALPHA is deprecated, and has severely reduced performance on some platforms.

A quick Google search throws up https://bugreports.qt.io/browse/QTBUG-78211 and my app was originally developed in Qt5 so I wonder if there's something related to the qt5 compatibility modules affecting this?

[yalnte]

I've updated the code to remove the need for the Qt5 compatibility module but no change on Win10 / iOS.

Note: I link with -s FULL_ES2 which seems necessary to get the code to work on Ubuntu (and to the extent that it does on Win10 / iOS) Linking without this just yields more errors. I will post a code extract later in the hope that someone can identify relevant issues relating to this.

[yalnte]

I'm going to post the code that calls the glDrawArrays command in the hope that someone spots something (perhaps a GLES command that doesn't translate easily / well to WebGL?:

void CGUI_myGL::setShaderProgramData(QOpenGLShaderProgram* program, const QMatrix4x4 & myTransMatrix,
                                      const GLfloat & myAlpha, const GLfloat myLight,
                                      GLfloat* myVert, GLfloat* myColour, GLfloat* myNormals,
                                      const GLenum & myGLEnable, const GLenum & myGLDisable,
                                      const GLenum & myMode, const GLsizei & mySize,
                                      const GLfloat & myLineWidth){

   qDebug("   Start setShaderProgramData()");
   qDebug()<<"      Size: "<<(long)mySize;
   if (	mySize==0){qDebug("      Empty mySize value - returning from setShaderProgramData() early"); return;}

   int mvpLocation = -1;
   int alphaLocation = -1;
   int lightLocation = -1;
   int vertexLocation = -1;
   int colourLocation = -1;
   int normLocation = -1;

   // Set modelview-projection matrix
   qDebug("      Getting mvp matrix location");
   mvpLocation = program->uniformLocation("mvp_matrix");
   program->setUniformValue(mvpLocation, myTransMatrix);

   // Set alpha (transparency) value
   qDebug("      Getting alpha array location");
   alphaLocation = program->attributeLocation("alpha");
   program->setAttributeValue(alphaLocation, myAlpha);
   lightLocation = program->attributeLocation("myLight");
   program->setAttributeValue(lightLocation, myLight);

   // Tell OpenGL programmable pipeline how to locate vertex position data
   qDebug("      Getting vertex array location");
   vertexLocation = program->attributeLocation("a_position");
   qDebug("      Set attribute array");

   // Tell OpenGL programmable pipeline how to locate vertex texture coordinate data
   qDebug("      Getting colour array location");
   colourLocation = program->attributeLocation("ourcolor");

   // Tell OpenGL programmable pipeline how to locate vertex texture coordinate data
   qDebug("      Getting normal array location");
   normLocation = program->attributeLocation("normal");

   qDebug("      Enabling attribute arrays");
   program->enableAttributeArray(vertexLocation);
   program->enableAttributeArray(colourLocation);
   program->enableAttributeArray(normLocation);

   qDebug("      Setting attribute arrays");
   program->setAttributeArray(vertexLocation, myVert, 3);
   program->setAttributeArray(colourLocation, myColour, 3);
   program->setAttributeArray(normLocation, myNormals, 3);


   // Enable these options
   //glEnable(myGLEnable);

   // Disable these options
   //glDisable(myGLDisable);

   glDepthFunc(GL_LESS);
   glDepthMask(true);

   if ((myMode==GL_LINES)||(myMode==GL_LINE_LOOP)){
      glLineWidth(myLineWidth);
   }

   qDebug("      Draw arrays");
   glDrawArrays(myMode, 0, mySize);

   qDebug("      Disabling attribute arrays");
   program->disableAttributeArray(vertexLocation);
   program->disableAttributeArray(colourLocation);
   program->disableAttributeArray(normLocation);

   qDebug("   End setShaderProgramData()");

} // End setShaderProgramData()

is called by:

   glViewport(0,0,uiWidth*pixDensity,uiHeight*pixDensity);

   /// STEP 2 - Draw 1D lines
   if (vert1Dlines){
       qDebug() << "--- Drawing 1D lines() ...";

       if (!program->bind())
           close();

      // Clear color and depth buffer
      glClear(GL_DEPTH_BUFFER_BIT);

      setShaderProgramData(program, myMatrix, alpha1D, 0.0f,
                          vert1Dlines, col1Dlines, norm1Dlines,
                          GL_DEPTH_TEST, GL_CULL_FACE,
                          GL_LINES, numvert1Dlines, lineWidth);

      // Enable alpha (transparency) mode
      if (!showBackground){
         // Enable alpha (transparency) mode
         glEnable(GL_BLEND);
         glBlendFunc(GL_SRC_ALPHA, GL_ONE_MINUS_SRC_ALPHA);
      }

      // Enable back face culling
      glDisable(GL_CULL_FACE);

      program->release();

      if (!showBackground){
         glDisable(GL_BLEND);
      }

   } // End draw 1D lines

      // Enable alpha (transparency) mode
      glEnable(GL_BLEND);
      glBlendFunc(GL_SRC_ALPHA, GL_ONE_MINUS_SRC_ALPHA);

[yalnte]

iOS issues disappear when compiled with Qt6.6/Emscripten 3.1.37

Just Win10 to go!

[yalnte]

I get the following error with Qt 6.8.0 (dev) version and Chrome 124.0 which I assume is related to the graphics issue on Windows described above (=> OpenGLWidget window displays but surroundng MDI windows are black. Displays as intended on Linux, iOS and Android Webasssembly tests):

The functionality for sharing OpenGL contexts is limited, see documentation

emscriptenLog @ lucid.js:11117
_emscripten_log @ lucid.js:11137
invoke_viii @ lucid.js:12642
$preformattedMessageHandler(QtMsgType, QMessageLogContext const&, QString const&) @ lucid.wasm:0xbdb552
invoke_vii @ lucid.js:12664
$qDefaultMessageHandler(QtMsgType, QMessageLogContext const&, QString const&) @ lucid.wasm:0xbdcfdd
invoke_viii @ lucid.js:12642
$qt_message_print(QtMsgType, QMessageLogContext const&, QString const&) @ lucid.wasm:0xbd8081
$qt_message_output(QtMsgType, QMessageLogContext const&, QString const&) @ lucid.wasm:0xbdce2b
invoke_viii @ lucid.js:12642
$QDebug::~QDebug() @ lucid.wasm:0xbdf920
$QWasmOpenGLContext::makeCurrent(QPlatformSurface*) @ lucid.wasm:0x218969
$QOpenGLContext::makeCurrent(QSurface*) @ lucid.wasm:0x959e1a
$QOpenGLWidgetPrivate::initialize() @ lucid.wasm:0x2fbec6
$QOpenGLWidget::resizeEvent(QResizeEvent*) @ lucid.wasm:0x2fd3f2
$QWidget::event(QEvent*) @ lucid.wasm:0x37be23
$QOpenGLWidget::event(QEvent*) @ lucid.wasm:0x2fde18
$QApplicationPrivate::notify_helper(QObject*, QEvent*) @ lucid.wasm:0x326d96
$QApplication::notify(QObject*, QEvent*) @ lucid.wasm:0x32a063
$CDebug_App::notify(QObject*, QEvent*) @ lucid.wasm:0x206c6
invoke_iiii @ lucid.js:12675
$QCoreApplication::notifyInternal2(QObject*, QEvent*) @ lucid.wasm:0xc30d45
$QCoreApplication::sendEvent(QObject*, QEvent*) @ lucid.wasm:0xc3410c
$QWidgetPrivate::sendPendingMoveAndResizeEvents(bool, bool) @ lucid.wasm:0x374112
$QWidgetPrivate::show_helper() @ lucid.wasm:0x379720
$QWidgetPrivate::show_recursive() @ lucid.wasm:0x3796e2
$QWidgetPrivate::showChildren(bool) @ lucid.wasm:0x37a06f
$QWidgetPrivate::show_helper() @ lucid.wasm:0x37974c
$QWidgetPrivate::setVisible(bool) @ lucid.wasm:0x3673be
$QWidgetPrivate::showChildren(bool) @ lucid.wasm:0x37a07c
$QWidgetPrivate::show_helper() @ lucid.wasm:0x37974c
$QWidgetPrivate::setVisible(bool) @ lucid.wasm:0x3673be
$QWidget::setVisible(bool) @ lucid.wasm:0x37b481
$QMdiSubWindow::changeEvent(QEvent*) @ lucid.wasm:0x4a7247
$QWidget::event(QEvent*) @ lucid.wasm:0x37c0f9
$QMdiSubWindow::event(QEvent*) @ lucid.wasm:0x4a6cb2
$QApplicationPrivate::notify_helper(QObject*, QEvent*) @ lucid.wasm:0x326d96
$QApplication::notify(QObject*, QEvent*) @ lucid.wasm:0x32a063
$CDebug_App::notify(QObject*, QEvent*) @ lucid.wasm:0x206c6
invoke_iiii @ lucid.js:12675
$QCoreApplication::notifyInternal2(QObject*, QEvent*) @ lucid.wasm:0xc30d45
$QCoreApplication::sendEvent(QObject*, QEvent*) @ lucid.wasm:0xc3410c
$QWidget::setWindowState(QFlagsQt::WindowState) @ lucid.wasm:0x36f2b8
$QWidget::showMaximized() @ lucid.wasm:0x36f9b0
$QMdiSubWindow::eventFilter(QObject*, QEvent*) @ lucid.wasm:0x4a607f
$QCoreApplicationPrivate::sendThroughObjectEventFilters(QObject*, QEvent*) @ lucid.wasm:0xc311a8
$QApplicationPrivate::notify_helper(QObject*, QEvent*) @ lucid.wasm:0x326d82
$QApplication::notify(QObject*, QEvent*) @ lucid.wasm:0x32a063
$CDebug_App::notify(QObject*, QEvent*) @ lucid.wasm:0x206c6
invoke_iiii @ lucid.js:12675
$QCoreApplication::notifyInternal2(QObject*, QEvent*) @ lucid.wasm:0xc30d45
$QCoreApplication::sendEvent(QObject*, QEvent*) @ lucid.wasm:0xc3410c
$QWidget::setWindowState(QFlagsQt::WindowState) @ lucid.wasm:0x36f2b8
$QWidget::showMaximized() @ lucid.wasm:0x36f9b0

[Birk Skyum]

See this as well on macOS with 6.8.0-beta.1 - repro here: https://github.com/maplibre/maplibre-native-qt/issues/49#issue-1943565551

[yalnte]

@Birk-Skyum Thanks - this prompted me to try with the multithreaded Qt 6.8 version and (once I enable SharedArrayBuffer in Chrome) it solves the issue in Windows. Looks like I'll have to compile two versions for the forseeable future...)