QML dynamic scoping not working (ReferenceError)

I am trying to reproduce the example here where the TitlePage.qml component creates two TitleText instances even though the TitleText type is in a separate file (under Section: Component Instance Hierarchy). In the Ubuntu SDK I created a new project (QML App with C++ plugin (qmake)). My Main.qml looks like this:

import QtQuick 2.4
import Ubuntu.Components 1.2
import ScopeTesting 1.0
MainView { objectName: "mainView" applicationName: "scopetesting.username" width: units.gu(100) height: units.gu(75) Item { property string title TitleText { size: 22 anchors.top: parent.top } TitleText { size: 18 anchors.bottom: parent.bottom } }
}

The TitleText.qml looks like the example:

import QtQuick 2.4
import Ubuntu.Components 1.2
import ScopeTesting 1.0
Text { property int size text: "<b>" + title + "</b>" font.pixelSize: size
}

What I get is a ReferenceError:

...TitleText.qml:7: ReferenceError: title is not defined

What am I missing here? Can anyone help?

1 Answer

Object can't use the properties of other objects directly unless they belong to the root object of the file.

Move property string title to MainView or give an id to Item and use title through the id.