title: Working with .ui.qml files
body: <p>In Qt 5.4, the template when creating a new "QtQuick UI File" generates two files: <code>MyScreen.qml</code> and <code>MyScreen.ui.qml</code>.</p>
  
  <p>The <code>MyScreen.ui.qml</code> file seems to be for UI only, since Qt Creator suggests you should only edit it in design mode. That implies that I should be creating UI objects (labels, buttons, etc...) there and somehow referring to them in the <code>MyScreen.qml</code> file where the logic would go. In principle this sounds great but, unfortunately Qt doesn't come with any examples of how to work with these 2 files.</p>
  
  <p>Here are the contents of those files:</p>
  
  <p><code>MyScreen.qml</code>:</p>
  
  <pre><code>import QtQuick 2.4
  
  MyScreen {
  }
  </code></pre>
  
  <p><code>MyScreen.ui.qml</code> (I added the Text label in design mode):</p>
  
  <pre><code>import QtQuick 2.4
  
  Item {
      width: 400
      height: 400
  
      Text {
          id: text1
          x: 144
          y: 151
          width: 103
          height: 31
          text: qsTr("Text")
          font.pixelSize: 12
      }
  }
  </code></pre>
  
  <p>I tried instantiating a <code>MyScreen</code> for use in a <code>StackView</code> (see below), but (unsurprisingly) I don't see the label.</p>
  
  <p><code>main.qml</code> :</p>
  
  <pre><code>import QtQuick 2.4
  import QtQuick.Controls 1.3
  import QtQuick.Window 2.2
  
  Window {
      visible: true
      StackView {
          id: stack
          anchors.fill: parent
          initialItem: myscreen
      }
  
      MyScreen {
          id: myscreen
          anchors.fill: parent
      }
  }
  </code></pre>
  
  <p>Any pointers for a QML newbie?</p>