[Miran Višner]

I am trying to dynamically create object in grid and no mater what i try it crash the app. I even try the simplest example:

 

Qt.createQmlObject('
  import QtQuick
      Rectangle
      {
        width:10
        height:10
        color: "green"
      }',
    myCaleData,
    "myDynamicSnippet"
  );

where “myCaleData” is id of grid

[GüntherFelgo Team]

Hi,

the following snippet works fine for me and does not crash:

import QtQuick
import Felgo

App {
  NavigationStack {
    AppPage {
      title: "Test"

      Grid {
        id: myGrid
        columns: 3
        spacing: 2
        Rectangle { color: "red"; width: 50; height: 50 }
        Rectangle { color: "green"; width: 20; height: 50 }
        Rectangle { color: "blue"; width: 50; height: 20 }
        Rectangle { color: "cyan"; width: 50; height: 50 }
        Rectangle { color: "magenta"; width: 10; height: 10 }
      }

      AppButton {
        anchors.top: myGrid.bottom
        text: "Add"

        property string itemScript: 'import QtQuick
                Rectangle {
                  width:10
                  height:10
                  color: "green"
                }'
        onClicked: {
          Qt.createQmlObject(itemScript, myGrid, "dynamicItem");
        }
      }
    }
  }
}

Best,
Günther

[Miran Višner]

I tried your solution and figured out that creating objects really didn’t crash the app. but destroying the items out of grid did make app crash. i simply did this:

myGridId.children[myGridId.children.length-1].destroy()

 

this somehow frezes and crashes the app

and now then i try to do this:

 

console.log(myGridId.children.length)

myGridId.children[myGridId.children.length-1].destroy()

console.log(myGridId.children.length)

 

 

I get same number in 1st and 2nd console.log calls. how to properly dynamical delete objects from grid element?

 

[Miran Višner]

I had infinite loop in code because length didnt change.

[GüntherFelgo Team]

Hi,

deleting Grid items this way still does not produce a crash for me.
Which platform are you testing on? I tried the code on macOS desktop and iOS without crashes.

Anyway, as an alternative solution you could try to let a QML Repeater handle the object creation and removal?

I think this would be a cleaner approach than manually creating and removing items:

import QtQuick
import Felgo

App {
  NavigationStack {
    AppPage {
      title: "Test"

      Grid {
        id: myGrid
        columns: 3
        spacing: 2

        property var gridItems: ["red","green","blue","cyan","magenta"]

        Repeater {
          id: itemRepeater
          model: myGrid.gridItems
          Rectangle { color: modelData; width: 50; height: 50 }
        }
      }

      Column {
        anchors.top: myGrid.bottom

        AppButton {
          text: "Add"
          onClicked: {
            myGrid.gridItems.push("green")
            myGrid.gridItemsChanged()
          }
        }

        AppButton {
          text: "Remove"
          onClicked: {
            console.log(itemRepeater.count)
            let removed = myGrid.gridItems.pop()
            myGrid.gridItemsChanged()
            console.log(itemRepeater.count, "removed:", removed)
          }
        }
      }
    }
  }
}