How to do a "is_a", "typeof" or instanceof in QML?

javascript qml
Scott Montgomerie picture Scott Montgomerie · Dec 18, 2012 · Viewed 16k times · Source

I want to run through a list of QML components and choose one type:

for (var i = 0; i < controls.children.length; ++i) {
     if ( typeof (controls.children[i].height) == "QDeclarativeRectangle")
     {
        // do stuff
     }
}

How does one accomplish this?

Answer

user5315753 picture user5315753 · Jan 26, 2018

Since Qt 5.10, you can finally use instanceOf to check whether a variable is of a certain QML type, see "QML Support for Enum and InstanceOf Type Checks".

import VPlayApps 1.0
import QtQuick 2.0

App {
  // two QML items, used for type checking
  Item { id: testItem }
  Rectangle { id: testRect }

  // function to check wheter an item is a Rectangle
  function isRectangle(item) {
    return item instanceof Rectangle
  }

  // type check example
  Component.onCompleted: {
    console.log("testItem is Rectangle? " + isRectangle(testItem))
    console.log("testRect is Rectangle? " + isRectangle(testRect))
  }
}

Related questions

How to create delay function in QML?

I would like to create a delay function in javascript that takes a parameter of amount of time to delay, so that I could use it do introduce delay between execution of javascript lines in my QML application. It would …

Read More
Can we declare global variable in QML file?

I want to do something similer to following code: //test.qml import QtQuick 1.0 Item { var globalforJs =10; function increment() // JavaScript function { globalforJs++; } .... QML Code Can we have global variable in QML file and access it from the JavaScript function?

Read More
Run javascript function when a page loaded in QML

I want to run js function like this function setPersonalInfoValue(){ console.debug("setPersonalInfoValue()"); } when the page loaded in QML. I tried this: Rectangle { id: page2 width: 100 height: 62 function setPersonalInfoValue(){ console.debug("setPersonalInfoValue()"); } } I want to run setPersonalInfoValue() function when I …

Read More