Mapview not displaying in Qt 6.2.4 during stackview navigation

[TasawarAhmad]

Hi,

I am able to load a map using "Display a map" tutorial. 

Now as per my requirement, I want to load this map in QT StackView.

However, when I navigate from my mainMenu to mapScreen using stackview, then map is not loading at all.

Here is my code for your review pls.

Main.cpp

int main(){ 
 qDebug() << "Initializing application";

#if defined(Q_OS_LINUX) && !defined(Q_OS_ANDROID)
    // Linux requires 3.2 OpenGL Context
    // in order to instance 3D symbols
    QSurfaceFormat fmt = QSurfaceFormat::defaultFormat();
    fmt.setVersion(3, 2);
    QSurfaceFormat::setDefaultFormat(fmt);
#endif
#if defined(Q_OS_IOS)
    Q_IMPORT_PLUGIN(ArcGISRuntimePlugin);
#endif
    QApplication app(argc, argv);  //QGuiApplication

    

   
    const QString apiKey = QString("MY_PRIVATE_KEY");
    if (apiKey.isEmpty())
    {
        qWarning() << "Use of Esri location services, including basemaps, requires" <<
                      "you to authenticate with an ArcGIS identity or set the API Key property.";
    }
    else
    {
       QCoreApplication::instance()->setProperty("Esri.ArcGISRuntime.apiKey", apiKey);
    }

    
    // Intialize application window
    QQmlApplicationEngine appEngine;

    appEngine.addImportPath(QDir(QCoreApplication::applicationDirPath()).filePath("qml"));

  
#ifdef ARCGIS_RUNTIME_IMPORT_PATH_2
    appEngine.addImportPath(ARCGIS_RUNTIME_IMPORT_PATH_2);
#endif


     mainViewModel=new MainViewModel(&appEngine);


    appEngine.load(QUrl("qrc:/Menu/MainMenu.qml"));
   
    auto topLevelObject = appEngine.rootObjects().value(0);
    auto window = qobject_cast<QQuickWindow*>(topLevelObject);
    if (!window)
    {
        qCritical("Error: Your root item has to be a Window.");

        return -1;
    }


    window->show();

    return app.exec();
}

 MainMenu.qml

import QtQuick
import QtQuick.Controls
import QtQuick.Layouts

ApplicationWindow
{
    id: appWindow
    visible: true
    width:  1920 
    height: 1080
   
    StackView {
        id: stack
        initialItem: view
        anchors.fill: parent
    }

    Item {
        id: view
        

            anchors.fill: parent
            RowLayout
            {
                width: appWindow.width
                height: appWindow.height
                spacing: 2
                id:buttonsGrid
                Button
                {
                    buttonText: "OPEN MAP"
                    imagePath: "qrc:///Resources/Icons/settings.png"
                    Layout.bottomMargin: 60
                    Layout.leftMargin: 20
                    function fun() {
                        stack.push(Qt.resolvedUrl("../qml/map.qml"))
                      }
                }
                
            }
        }
    }

Map.qml

import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
import Esri.ArcGISRuntime

Item {

   id: appWindow
   width:1920
   height: 1080
   visible: true
  
    MapView
    {
        visible: true
        id: myMap
        anchors.fill: parent
        width:800
        height:600
        Map
        {
            initBasemapStyle: Enums.BasemapStyleArcGISStreets
        }
    }
}

Application Console:

Thank you

[JaredCaccamo]

Hey @TasawarAhmad ,

There are a couple problems I am seeing. 

Starting with  MainMenu.qml:
QML Button has no buttonText or imagePath properties that I am aware of, Qt Qml Button doc . Also you have defined the function fun() in button which I assume you want to be executed when the button is pressed but given how it's currently written it does nothing. You would need to either move that logic into the :onClicked signal handler or just move that function call there(e.g. onClicked: fun() ). The last problem being the qml file your are trying to add needs to have the `M` on .../qml/map.qml capitalized to .../qml/Map.qml. This is based on your post indicating the name of that file is Map.qml right below the MainMenu.qml code block above.

The primary problem with your Map.qml is that there will be naming conflicts between your QML object name Map and import Esri.ArcGISRuntime which contains a Map type. My suggestion would be just to rename your QML file something else in this case.

With those changes I was able to make your code work locally. Let me know if you have any other questions.

Happy coding!

Jared

[TasawarAhmad]

Hi Jared, Thank you for your reply.

I have updated my .qml code.

If I draw any rectangle in mymap.qml, then it does appear however arcgis map is not loaded.

MainMenu.qml

import QtQuick
import QtQuick.Controls
import QtQuick.Layouts

ApplicationWindow
{
    id: appWindow
    visible: true
    width:  1920
    height: 1080
    StackView {
        id: stack
        initialItem: view
        anchors.fill: parent
    }

    Item {
        id: view
        Image {
               id: backgroundWallpaper
               anchors.fill: parent
               source: "qrc:///Resources/Wallpapers/wallpaper2.jpg"
        }
        ScrollView
        {
            id: tilesScrollView
            anchors.fill: parent
            RowLayout
            {
                width: appWindow.width
                height: appWindow.height
                spacing: 2
                id:buttonsGrid
                Button
                {
                    Layout.bottomMargin: 60
                    Layout.leftMargin: 20
                    width:500
                    height: 100
                    onClicked:
                        stack.push(Qt.resolvedUrl("../qml/main.qml"))
                }
             }
          }
      }
}

main.qml

import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
import QtMultimedia
import Esri.ArcGISRuntime
//import com.myself 1.0
Item {

 
   width:1920
   height: 1080
   visible: true
  
   Item{
       id: view
    MapView
    {
        visible: true
        id: myMap
        anchors.fill: parent
        width:800
        height:600
        // add a map to the mapview
        Map
        {
            // add the ArcGISStreets basemap to the map
            initBasemapStyle: Enums.BasemapStyleArcGISStreets
        }
    }
}
   Rectangle{
       color:  "black"
       width:260
       height: 260
       border.width: 2
       border.color: "yellow"
       
   }
}

Application Console Output:

QSGThreadedRenderLoop: expose event received for window MainMenu_QMLTYPE_12(0x1706013a730 active exposed, visibility=QWindow::Windowed, flags=QFlags<Qt::WindowType>(Window), title=Ground Control Station - NG 0.0.1, geometry=482,728 1370x749) with invalid geometry: QRect(482,728 1370x749) on QScreen(0x1705ceda4e0, name=\\.\DISPLAY1)

Also interestingly, if I just load "main.qml" then map opens just fine. This issue only occurs when I navigate to "main.qml".
Thank you

[TasawarAhmad]

1 thing to add, the application crashes if I keep pressing any mouse button anywhere in the mapview location after navigation.

[TasawarAhmad]

Interestingly, If I place map in the same file as stack view then I m able to successfully navigate without any issues.

//Somewhere in the code
stack.replace(myarcgisMap)


//Placed map and stackview in the same file
StackView {
      id: stack
      initialItem: view
      anchors.fill: parent
      implicitHeight: 1080
      implicitWidth: 1920

    }
Item {
        id: myarcgisMap
       MapView {
            anchors.fill: parent
            // set focus to enable keyboard navigation
            focus: true

            // add a map to the mapview
            Map {

                // add the ArcGISTopographic basemap to the map
                initBasemapStyle: Enums.BasemapStyleArcGISTopographic

                initialViewpoint: viewpoint

            }

            ViewpointCenter {
                id: viewpoint

        }
       }
    }
}