2

I have a base component named MyChart.qml like this

Item {
    id: root
    
    ChartView {
        id: myChartView
    }
    
    RowLayout {
        id: myToolbar
        }
    }
}

So it's basically a chart with a toolbar underneath it. I inherit this component in another component like this:

MyChart {
    *List of Children*
}

Here, how can I add the List of Children to myToolbar instead of root of the MyChart component?

Punitto Moe
  • 99
  • 7
  • Aswering my own question, You need to define each father as a property alias, and then you can add children to the data list by appending new QML components with "push" method (https://www.w3schools.com/jsref/jsref_push.asp) OR you can give it totally new values using "alias.data: [Object 1 {}, Object 2{}]" syntax, where alias is the property alias of the target qml object that you defined – Punitto Moe Apr 07 '22 at 12:15

1 Answers1

3

Every item has the property data which is used as default property when you add an object inside another. Default property mean if you don't specify any property is assumed to be that one.

eg: States has default property states: [], so you can do

States {
   State{},
   State{}
}

beacause they all refer to that default property. So, about your example it's enough to expose the default property of the component you want to be the direct father of your component

MyChart.qml

Item {
   id: root
   
   default property alias data: myToolbar.data
   
   ChartView {
      id: myChartView
   }
   
   RowLayout {
      id: myToolbar
   }
}

Now any child coponent you use will be added directly inside the rowlayout

MyChart {
    Rectangle { width: 100; height: 100; color:"red"}
    Rectangle { width: 100; height: 100; color:"skyblue"}
}
Moia
  • 2,216
  • 1
  • 12
  • 34
  • Thank you, this solves the problem for one Father. Is there a method to add children to more than 1 Father? – Punitto Moe Feb 02 '22 at 08:07
  • @PunittoMoe you should place your component inside a Component and then multiple loader which load the same component. Obviously each loader will have a copy of the component, not the same. – Moia Nov 09 '22 at 13:33