Two dynamically created object interaction issue

[kornicameister]

In my arkanoid like game I have bar and the ball which interacts with that bar, or rather which should interacts with the bar, because I have no idea how to deliver this.

I create both ball and bar in the my js script and place them in specific location on the grid (which is an item defined in main.qml). But know I am facing the problem
1. how to implement moving the ball with the bar at the same time if ball lies on the bar ? Currently bar is moved with drag.** properties set in Bar.qml, and it works great, because I can click and press the bar and it moves , but how to inform the ball object to move also but only if it knows it lies on the bar

import QtQuick 1.0
import "logic/barMechanics.js" as BAR_MECHANIC
 
Rectangle {
    id: bar
    smooth: true
    radius: 30
    opacity: 0.9
    gradient: Gradient {
        GradientStop { position: 0.0 ; color: "red"}
        GradientStop { position: 0.5 ; color: "yellow" }
        GradientStop { position: 1.0 ; color: "black"}
    }
 
    signal clicked;
    property bool sticky: false //this property if true means that ball does not bounce from bar but gets atteched to it
 
    MouseArea {                             //!!!! <--- CUSTOMIZE IT ---> !!!!//
        id: mouseArea
        anchors.fill: bar
        drag.target: bar
        drag.axis: Drag.XAxis
        drag.minimumX: 0
        drag.maximumX: bar.parent.width - bar.width + 10
 
        onPressed: BAR_MECHANIC.barMoving(); //sets anchor to undefined
    }
}

import QtQuick 1.0
import "logic/barMechanics.js" as BAR_MECHANIC

Rectangle {
    id: bar
    smooth: true
    radius: 30
    opacity: 0.9
    gradient: Gradient {
        GradientStop { position: 0.0 ; color: "red"}
        GradientStop { position: 0.5 ; color: "yellow" }
        GradientStop { position: 1.0 ; color: "black"}
    }

    signal clicked;
    property bool sticky: false //this property if true means that ball does not bounce from bar but gets atteched to it

    MouseArea {                             //!!!! <--- CUSTOMIZE IT ---> !!!!//
        id: mouseArea
        anchors.fill: bar
        drag.target: bar
        drag.axis: Drag.XAxis
        drag.minimumX: 0
        drag.maximumX: bar.parent.width - bar.width + 10

        onPressed: BAR_MECHANIC.barMoving(); //sets anchor to undefined
    }
}

To copy to clipboard, switch view to plain text mode 

import QtQuick 1.0
 
///there will be three possible bal (red,green,blue)
 
Item {
    id: bal
    property int type: 0
    property bool nitro: false          //ball goes fast
    property bool destroyer: false      //ball do not bounce from obstacles it goes throught them crushig em
    property bool onBar: false
 
    //setting the bal colour
    Image {
        id: bal_colour
        anchors.fill: bal
        smooth: true
        source: {
            if(type == 0){
                return "resources/redBall.png";
            }else if (type == 1){
                return "resources/yellowBall.png";
            }else{
                return "resources/greenBall.png"
            }
        }
    }
    MouseArea {
        id: ballMouseArea
        anchors.fill: parent
    }
}

import QtQuick 1.0

///there will be three possible bal (red,green,blue)

Item {
    id: bal
    property int type: 0
    property bool nitro: false          //ball goes fast
    property bool destroyer: false      //ball do not bounce from obstacles it goes throught them crushig em
    property bool onBar: false

    //setting the bal colour
    Image {
        id: bal_colour
        anchors.fill: bal
        smooth: true
        source: {
            if(type == 0){
                return "resources/redBall.png";
            }else if (type == 1){
                return "resources/yellowBall.png";
            }else{
                return "resources/greenBall.png"
            }
        }
    }
    MouseArea {
        id: ballMouseArea
        anchors.fill: parent
    }
}

To copy to clipboard, switch view to plain text mode 

any suggestion ? if any other code part is required let me know...

[SamFredericks]

how to implement moving the ball with the bar at the same time if ball lies on the bar ?

...perhaps if you reparent it, and still moving only the Bar....

Rectangle{
 id: main
 width:  640
 height: 400
 Bar {
  id: bar
 }
 Bal{
  id:bal
  onOnBarChanged:{
   if (onBar == true)
   {
     var position = mapToItem(bar, 0,0)
     bal.parent = bar
     bal.x = position.x
     bal.y = position.y
   }
   else {
    var position = mapToItem(main, 0,0)
    bal.parent = main
    bal.x = main.x
    bal.y = main.y
  } 
 }
}

Rectangle{
 id: main
 width:  640
 height: 400
 Bar {
  id: bar
 }
 Bal{
  id:bal
  onOnBarChanged:{
   if (onBar == true)
   {
     var position = mapToItem(bar, 0,0)
     bal.parent = bar
     bal.x = position.x
     bal.y = position.y
   }
   else {
    var position = mapToItem(main, 0,0)
    bal.parent = main
    bal.x = main.x
    bal.y = main.y
  } 
 }
}

To copy to clipboard, switch view to plain text mode 

[kornicameister]

I solved that by using anchoring which I previously had thought would had been impossible.
The key to solve it was to set specific anchor to undefined.