Forums

OverviewFelgo 2 Support (Qt 5) › Collision and property go wrong

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #20280

    Felgo User

    I am new to both Qt and V-play and this is my test about collision and animation (with property). Here is the code I used:

    import Felgo 3.0
    import QtQuick 2.0
    
    GameWindow {
      screenWidth: 960
      screenHeight: 640
    
      EntityManager {
        id: entityManager
        entityContainer: scene
      }
    
      PhysicsWorld{
    
            debugDrawVisible: true
        }
    
      Scene {
        id: scene
        // the "logical size" - the scene content is auto-scaled to match the GameWindow size
        width: 480
        height: 320
    
        PhysicsWorld {debugDrawVisible: true} // put it anywhere in the Scene, so the collision detection between monsters and projectiles can be done
    
        BackgroundImage {
            id:levelBackground
            source: "../assets/sky.jpg"
            height:240
            width:480
            MouseArea {
                anchors.fill: levelBackground
                onClicked: {
                    console.debug(mouseX, mouseY)
                    entityManager.createEntityFromComponentWithProperties(projectile, {"startY": mouseY});
                }
            }
        }
    
        BackgroundImage{
            id:hudBackground
            source: "../assets/hud.jpg"
            y:240
            height:80
            width:480
        }
    
    
        Component {
          id: airBalloon
    
          EntityBase {
    
            entityType: "balloon"
    
            Image {
              id: balloonImage
              source: "../assets/balloon.jpg"
              scale:0.1
            }
    
    
            x:100
            y:100
    
            BoxCollider {
                anchors.bottom: balloonImage.bottom // make the collider as big as the image
                collisionTestingOnlyMode: true // use Box2D only for collision detection, move the entity with the NumberAnimation above
    
                width:30
                height:30
              }
            }// BoxCollider
          }// EntityBase
        }// Component
    
        Component {
    
            id: projectile
    
            EntityBase {
    
            entityType: "projectile"
    
                width: 29
                height: 11
    
                x:970
                y: 100
                Image {
                  id: arrowImage
                  source: "../assets/arrow.png"
    
                  width: parent.width
                  height: parent.height
                  x: -width / 2
                  y: -height / 2
                }
    
                property double startX: scene.gameWindowAnchorItem.width
                property double startY
                property double goalX: -70
                property double goalY: startY
                property double speed: 3000
    
                BoxCollider {
                    anchors.centerIn: parent
                    width: 30
                    height: 15
                    collisionTestingOnlyMode: true // use Box2D only for collision detection, move the entity with the NumberAnimation above
                    fixture.onBeginContact: {
                        // if the collided type was a projectile, both can be destroyed and the player gets a point
                        var collidedEntity = other.getBody().target
                        console.debug("collided with entity", collidedEntity.entityType)
                        // monsters could also collide with other monsters because they have a random speed - alternatively, collider categories could be used
                        if(collidedEntity.entityType === "tower") {
                            // remove the projectile entity
                            collidedEntity.removeEntity()
                            // remove the tower
                            removeEntity()
                        }
                    }
                }// BoxCollider
    
                ParallelAnimation {
                    running: true // all animations are started
                    NumberAnimation {
                        target: projectile
                        property: "x"
                        from: startX
                        to: goalX
                        duration: speed
                        easing.type: Easing.InCubic
                    }
                    NumberAnimation {
                        target: projectile
                        property: "y"
                        from: startY
                        to: goalY
                        duration: speed
                        easing.type: Easing.InCubic
                    }
                    NumberAnimation {
                        target: projectile
                        property: "scale"
                        to: 1.0
                        duration: speed
                        easing.type: Easing.InCubic
                    }
                }
            }
        }
    }
    

    The app return errors

    NumberAnimation: Cannot animate non-existent property “x”

    NumberAnimation: Cannot animate non-existent property “y”

    NumberAnimation: Cannot animate non-existent property “scale”

     

    Moreover when it show the game screen, the AirBalloon was not showed and the CollisionBox is not right at the visual representation of balloon and arrow. What have I done wrongly?

    #20288

    Marcin

    Hi ,
    From what I see you try to run animation on Component(template), not the entity inside.
    Component doesn’t have coordinates, like y,x.
    It wraps the entity and, until you instantiate(create) entity, you shouldn’t animate it’s properties.

    No airBalloon
    I can’t find a call to create AirBalloon entity from component. You create the projectile but not the AirBalloon.
    Animation issue

    Animation needs to be run(target property) on an instance, not on template(component).

    One of the options how to do it:
    – keep the animation setup inside the EntityBase you want to animate and  target property can be set to parent(I think), it will animate the entity it is in
    – if this won’t work you can also check qt behavior on

    Another option if you want to start animation later:
    – you can start that animation manually as well by creating some function inside EntityBase which can be later called after entity is created
    – to get created entity look at EntityManager and methods like getl ast entity or get entity by id

     

    Your Best friend

    Hope this helps.

    #20290

    Felgo User

    Thank Marcin for fast answering. Now I can fix it with just add id to the EntityBase

    EntityBase {
                id:arrow
    
            entityType: "projectile"
    
            ....
    }
    
                      
    ParallelAnimation {
        running: true // all animations are started
        NumberAnimation {
          target: arrow
          property: "x"
          from: startX
          to: goalX
          duration: speed
          easing.type: Easing.InCubic
        }
        NumberAnimation {
          target: arrow
          property: "y"
          from: startY
          to: goalY
          duration: speed
          easing.type: Easing.InCubic
          }
        NumberAnimation {
          target: arrow
          property: "scale"
          to: 1.0
          duration: speed
          easing.type: Easing.InCubic
          }
    }

    So now the problem with animation is solved. And it’s right that I forgot to create the AirBalloon. But the rest problem is still there. When I run the code successfully, the collision box appeared in somewhere not as expected. I thought if I put anchor like below

    BoxCollider {
                anchors.bottom: balloonImage.bottom
    }

    and below

    BoxCollider {
                    anchors.centerIn: parent
    }

    the collision box will appear at the bottom of the air balloon and cover the whole arrow. But it turn out like the image below:

    collision box

    Is it the right behavior of BoxCollider?

    #20291

    Felgo User

    One more thing I recently want to ask about Number Animation.

    The current equations for velocity of the arrow are

    Sx = Vx*t

    Sy = Vy* t

    But what if I want to applied an acceleration(gravity) to Vy like

    Sy = Vy*t -(A*t^2) / 2

    Thanks for reading.

    #20295

    Felgo User

    Hello, anybody please help. I want to make the arrow above fly front (startX, startY) to (goalX, goalY) but I need more realistic orbit so I need a curve orbit. But I cannot look for a solution to make it curved. The Easing type set to any type of Curve, bezierCurve, outCirce, outCurve give me nothing good as I want. Thanks for reading.

Viewing 5 posts - 1 through 5 (of 5 total)

RSS feed for this thread

You must be logged in to reply to this topic.

Voted #1 for:

  • Easiest to learn
  • Most time saving
  • Best support

Develop Cross-Platform Apps and Games 50% Faster!

  • Voted the best supported, most time-saving and easiest to learn cross-platform development tool
  • Based on the Qt framework, with native performance and appearance on all platforms including iOS and Android
  • Offers a variety of plugins to monetize, analyze and engage users
FREE!
create apps
create games
cross platform
native performance
3rd party services
game network
multiplayer
level editor
easiest to learn
biggest time saving
best support