Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • Users
  • Groups
  • Search
  • Get Qt Extensions
  • Unsolved
Collapse
Brand Logo
  1. Home
  2. Qt Development
  3. QML and Qt Quick
  4. Adding to a custom component
Forum Updated to NodeBB v4.3 + New Features

Adding to a custom component

Scheduled Pinned Locked Moved Solved QML and Qt Quick
qml
4 Posts 2 Posters 550 Views
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • G Offline
    G Offline
    GrahamLa
    wrote on last edited by
    #1

    Hi
    I have a custom component defined as

    Item {
        GroupBox {
            id: groupBox
            x: 93
            y: 132
            width: 200
            height: 200
            title: qsTr("Group Box")
    
            RoundButton {
                id: roundButton
                x: 15
                y: 49
                width: 119
                height: 40
                text: "FFFF"
              }
    
            RoundButton {
                id: roundButton1
                x: 37
                y: 104
                width: 109
                height: 40
                text: "+"
            }
    
        }
    }
    

    I can use it like this

    MyComponent {
            id: myComponent
            x: -45
            y: 123
        }
    }
    

    Now what I want to do is to add more elements to the used component (not to the base) -

    ```
    

    MyComponent {
    id: myComponent
    x: -45
    y: 123

       Button {
            text: "new Text"
        }
    }
    

    this places the new button outside of the component.
    Is this possible?

    1 Reply Last reply
    0
    • ODБOïO Offline
      ODБOïO Offline
      ODБOï
      wrote on last edited by
      #2

      hi @GrahamLa
      Try to delete your Componets top level item Item

      //Item {
      GroupBox {
      ...
      //}

      1 Reply Last reply
      0
      • ODБOïO Offline
        ODБOïO Offline
        ODБOï
        wrote on last edited by
        #3

        You also can define MyComponent like this :

        import QtQuick 2.0
        import QtQuick.Controls 2.0
        import QtQuick.Layouts 1.3
        
        Item {
            default property alias contentData : content.data
            GroupBox {
                title: qsTr("Group Box")
                anchors.fill: parent
                RowLayout{
                    id: content
                    anchors.fill: parent
        
                    Button{
                        text: "def btn 1"
                    }
                    Button{
                        text: "def btn 2"
                    }
                }
            }
        }
        
        

        and use it :

            MyComponent {
                anchors.centerIn: parent
                height: 100
                width: contentItem.width
                Button{
                    text: "btn 3"
                }
        
            }
        
        G 1 Reply Last reply
        0
        • ODБOïO ODБOï

          You also can define MyComponent like this :

          import QtQuick 2.0
          import QtQuick.Controls 2.0
          import QtQuick.Layouts 1.3
          
          Item {
              default property alias contentData : content.data
              GroupBox {
                  title: qsTr("Group Box")
                  anchors.fill: parent
                  RowLayout{
                      id: content
                      anchors.fill: parent
          
                      Button{
                          text: "def btn 1"
                      }
                      Button{
                          text: "def btn 2"
                      }
                  }
              }
          }
          
          

          and use it :

              MyComponent {
                  anchors.centerIn: parent
                  height: 100
                  width: contentItem.width
                  Button{
                      text: "btn 3"
                  }
          
              }
          
          G Offline
          G Offline
          GrahamLa
          wrote on last edited by
          #4

          Thanks all

          1 Reply Last reply
          0

          • Login

          • Login or register to search.
          • First post
            Last post
          0
          • Categories
          • Recent
          • Tags
          • Popular
          • Users
          • Groups
          • Search
          • Get Qt Extensions
          • Unsolved