Forums

OverviewFelgo 2 Support (Qt 5) › BuildEntityButton – variationType issue

Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • #15238

    Darren

    I am trying to create a level editor for my game. The BuildEntityButtons all should create the same object – a Background object.  I want to be able to change the properties of the Background object depending on which BuildEntityButton was selected.  I have tried to do this using variationType and also using creationProperties.  The problem is that the Background object always creates using just the default setting I set for it.  Specifying variationType or creationProperties in my BuildEntityButton does not appear to have any effect.

     

    I have copied the code that I think is relevant below:

    SceneBase {
      id:gameScene
      width: 320
      height: 480
      scaleMode: "letterbox"
    
     // the filename of the current level gets stored here, it is used for loading the
     property string activeLevelFileName
     // the currently loaded level gets stored here
     property variant activeLevel
    
      // set the name of the current level, this will cause the Loader to load the corresponding level
     function setLevel(fileName) {
       activeLevelFileName = fileName
     }
    
     Rectangle{
         id: sceneBackground
         anchors.fill: parent
         color: "white"
     }
    
     EntityManager {
         id: entityManager
         entityContainer: container
         // required for LevelEditor, so the entities can be created by entityType
         dynamicCreationEntityList: [ Qt.resolvedUrl("../entities/Background.qml")] //IT DOESN'T APPEAR TO MAKE A DIFFERENCE WHETHER I INCLUDE THIS LINE OR NOT
     }
    
     LevelEditingUI{
         id: levelUI
     }
    }

     

    Item{//THIS IS THE LevelEditingUI OBJECT
        id:levelUI
        visible: false
        anchors.left: gameWindowAnchorItem.left
        anchors.bottom: gameWindowAnchorItem.bottom
        height: 100
        width: 720 / 2
        z: 4000
        property variant entities: ["sand.png","grass.png"]
        
     
        // makes a grid of entities to be dragged into the level
        Grid {
          id: buildEntityButtons
          visible: true // only gets visible when in state levelEditing
          anchors.horizontalCenter: parent.horizontalCenter
          anchors.bottom: parent.bottom
          anchors.bottomMargin: 10
          height: 75
          z:1000
          spacing: 5
          rows: 2
    
          BuildEntityButton {
            toCreateEntityType: "../entities/Background.qml"
            width: 35
            height: 35
    
            TexturePackerAnimatedSpriteVPlay {
                id: image1
                source: "../../assets/img/background_fire_vehicles.json"
                frameNames: [entities[0]]
                anchors.fill: parent
            }
          }
    
          BuildEntityButton {////THIS IS THE BUTTON I AM USING TO TEST //////////////////////
            variationType: "grass.png" ///THE DEFAULT VARIATIONTYPE IS SAND. EVEN WITH THIS LINE, SAND ALWAYS GETS CREATED/////
            toCreateEntityType:  "../entities/Background.qml"
            width: 35
            height: 35
            TexturePackerAnimatedSpriteVPlay {
                id: image2
                source: "../../assets/img/background_fire_vehicles.json"
                frameNames: [entities[1]]
                anchors.fill: parent
            }
          }

     

    EntityBaseDraggable { //THIS IS MY BACKGROUND ENTITY THAT SHOULD BE CREATED
        entityId: "background"
        entityType: "backgroundEntity"
        variationType: "sand.png" //DEFAULT VARIATIONTYPE
        poolingEnabled: true
        z: -1000
        width: 128
        height: 128
     
        selectionMouseArea.anchors.fill: mouseRectangle
    
        Rectangle{
            id: mouseRectangle
            anchors.fill: parent
        }
        TexturePackerAnimatedSpriteVPlay {
            id: image
            z:3001
            source: "../../assets/img/background_fire_vehicles.json"
            frameNames: [variationType]
            anchors.fill: parent
        }
    
        BoxCollider {
            id: boxCollider
            bodyType: Body.Static
            categories: Box.Category3
            collidesWith: Box.Category2 | Box.Category1
        }
    }

     

     

    #15239

    Günther
    Felgo Team

    Hi Darren!

    The dynamicCreationEntityList allows to create entities based on their entityType and variationType settings (combined with pooling, as a pooled entity of the same type and variation will be reused if possible and not created anew). To use pooling, also set poolingEnabled for the EntityManager.

    With activated pooling and a correct creation list, the buttons should be able to create and initialize the entities with their variation type:

    // the scene with EntityManager
    Scene {
        id: scene
        // ...
    
        EntityManager {
          id: entityManager
          entityContainer: container
    
          // required for LevelEditor, so the entities can be created by entityType and variationType
          poolingEnabled: true
          dynamicCreationEntityList: [ Qt.resolvedUrl("Background.qml") ] // use correct path to entity here
        }
    
        LevelEditingUI{
          id: levelUI
          visible: true
        }
      }

    These are the UI / Buttons I used for testing:

    Item{ //THIS IS THE LevelEditingUI OBJECT
      id:levelUI
      visible: false
      anchors.left: parent.gameWindowAnchorItem.left
      anchors.bottom: parent.gameWindowAnchorItem.bottom
      width: 100
      height: 720 / 2
      z: 4000
    
      // i used colored Rectangles for testing instead of sprites
      property variant entities: ["red","green"] 
    
      // makes a grid of entities to be dragged into the level
      Grid {
        id: buildEntityButtons
        visible: true // only gets visible when in state levelEditing
        anchors.horizontalCenter: parent.horizontalCenter
        anchors.bottom: parent.bottom
        anchors.bottomMargin: 10
        height: 75
        z:1000
        spacing: 5
        rows: 2
    
        BuildEntityButton {
          toCreateEntityTypeUrl: Qt.resolvedUrl("Background.qml")
          width: 35
          height: 35
    
          Rectangle {
            color: "red"
            anchors.fill: parent
          }
        }
    
        BuildEntityButton {
          variationType: "green"
          toCreateEntityTypeString: "backgroundEntity" // you can also use the entityType here together with variationType
    
          width: 35
          height: 35
          Rectangle {
            color: "green"
            anchors.fill: parent
          }
        }
      }
    }

    Background:

    EntityBaseDraggable { //THIS IS MY BACKGROUND ENTITY THAT SHOULD BE CREATED
        entityId: "background"
        entityType: "backgroundEntity"
        variationType: "red" //DEFAULT VARIATIONTYPE
        poolingEnabled: true
        z: -1000
        width: 128
        height: 128
    
        selectionMouseArea.anchors.fill: mouseRectangle
    
        Rectangle{
            id: mouseRectangle
            anchors.fill: parent
        }
    
        Rectangle {
            id: image
            z:3001
            color: variationType
            anchors.fill: parent
        }
    
        BoxCollider {
            id: boxCollider
            bodyType: Body.Static
            categories: Box.Category3
            collidesWith: Box.Category2 | Box.Category1
        }
    }

     

    Hope this helps!
    Cheers,
    Günther

    #15240

    Darren

    Hi Gunther!

    Thank you for your speedy reply.  From what I can see, the only real difference you made was adding poolingEnabled to the EntityManager?

    The parts where you showed the levelEditingUI visible were not needed – I had covered that elsewhere in my code (I didn’t show it because I thought it not necessary) – I make the levelEditngUI visible only when the gameScene is in the levelEditing state.

    Apart from that, your code looks the same as mine…?

    I added the poolingEnabled to EntityManager, but it still doesn’t work for me though.  I am able to drag the entities into the container, but they still do not apply the variationType.

    I am now wondering if it is to do with the container where I am dragging my entity INTO?

    To explain – the levelEditingUI sits in the gameScene.

    The container that the entity is dragged into also sits in the gameScene – but is not the gameScene itself.

    The container actually applies a rotation to objects inside it, to match the rotation of my tank (that the game is about).

    The levelEditingUI appears beneath this container and does not rotate.  Could this be something to do with the problem?

    A complete copy of my gameScene code is below – sorry if I didn’t provide enough information the first time.

     

    import Felgo 3.0
    import QtQuick 2.0
    import "../common"
    import "../entities"
    
    SceneBase {
      id:gameScene
      width: 320
      height: 480
      scaleMode: "letterbox"
    
     // the filename of the current level gets stored here, it is used for loading the
     property string activeLevelFileName
     // the currently loaded level gets stored here
     property variant activeLevel
    
      // set the name of the current level, this will cause the Loader to load the corresponding level
     function setLevel(fileName) {
       activeLevelFileName = fileName
     }
    
    // ItemEditor {
    //     id: itemEditor
    //     opacity: 0.7
    //     z:1
         // start visible
    //   }
    
    // LevelEditor {
          // .. the usage is explained in the next step number 2.)
    //}
    
     Rectangle{
         id: sceneBackground
         anchors.fill: parent
         color: "white"
     }
    
     EntityManager {
         id: entityManager
         entityContainer: container
    
         // required for LevelEditor, so the entities can be created by entityType
         poolingEnabled: true
         dynamicCreationEntityList: [ Qt.resolvedUrl("../entities/Background.qml") ]
     }
    
     LevelEditingUI{
         id: levelUI
    
     }
    
     states: [
            State {
              // when the state is changed to levelEditing, the buildEntityButtons get visible and can be added to the level
              name: "levelEditing"
              PropertyChanges { target: levelUI; visible: true}
              PropertyChanges { target: turretController; visible: false}
              PropertyChanges { target: fireButton; visible: false}
              PropertyChanges { target: joystickController; visible: false}
            },
             State {
               // when the state is changed to levelEditing, the buildEntityButtons get visible and can be added to the level
               name: "playing"
               PropertyChanges { target: levelUI; visible: false}
               PropertyChanges { target: turretController; visible: true}
               PropertyChanges { target: fireButton; visible: true}
               PropertyChanges { target: joystickController; visible: true}
             }
          ]
    
      MenuButton {
         text: "Back"
         anchors.right: gameScene.gameWindowAnchorItem.right
         anchors.rightMargin: 10
         anchors.top: gameScene.gameWindowAnchorItem.top
         anchors.topMargin: 10
         onClicked: {
             backButtonPressed()
             activeLevel = undefined
             activeLevelFileName = ""
         }//onClicked
       }//MenuButton
      MenuButton {
         text: "Playing"
         anchors.left: gameScene.gameWindowAnchorItem.left
         anchors.leftMargin: 10
         anchors.top: gameScene.gameWindowAnchorItem.top
         anchors.topMargin: 10
         onClicked: {
             if(text == "Playing"){
                 text = "Editing"
                 gameScene.state = "levelEditing"
             }
             else {
                 text = "Playing"
                 gameScene.state = "playing"
             }
         }//onClicked
       }//Menubutton
    
    
    
    
      Item{
          id: container
          /*
          THIS IS WHERE THE MAGIC HAPPENS
          We transform the container with a Rotation element in order to be able to set a custom transform origin
         (the "transformOrigin" property of the Item only allows to use enums for certain edges or the center)
          The custom origin is the center of the player thats why we add half the width.*/
          transform: Rotation { origin.x: camera.zoom * (activeLevel.tank_player.x + activeLevel.tank_player.width/2); origin.y: camera.zoom * (activeLevel.tank_player.y + activeLevel.tank_player.height/2); angle: -activeLevel.tank_player.rotation-90;}
       /*   Rectangle {
                      id: background
                      width: parent.width //*1.8
                      height: parent.height //*1.8
                      z:5000
                      color: "black"
                      anchors.centerIn: parent
                  }*/
    
          // use a physics world because we need collision detection
          PhysicsWorld {
              id: world
              updatesPerSecondForPhysics: 60
    
              debugDrawVisible : false
          }
          // load levels at runtime
         Loader {
           id: loader
           source: activeLevelFileName !== "" ? "../levels/" + activeLevelFileName : ""
           onLoaded: {
             // since we did not define a width and height in the level item itself, we are doing it here
             item.width = gameScene.width
             item.height = gameScene.height
             // store the loaded level as activeLevel for easier access
             activeLevel = item
           }
         }//Loader
      }//Container
    
      CameraVPlay {
        id: camera
        maxZoom: 1
    
        // set the gameWindowSize and entityContainer required for the camera
        gameWindowSize: Qt.point(gameScene.gameWindowAnchorItem.width, gameScene.gameWindowAnchorItem.height)
        entityContainer: container
    
        // the camera follows the player
        focusedObject: activeLevel.tank_player
      }
      VerticalSlider{
          id: cameraZoomController
          anchors.top: parent.top
          anchors.topMargin: 150
          anchors.right: gameWindowAnchorItem.right
          rotation: 180
          //anchors.rightMargin: 5
          onPositionChanged: camera.applyZoom(position, activeLevel.tank_player)
          opacity: 0.5
      }
    
      HorizontalAxisController{
          id: turretController
          anchors.bottom: gameWindowAnchorItem.bottom
          anchors.right: parent.right
          anchors.bottomMargin: 20
         // property variant playerTurretController: level.tank_player.getComponent("TurretController")
          onPositionChanged: activeLevel.tank_player.turretController = turretController.position
      }
    
      Item {
          id: fireButton
          width: 50
          height: 50
    
          anchors.bottom: gameWindowAnchorItem.bottom
          anchors.bottomMargin: 20
          anchors.horizontalCenter: parent.horizontalCenter
          Image {
              source: "../../assets/img/fire.png"
              anchors.fill: parent
    
              MouseArea {
                anchors.fill: parent
                //onPressed: activeLevel.tank_player.tankDamage = activeLevel.tank_player.tankDamage - 25
                onPressed: activeLevel.tank_player.fireButtonPressed()
              }
          }
      }
    
      JoystickControllerHUD {
          id: joystickController
          anchors.bottom: gameWindowAnchorItem.bottom
    
          // the joystick width is the space from the left to the start of the logical scene, so the radius is its half
          joystickRadius: 50 //scene.x/2
    
          // this allows setting custom images for the JoystickControllerHUD component
          source: "../../assets/img/joystick_background.png"
          thumbSource: "../../assets/img/joystick_thumb.png"
    
          // this is the mapping between the output of the JoystickControllerHUD to the input of the player's TwoAxisController
          // this is a performance improvement, to not have to bind every time the position changes
          property variant playerTwoxisController: activeLevel.tank_player.getComponent("TwoAxisController")
          onControllerXPositionChanged: playerTwoxisController.xAxis = controllerXPosition
          onControllerYPositionChanged: playerTwoxisController.yAxis = controllerYPosition;
    
    
      }
    
    
    }
    

     

    #15248

    Günther
    Felgo Team

    Hi Darren!

    I don’t think that the entity-container is related to whether the variationType property works.

    Maybe the issue lies in how you use the variationType within Background.qml, I guess creating a binding within an array like you did for frameNames does not work:

     TexturePackerAnimatedSpriteVPlay {
            id: image
            z:3001
            source: "../../assets/img/background_fire_vehicles.json"
            frameNames: [variationType] // creating a binding within a JS array does not work
            anchors.fill: parent
        }

    To create a new frameNames array when variationType changes you might need to add:

    // set new frameNames array when variationType changes
    onVariationTypeChanged: {
      image.frameNames = [variationType]
    }

    Best,
    Günther

     

    #15287

    Darren

    Hi Gunther,

    I tried your solution using onVariationTypeChanged, but it still does not work.

    The default variationType is sand.png, but when I try setting it to grass.png using the variationType in the BuildEntityButton, the image displayed is still sand.

    I did some experiments.

    1. I checked whether onVariationTypeChanged was being activated when I specified grass.png as the variationType.  I did this with a console log entry.  When I tried the grass.png the console log showed:qml: VARIATION TYPE CHANGED TO grass.png

      qml: entity got released, create it at the position if allowed to build (there are lots of this line, as I drag the entity around)

      qml: EntityManager: a component for this variationType was added before, use it

      qml: EntityManager: the creation was done vor another variationType before, but with the same entityType, so use this component for creation – other variationType: sand.png

      qml: EntityManager: found a component to create from entityType backgroundEntity and variationType grass.png : QQmlComponent(0x3b7f17d8)

      qml: VARIATION TYPE CHANGED TO grass.png

      qml: entity got released, create it at the position if allowed to build

      qml: DragEntity: no creationProperties were defined

    2. It appears  onVariationTypeChanged IS being called – but the image on screen does not change and instead, still displays the default image (sand).
    3. I experimented with setting creationProperties from BuildEntityButton – this also had no effect.  And the console log specifies – ‘no creation properties defined’ – even when I set the the creationPropeties.
    4. I experimented with the entityManager.  If I remove the entityManager completely, the entity is not created – as expected.
    5. If I remove dynamicCreationEntityList: [ Qt.resolvedUrl(“entities/Background.qml”)] – there does not appear to be ANY effect.  The entity is created whether this line is specified or not.  Could the entityManager be somehow part of the problem?  Should removal of this line mean the entity is not created?

    Any other ideas?

    Thank you

    Darren.

     

    #15288

    Günther
    Felgo Team

    The creation looks fine if the variationType changed to “grass.png“, you can try adding an instance of the Background entity directly to the scene (without using EntityManger or LevelEditor). If you then change the variationType manually (e.g. after a click on a test-button) and the image still does not change, then the issue definitely comes from the Entity Implementation (probably related to what I posted above, the image switching implemented for the entity does not work.

    Can you have a closer look at the entity implementation again to make sure that the image-switch works if the entity is used “standalone”.

    If you still have troubles, can you please send a minimal example where it does not work to support@felgo.com?
    We will have a direct look at the project then.

    Best,
    Günther

    #15295

    Darren

    Gunther,

    Thanks – I’ve  tried your test.  I manually created a standalone entity with a button to change the variationType.  This DOES work and it changes the image appropriately.

     

    Darren.

    #15296

    Darren

     

    Doing some more experiments, I have discovered that the manual button DOES work to change the image, even in the gameScene.

    The problem seems to only occur when I use the dragging function.

    #15299

    Darren

    When I use the entityBuildButton and drag my sand / grass onto the gameScene, it appears to create multiple implementations of the entity as I drag it around.  Below is the console log output from one click, drag and release of my grass.  Is this normal? (NOTE: the VARIATION TYPE CHANGED entry is from the code I put in where it outputs to the console log when the variation type changes.  Everything else was generated by qml).

     

    qml: BuildEntityButton: entity got pressed: EntityBaseDraggable_QMLTYPE_134(0x30379480, “background”) , for toCreateEntityTypeUrl: or toCreateEntityTypeString:

    qml: pos of createdEntity: 624.319898747817 479.5187108652682

    qml: BuildEntityButton: entity got pressed: EntityBaseDraggable_QMLTYPE_134(0x30379480, “background”) , for toCreateEntityTypeUrl: or toCreateEntityTypeString:

    qml: pos of createdEntity: 624.319898747817 479.5187108652682

    qml: BuildEntityButton: entity got pressed: EntityBaseDraggable_QMLTYPE_134(0x30379480, “background”) , for toCreateEntityTypeUrl: or toCreateEntityTypeString:

    qml: pos of createdEntity: 624.319898747817 479.5187108652682

    qml: BuildEntityButton: entity got pressed: EntityBaseDraggable_QMLTYPE_134(0x30379480, “background”) , for toCreateEntityTypeUrl: or toCreateEntityTypeString:

    qml: pos of createdEntity: 624.319898747817 479.5187108652682

    qml: BuildEntityButton: entity got pressed: EntityBaseDraggable_QMLTYPE_134(0x30379480, “background”) , for toCreateEntityTypeUrl: or toCreateEntityTypeString:

    qml: pos of createdEntity: 624.319898747817 479.5187108652682

    qml: BuildEntityButton: entity got pressed: EntityBaseDraggable_QMLTYPE_134(0x30379480, “background”) , for toCreateEntityTypeUrl: or toCreateEntityTypeString:

    qml: pos of createdEntity: 624.319898747817 479.5187108652682

    qml: BuildEntityButton: entity got pressed: EntityBaseDraggable_QMLTYPE_134(0x30379480, “background”) , for toCreateEntityTypeUrl: or toCreateEntityTypeString:

    qml: pos of createdEntity: 624.319898747817 479.5187108652682

    qml: BuildEntityButton: entity got pressed: EntityBaseDraggable_QMLTYPE_134(0x30379480, “background”) , for toCreateEntityTypeUrl: or toCreateEntityTypeString:

    qml: pos of createdEntity: 624.319898747817 479.5187108652682

    qml: BuildEntityButton: entity got pressed: EntityBaseDraggable_QMLTYPE_134(0x30379480, “background”) , for toCreateEntityTypeUrl: or toCreateEntityTypeString:

    qml: pos of createdEntity: 624.319898747817 479.5187108652682

    qml: BuildEntityButton: entity got pressed: EntityBaseDraggable_QMLTYPE_134(0x30379480, “background”) , for toCreateEntityTypeUrl: or toCreateEntityTypeString: backgroundEntity

    qml: pos of createdEntity: 624.319898747817 479.5187108652682

    qml: BuildEntityButton: entity got pressed: EntityBaseDraggable_QMLTYPE_134(0x30379480, “background”) , for toCreateEntityTypeUrl: or toCreateEntityTypeString:

    qml: pos of createdEntity: 624.319898747817 479.5187108652682

    qml: BuildEntityButton: button MouseArea released

    qml: EntityBaseDraggable: entityReleased position: 546.8559463213345 349.028786645418 snapped position: 512 384

    qml: entity got released, create it at the position if allowed to build

    qml: DragEntity: no creationProperties were defined

    qml: entity got released, create it at the position if allowed to build

    qml: DragEntity: no creationProperties were defined

    qml: entity got released, create it at the position if allowed to build

    qml: DragEntity: no creationProperties were defined

    qml: entity got released, create it at the position if allowed to build

    qml: DragEntity: no creationProperties were defined

    qml: entity got released, create it at the position if allowed to build

    qml: DragEntity: no creationProperties were defined

    qml: entity got released, create it at the position if allowed to build

    qml: DragEntity: no creationProperties were defined

    qml: entity got released, create it at the position if allowed to build

    qml: DragEntity: no creationProperties were defined

    qml: entity got released, create it at the position if allowed to build

    qml: DragEntity: no creationProperties were defined

    qml: entity got released, create it at the position if allowed to build

    qml: DragEntity: no creationProperties were defined

    qml: VARIATION TYPE CHANGED TO grass.png

    qml: entity got released, create it at the position if allowed to build

    qml: EntityManager: a component for this variationType was added before, use it

    qml: EntityManager: the creation was done vor another variationType before, but with the same entityType, so use this component for creation – other variationType: sand.png

    qml: EntityManager: found a component to create from entityType backgroundEntity and variationType grass.png : QQmlComponent(0x302f4aa8)

    qml: VARIATION TYPE CHANGED TO grass.png

    qml: entity got released, create it at the position if allowed to build

    qml: DragEntity: no creationProperties were defined

Viewing 9 posts - 1 through 9 (of 9 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