सभी बच्चों को रखने के लिए तत्व खींचना

Question

QML में स्वचालित रूप से तत्व को फैलाने के लिए यह कैसे संभव है ताकि उसके सभी बच्चे इसमें फिट हो सकें? और अंतर को निर्दिष्ट करने के लिए कैसे? उदाहरण के लिए, मैं एक पाठ के चारों ओर एक आयत रखना चाहता हूँ। आयताकार में कुछ आंतरिक अंतर होना चाहिए।

यदि मैं निम्नलिखित लिखता हूं तो आयताकार का आकार 0,0 है।

Rectangle { 
    color: "gray" 
    anchors.centerIn: parent; 

    Text { 
     text: "Hello" 
    } 
} 

अगर मैं, Column तत्व का उपयोग करके इसे ठीक करने के रूप में How to make QML items to grow to fit contents? में सुझाव दिया की कोशिश, तो मैं पूरे खिड़की/माता-पिता के माध्यम से एक स्तंभ मिलता है,

Column { 
    anchors.centerIn: parent 

    Rectangle { 
     color: "gray" 
     anchors.fill: parent 
    } 

    Text { 
     anchors.centerIn: parent 
     text: "Hello" 
    } 
} 

संपादित करें:

मैंने Column के बजाय Flow तत्व का उपयोग करने का भी प्रयास किया है, लेकिन फिर मुझे wh के माध्यम से एक पंक्ति मिली ओले खिड़की/अभिभावक।

Answer 1

आप इस के लिए childrenRect संपत्ति का उपयोग कर सकते हैं:

import QtQuick 1.1 

Rectangle { 
    width: 320 
    height: 200 

    Rectangle { 
     color: "BurlyWood" 
     anchors.centerIn: parent 
     width: childrenRect.width + 20 
     height: childrenRect.height + 20 

     Text { 
      id: hello 
      x: 10 
      y: 10 
      text: "Hello" 
     } 

     Text { 
      anchors.left: hello.right 
      anchors.leftMargin: 10 
      anchors.top: hello.top 
      text: "World" 
     } 
    } 
} 

हालांकि, ध्यान दें कि संयोजन में childrenRect उपयोग करने के साथ सीधे बच्चों में से एक में anchors.centerIn: parent का उपयोग बाध्यकारी पाश के बारे में चेतावनी उत्पन्न करता है।

Answer 2

स्थापना width और height मैन्युअल रूप से काम करता है, लेकिन एक छोटे से बदसूरत है:

Rectangle { 
    color: "gray" 
    width: label.width+20 
    height: label.height+20 
    anchors.centerIn: parent 

    Text { 
     id: label 
     anchors.centerIn: parent 
     text: "Hello" 
    } 
}