Forums

OverviewV-Play 1 Support › Level Editor (not possible to position entity at row 0 or column 0

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #6444

    PanflamCutie
    Dear V-Playteam,
    
    I want to add entityies with a Level Editor, but if i want to add it to the row 0 or the column 0 (defined properties in Tree.qml)
    they aren't positioned there.
    
    I hope you can help me with my issue.
    Best regards,
    PanflamCutie
    
    
    
    main.qml
    
    
    import VPlay 1.0
    import QtQuick 1.1
    import "entities"
    
    GameWindow {
        activeScene: scene
        // the size of the Window can be changed at runtime by pressing the number keys 1-7
        // the content of the logical scene size (480x320 by default) gets scaled to the window size based on the scaleMode
        // you can set this size to any resolution you would like your project to start with, most of the times the one of your main target device
        // this resolution is for iPhone 4 & iPhone 4S
        // change this to a portrait resolution (e.g. 640x960) for games in portrait mode
        width: 960
        height: 640
        
    
    
    
        EntityManager {
            id: entityManager
            entityContainer: scene
    
            // required for LevelEditor, so the entities can be created by entityType
            dynamicCreationEntityList: [ Qt.resolvedUrl("entities/Tree.qml") ]
        }
    
    
        Scene {
            id: scene
            // the "logical size" - the scene content is auto-scaled to match the GameWindow size
            // change this to 320x480 for games in portrait mode
            width: 480
            height: 320
    
    
    
            gridSize: scene.height/9
    
            BackgroundImage {
                source: "img/forestground.png"
                anchors.fill: parent
            }
    
    
            Tree {
                column: 0
                row: 0
            }
    
            Tree {
                column: 1
                row: 0
            }
            Tree {
                column: 0
                row: 8
            }
    
            Tree {
                column: 12
                row: 8
            }
    
    
    
                // state: "levelEditing" enables dragging and clicking of obstacles
                // change the state in the next line to start in levelEditing mode:
                state: "playing" //state: "levelEditing"
    
                onStateChanged: {
                  if(state === "levelEditing") {
                    //stopGame()
                  }
                }
    
                function stopGame() { //needs to be modified in actual game ^^
                  // remove all entities of type "tree", but not the walls
                  entityManager.removeEntitiesByFilter(["tree"]);
                }
    
                LevelEditor {
                  id: levelEditor
                  toRemoveEntityTypes: [ "tree" ]
                  toStoreEntityTypes: [ "tree" ]
                }
    
                Column {
                  anchors.right: parent.right
    
                  spacing: 5
    
                  SimpleButton {
                    text: scene.state === "playing" ? "Level Mode" : "Game Mode"
                    onClicked: {
                      if(text === "Level Mode")
                        scene.state = "levelEditing"
                      else
                        scene.state = "playing"
                    }
    
                    anchors.right: parent.right
                  }
    
                  BuildEntityButton {
                    visible: scene.state === "levelEditing"
                    toCreateEntityType: "entities/Tree.qml"
    
                    width: 50
                    height: 50
                    anchors.right: parent.right
    
                    // the obstacle is just a grey entity, we can customize the look of the button here
                    Rectangle {
                      color: "purple"
                      anchors.fill: parent
                    }
                  }
                }
    
    
        }
    }
    
    
    
    Tree.qml
    
    
    
     import QtQuick 1.1
     import VPlay 1.0
     import Box2D 1.0 // needed for Box category
    
     //Item {
     // use an EntityBase for the base item, to be able to create, destroy and access the tntity by type with the EntityManager (and to be able to save/load it through the EM!)
     EntityBaseDraggable {
         id: tree
    
         // columnn & row may be set from outside, for easier positioning along the grid
         property int column
         property int row
    
         property real gridSize: scene.gridSize
    
         entityType: "tree"
         // the variationType may be blockBrown, blockRed
         variationType: "standard"
    
         // when e.g. column = 0 is specified, the block should be placed centered at column 0
         x: column*gridSize//+gridSize*0.5
         y: row*gridSize//+gridSize*0.5
    
         // these properties must be set for EntityBaseDraggable
         selectionMouseArea.anchors.fill: sprite
         //colliderComponent: collider
    
         selectionMouseArea.onPressAndHold: removeEntity()//onEntityPressAndHold: removeEntity()
    
         Image {
             id: sprite
             source: "../img/tree.png"
    
             // make it 1 pixel wider, otherwise there is a transparent pixel around the borders!
             width: gridSize+1
             height: gridSize+1
             anchors.left: parent.left
         }
     }

     

     

    importQtQuick1.1

    importVPlay1.0
    importBox2D1.0//neededforBoxcategory
    //Item{
    //useanEntityBaseforthebaseitem,tobeabletocreate,destroyandaccessthetntitybytypewiththeEntityManager(andtobeabletosave/loaditthroughtheEM!)
    EntityBaseDraggable{
    id:tree
    //columnn&rowmaybesetfromoutside,foreasierpositioningalongthegrid
    propertyintcolumn
    propertyintrow
    propertyrealgridSize:scene.gridSize
    entityType:"tree"
    //thevariationTypemaybeblockBrown,blockRed
    variationType:"standard"
    //whene.g.column=0isspecified,theblockshouldbeplacedcenteredatcolumn0
    x:column*gridSize//+gridSize*0.5
    y:row*gridSize//+gridSize*0.5
    //thesepropertiesmustbesetforEntityBaseDraggable
    selectionMouseArea.anchors.fill:sprite
    //colliderComponent:collider
    selectionMouseArea.onPressAndHold:removeEntity()//onEntityPressAndHold:removeEntity()
    Image{
    id:sprite
    source:"../img/tree.png"
    //makeit1pixelwider,otherwisethereisatransparentpixelaroundtheborders!
    width:gridSize+1
    height:gridSize+1
    anchors.left:parent.left
    }
    }
    #6445

    Christian
    V-Play Team

    Hi,

    please format your post so it is readable (you mixed up the code field), and prepare the code so it is runnable without your images (i.e. replace the Image element with a Rectangle).

    Cheers, Chris

    #6447

    PanflamCutie

    Here is the code of the Tree.qml:

     

    import QtQuick 1.1
    import VPlay 1.0
    import Box2D 1.0 // needed for Box category
    
    //Item {
    // use an EntityBase for the base item, to be able to create, destroy and access the tntity by type with the EntityManager (and to be able to save/load it through the EM!)
    EntityBaseDraggable {
        id: tree
    
        // columnn & row may be set from outside, for easier positioning along the grid
        property int column
        property int row
    
        property real gridSize: scene.gridSize
    
        entityType: "tree"
        // the variationType may be blockBrown, blockRed
        variationType: "standard"
    
        // when e.g. column = 0 is specified, the block should be placed centered at column 0
        x: column*gridSize//+gridSize*0.5
        y: row*gridSize//+gridSize*0.5
    
        // these properties must be set for EntityBaseDraggable
        selectionMouseArea.anchors.fill: sprite
        //colliderComponent: collider
    
        selectionMouseArea.onPressAndHold: removeEntity()//onEntityPressAndHold: removeEntity()
    
        Rectangle {
            id: sprite
            color: "blue"
    
            width: gridSize+1
            height: gridSize+1
            anchors.left: parent.left
        }
    }

     

    and here is the code of the main.qml:

     

    import VPlay 1.0
    import QtQuick 1.1
    import "entities"
    
    GameWindow {
        activeScene: scene
        // the size of the Window can be changed at runtime by pressing the number keys 1-7
        // the content of the logical scene size (480x320 by default) gets scaled to the window size based on the scaleMode
        // you can set this size to any resolution you would like your project to start with, most of the times the one of your main target device
        // this resolution is for iPhone 4 & iPhone 4S
        // change this to a portrait resolution (e.g. 640x960) for games in portrait mode
        width: 960
        height: 640
        
        EntityManager {
            id: entityManager
            entityContainer: scene
    
            // required for LevelEditor, so the entities can be created by entityType
            dynamicCreationEntityList: [ Qt.resolvedUrl("entities/Tree.qml") ]
        }
    
        Scene {
            id: scene
            // the "logical size" - the scene content is auto-scaled to match the GameWindow size
            // change this to 320x480 for games in portrait mode
            width: 480
            height: 320
    
    
    
            gridSize: scene.height/9
    
            //        BackgroundImage {
            //            source: "img/forestground.png"
            //            anchors.fill: parent
            //        }
    
    
            Tree {
                column: 0
                row: 0
            }
    
            Tree {
                column: 1
                row: 0
            }
            Tree {
                column: 0
                row: 8
            }
    
            Tree {
                column: 12
                row: 8
            }
    
    
    
            // state: "levelEditing" enables dragging and clicking of obstacles
            // change the state in the next line to start in levelEditing mode:
            state: "playing" //state: "levelEditing"
    
            onStateChanged: {
                if(state === "levelEditing") {
                    //stopGame()
                }
            }
    
            function stopGame() { //needs to be modified in actual game ^^
                // remove all entities of type "tree", but not the walls
                entityManager.removeEntitiesByFilter(["tree"]);
            }
    
            LevelEditor {
                id: levelEditor
                toRemoveEntityTypes: [ "tree" ]
                toStoreEntityTypes: [ "tree" ]
            }
    
            Column {
                anchors.right: parent.right
    
                spacing: 5
    
                SimpleButton {
                    text: scene.state === "playing" ? "Level Mode" : "Game Mode"
                    onClicked: {
                        if(text === "Level Mode")
                            scene.state = "levelEditing"
                        else
                            scene.state = "playing"
                    }
    
                    anchors.right: parent.right
                }
    
                BuildEntityButton {
                    visible: scene.state === "levelEditing"
                    toCreateEntityType: "entities/Tree.qml"
    
                    width: 50
                    height: 50
                    anchors.right: parent.right
    
                    // the obstacle is just a grey entity, we can customize the look of the button here
                    Rectangle {
                        color: "purple"
                        anchors.fill: parent
                    }
                }
            }
        }
    }

     

    I replaced the image with and Rectangle and commented the part with the background-image.

    #6450

    Alex
    V-Play Team
    #6451

    PanflamCutie

    Hi,
    the problem is when I change to the Level Mode (click the button) and I want to position a new element (in this case its a rectangle) to the left column (column-property is set to 0) or in the top row (row-property is set to 0) then it won’t allow me to place it there dynamically (by using the level editor).

     

    Best regards,PanflamCutie

    #6453

    Alex
    V-Play Team

    Hi again,

    i changed the Tree.qml like this to make it work, my changes are highlighted with “// !!!!“:

    import QtQuick 1.1
    import VPlay 1.0
    import Box2D 1.0 // needed for Box category
    
    //Item {
    // use an EntityBase for the base item, to be able to create, destroy and access the tntity by type with the EntityManager (and to be able to save/load it through the EM!)
    EntityBaseDraggable {
        id: tree
    
        // columnn & row may be set from outside, for easier positioning along the grid
        property int column
        property int row
    
        property real gridSize: scene.gridSize
    
        // !!!!
        // the default not allowed to build rectangle has its position at x:-width/2 and y:-height/2
        notAllowedRectangle.x: 0
        notAllowedRectangle.y: 0
        // !!!!
        // this is used internally (it was initially added for our squaby demo game) so the towers cannot be built at the edges of the level, however that is just what you want, so set this internal value to 0
        __towerSizeInGridsHalf: 0
    
        entityType: "tree"
        // the variationType may be blockBrown, blockRed
        variationType: "standard"
    
        // when e.g. column = 0 is specified, the block should be placed centered at column 0
        x: column*gridSize//+gridSize*0.5
        y: row*gridSize//+gridSize*0.5
    
        // these properties must be set for EntityBaseDraggable
        selectionMouseArea.anchors.fill: sprite
        colliderComponent: collider
    
        selectionMouseArea.onPressAndHold: removeEntity()//onEntityPressAndHold: removeEntity()
    
        Rectangle {
            id: sprite
            color: "blue"
    
            width: gridSize
            height: gridSize
            anchors.left: parent.left
        }
        // !!!!
        // you should always use a collider in your EntityBaseDraggable, it is used for collision detection while building it, e.g. to prevent that 2 entities are built in the same spot
        BoxCollider {
          id: collider
          width: gridSize
          height: gridSize
          anchors.left: parent.left
          bodyType: Body.Static
        }
    }
    

    Now that there is a collider used, you also need to add a PhysicsWorld to your scene. After that, it should work as you requested.

    Cheers,
    Alex

     

    #6459

    PanflamCutie

    Hi,

    thanks to the added code its working now (although I don’t fully understand what the code does).

    Furthermore now it’s also possible to add the element in the row 10 (count started with 0) and column 13 (count started with 0), despite the fact that we wanted to restrict the grid to 9×13 (rows x columns). But this is not much of a problem here, because we just want to use the level editor to create our own levels (I just wanted to let you know 😉 ).

     

    Thanks for the help and best regards,

    PanflamCutie

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