QML and Qt Quick

Hi, Please use the code (</>) tags. The general advice is to avoid context properties. Embedding C++ Objects into QML with Context Properties spells out a few reasons, including the one noted here. My preferred fix is to declare a property within the item, and then set it using an API such as QQmlComponent::createWithInitialProperties()

@viliak hi and welcome to devnet, I think you should check and maybe create a ticket on the bug tracker since it's a pretty big change of behavior.

Hello @Raphael_PF . Normally you should have a "mock" backend to avoid that errors in order to be able to preview your design. By following this: https://doc.qt.io/qtdesignstudio/robotarm-example.html you will be able to work with both programs. In your qmlproject: importPaths: ["."] mockImports: ["stubs"] You can read here the cmakelist qt design autogeneration: https://github.com/qt-creator/qt-creator/blob/b60337dbaace15ac36d7f44f60d17560111a9ae3/src/plugins/qmlprojectmanager/qmlprojectexporter/cmakegenerator.cpp#L305 [image: 882cf003-42af-4b90-baa9-bfddbf718e0c.png]

Answering my own question... Pass WaylandCompositor's property - defaultSeat into C++ as QWaylandSeat*. https://doc.qt.io/archives/qt-5.15/qml-qtwayland-compositor-waylandcompositor.html#defaultSeat-prop WaylandCompositor { id: iCompositor Component.onCompleted: { CppHelper.setDefaultWaylandSeat( iCompositor.defaultSeat ); } } Use QWaylandSeat's setKeyboardFocus(), which takes QWaylandSurface*. https://doc.qt.io/archives/qt-5.15/qwaylandseat.html#setKeyboardFocus QWaylandSurface* can be found in the onIviSurfaceCreated() as iviSurface. You can pass it into C++. IviApplication { onIviSurfaceCreated: { var surfaceArea = iviSurface.iviId === 1337 ? leftArea : rightArea; var item = chromeComponent.createObject(surfaceArea, { "shellSurface": iviSurface } ); item.handleResized(); // Pass QWaylandSurface* into C++. CppHelper.registerIviSurface( iviSurface ); } } The signal keyboardFocusChanged can be used to observe the change. https://doc.qt.io/archives/qt-5.15/qwaylandseat.html#keyboardFocusChanged However, setKeyboardFocus() doesn't work very well. I do get the signal keyboard focus changed, but the focus jump back to the original window if I actually press a keyboard key.

@GrecKo Ah that was a little painfully obvious haha! Thank you for pointing that out. I've been banging my head against the wall learning about shapepaths for hours now, and thought that there was a more explicit object type for the job. Turns out it was right in front of me all along!

Best solution, independent from changing the targets manually, is to add: add_dependencies(${PROJECT_NAME} update_translations)

Okay , @jsulm Thank you I will check it out.

@MARUTI-0 said in How can you implement offline mapping in a Qt application using QML and CMake without internet access?": SOLVE THE PROBLEM First describe the problem in an understandable way and then ask for help. People here do not have to solve your problems, this is user forum.

I came across this example which uses QRhi (which avoids dependence on OpenGL directly like other people said to use): https://doc.qt.io/qt-6/qtquick-scenegraph-customrendernode-example.html It still seems overly complex but at least it looks like I'm in the right direction. Then, I came across this: https://doc.qt.io/qt-6/qrhirenderbuffer.html#sampleCount where I can set sampleCount to enable anti-aliasing. I don't really understand how QRhiRenderBuffer can be used, but somehow using QRhiRenderBuffer with sampleCount set to 4 or 8 in a QSGRenderNode -derived class seems like the proper way to have cross-platform hardware-accelerated anti-aliased drawing. Feel free to correct me. Until I find code examples showcasing how to bring all these functionalities together I have more important things to work on so I'll use QML Shape / ShapePath for now which makes it super easy to draw simple things (like an anti-aliased triangle).

theoretically, it would also work to just assign a number like 200 for the width. The issue remains that as soon as I try to edit the background, the massive margins appear again.

@ekkescorner yes its a good idea to read the documentation (and I do), but we also have to play the new user role to make sure the flow of discovery of information is correct. I do not see where I would have discovered that information, without encountering an error that I had to seek help for. In the Qt Quick article (that would be the entry point for many people starting QML) there is no mention of this page. It is only in the navigation, and burried under another article called Qt QML. Not only that, but on the Qt Quick page, there is a link to an article describing debugging (which makes no mention of the QML Tooling page) and a link to a "Qt Quick Tools And Utilities" page, which is completely different and makes no mention of QMLLS. [image: 2ad8c5dc-8889-4d22-8ddf-4343c65ad971.png]

@TomNow99 Use an explicit binding, instead of a JS-Evauation Binding { target: xyzInstance; property: "x"; value: myTextField.text; when: someCondition; restoreMode: Binding.RestoreValue}

Thank you so much, Mid does indeed change the color of the handle, but another color seems to control the color of the handle while it is being dragged. I will figure it out. One more question. Is this documented anywhere? Or is the source code available? I searched everywhere I could think of and could not locate it. I found this page: https://doc.qt.io/qt-6/qtquickcontrols-fusion.html which only covers a subset of the palette usage.

Thanks to y'all who replied. @JoeCFD @Asperamanca @GrecKo @Axel-Spoerl @JKSH I had looked at the Drag and Drop examples but they used the DropArea type which didn't fit my need because it wouldn't allow me to place the tiles freely in a shared plane, or at least that's my understanding. With the help of AI tools (which I've found extremely useful in fast prototyping a project, especially in a framework that I'm not familiar with like in this case QML), I've created exactly what I needed with basic Qt Quick Items. Here's the basic structure: Window { // button to add a new tile Button { onClicked: { tileComponent.createObject(dashboardArea, { "x": /* x position in dashboard area */, "y": /* y position in dashboard area */, "tile specific properties": data }); } } // dashboard area Item { id: dashboardArea // this component holds dynamically created tiles Component { id: tileComponent Tile {} } } } // Tile.qml Rectangle { // tile specific properties ... // Make the tile draggable MouseArea {} }

@imxande said in QQmlApplicationEngine failed to load component: want to understand what is really happening. One way to start doing this is to inspect your embedded resources: QDirIterator qrc(":", QDirIterator::Subdirectories); while(qrc.hasNext()) qDebug() << qrc.next(); Note that if I add engine.addImportPath("qt/qml") to my main.cpp file the engine finds the module What does engine.importPathList() produce after you do that?

some tips for this. ApplicationWindow { visible: true width: 640 height: 480 title: qsTr("HeaderView") TableModel { id: qmlTabModel TableModelColumn { display: "name" } TableModelColumn { display: "color" } TableModelColumn { display: "age" } rows: [ { "name": "cat", "color": "black", "age": "1.1" }, { "name": "dog", "color": "brown", "age": "1.2" }, { "name": "bird", "color": "white", "age": "1.3" } ] } Rectangle { id: bgtab anchors.fill: parent color: Qt.styleHints.appearance === Qt.Light ? palette.mid : palette.midlight onWidthChanged: { tableView.forceLayout() } HorizontalHeaderView { id: horizontalHeader anchors.left: tableView.left anchors.right: parent.right; anchors.top: parent.top syncView: tableView clip: true model: qmlTabModel delegate: Label { text: qmlTabModel.columns[column].display } } VerticalHeaderView { id: verticalHeader anchors.top: tableView.top anchors.left: parent.left syncView: tableView clip: true } TableView { id: tableView anchors.left: verticalHeader.right anchors.top: horizontalHeader.bottom anchors.bottom: parent.bottom contentWidth: parent.width; columnSpacing: 1 rowSpacing: 1 boundsBehavior: Flickable.StopAtBounds property var columnWidths: [100, 50, bgtab.width] columnWidthProvider: function(column) { let w = explicitColumnWidth(column) if (w >= 0 && column !== (columns - 1)) { columnWidths[column] = w; return w; } if (column === (columns - 1)) { w = columnWidths[column]; let i = columns - 1; while(--i !== -1) w -= columnWidths[i]; return w; } return columnWidths[column]; } model: qmlTabModel delegate: Rectangle { implicitHeight: 20 color: palette.base Label { text: display } } } } }

Nice, note that TapHandler has a doubleTapped signal.