Drag Object Through A Wall

betsyjsg · March 19, 2015, 12:35am

I was hoping someone knows how to prevent this. Say I have an object … a ball … that I can drag around. I have defined an area within that ball can bounce off of … walls, ceiling, floor. Is there a way to prevent someone from dragging the ball outside the boundaries of your walls, ceiling, and floor? I basically making a variation of a basketball game and I want to make sure someone does pull the ball outside the court. Right now if they pull the ball outside the court, the ball falls off the screen due to the gravity. TIA.

James_Sherburne · March 19, 2015, 12:54am

@betsyjsg, could you post a bit of code? That would help figure out your current situation.

betsyjsg · March 19, 2015, 1:15am

Here’s my code thus far. I’ve also attached a screenshot of what it looks like. If I drag the ball outside the wall boundaries or the floor and let it go, it will fall off the screen because there isn’t a static body anymore to stop it from falling. If I drag the ball above the ceiling boundary and let it go, it will sit on top of the ceiling. I want to prevent someone from even being able to drag the ball outside these boundaries to eliminate this problem.

– main.lua

– Hide status bar
display.setStatusBar(display.HiddenStatusBar) – Hide that pesky bar

local physics = require “physics”
physics.start()

physics.setGravity(0, 9.0)
physics.setScale(80)
physics.setDrawMode(“normal”)

– reference point
anchor = {
    TopLeft = function(t) t.anchorX, t.anchorY = 0, 0; end,
    TopCenter = function(t) t.anchorX, t.anchorY = .5, 0; end,
    TopRight = function(t) t.anchorX, t.anchorY = 1, 0; end,
    CenterLeft = function(t) t.anchorX, t.anchorY = 0, .5; end,
    Center = function(t) t.anchorX, t.anchorY = .5, .5; end,
    CenterRight = function(t) t.anchorX, t.anchorY = 1, .5; end,
    BottomLeft = function(t) t.anchorX, t.anchorY = 0, 1; end,
    BottomCenter = function(t) t.anchorX, t.anchorY = .5, 1; end,
    BottomRight = function(t) t.anchorX, t.anchorY = 1, 1; end,
}

– color interpretation
color = function(r,g, B) return (r/255), (g/255), (b/255); end

–local background = display.newRect(0,0,display.contentWidth,display.contentHeight)
local background = display.newImageRect(“SmartPhone.png”,display.contentWidth,display.contentHeight)
anchor.Center( background )
background.x = display.contentCenterX
background.y = display.contentCenterY

local floorHeight = 10
local floor = display.newRect(25, display.contentHeight-100, display.contentWidth-55, floorHeight)
anchor.CenterLeft ( floor )
floor:setFillColor( color( 0,150,0 ) )
floor.alpha = 0.5

local wallWidth = 5
local lWall = display.newRect(20, display.contentHeight-100, wallWidth, display.contentHeight-300)
anchor.BottomLeft( lWall )
lWall:setFillColor( color( 150,0,0 ) )
lWall.alpha = 0.5

local rWall = display.newRect(display.contentWidth-20, display.contentHeight-100, wallWidth, display.contentHeight-300)
anchor.BottomRight( rWall )
rWall:setFillColor( color( 150,0,0 ) )
rWall.alpha = 0.5

local ceilingHeight = 10
local ceiling = display.newRect(25,200,display.contentWidth-45,ceilingHeight)
anchor.CenterLeft( ceiling )
ceiling:setFillColor( color( 150,0,0 ) )
ceiling.alpha = 0.5

staticMaterial = {density=2, friction=0.3, bounce=0.4}
physics.addBody(floor, “static”, staticMaterial)
physics.addBody(lWall, “static”, staticMaterial)
physics.addBody(rWall, “static”, staticMaterial)
physics.addBody(ceiling, “static”, staticMaterial)

local trashCanBack = display.newRect(display.contentWidth-20, display.contentHeight-200, 5, 100)
anchor.TopRight( trashCanBack )
trashCanBack:setFillColor( color( 33,33,33 ) )
trashCanBack.alpha = 0

local trashCanFront = display.newRect(display.contentWidth-120, display.contentHeight-200, 5, 100)
anchor.TopRight( trashCanFront )
trashCanFront:setFillColor( color( 33,33,33 ) )
trashCanFront.alpha = 0

local horizPost = display.newRect(trashCanBack.x, trashCanBack.y, 15, 15)
anchor.BottomRight( horizPost )
horizPost:setFillColor( color( 33,33,33) )
horizPost.alpha = 0

local backBoard = display.newRect(horizPost.x-horizPost.width, horizPost.y-75, 5, 100)
anchor.TopRight( backBoard )
backBoard:setFillColor( color( 33,33,33) )

physics.addBody(trashCanBack, “static”, staticMaterial)
physics.addBody(trashCanFront, “static”, staticMaterial)
physics.addBody(horizPost, “static”, staticMaterial)
physics.addBody(backBoard, “static”, staticMaterial)

local rimMiddle = display.newRect(backBoard.x-10, horizPost.y, 74, 4)
anchor.BottomRight( rimMiddle )
rimMiddle:setFillColor( color( 180,120,40) )

local rimBack = display.newRect(rimMiddle.x+rimMiddle.width/14, horizPost.y, 6, 4)
anchor.BottomRight( rimBack )
rimBack:setFillColor( color( 207,67,4 ) )

local rimFront = display.newRect(rimMiddle.x-rimMiddle.width/3-49, horizPost.y, 7, 4)
anchor.BottomRight( rimFront )
rimFront:setFillColor( color( 207,67,4 ) )

physics.addBody(rimBack, “static”, staticMaterial)
physics.addBody(rimFront, “static”, staticMaterial)

local ball = display.newCircle(0.2*display.contentWidth, 0.4*display.contentHeight, 18)
ball:setFillColor( color(192,99,55) )

physics.addBody(ball, “dynamic”, {density=0.8, friction=0.3, bounce=0.4, radius=18})

local speedX = 0
local speedY = 0
local prevTime = 0
local prevX = 0
local prevY = 0

local function drag(event)
    local myball = event.target
    local phase = event.phase
    if phase == “began” then
        display.getCurrentStage():setFocus(myball)
        --print("myBall: " … myball.x … ", " … myball.y)
        myball.x0 = event.x - myball.x
        myball.y0 = event.y - myball.y
        myball.bodyType = “kinematic”
        myball:setLinearVelocity(0, 0)
        myball.angularVelocity = 0
    elseif phase == “moved” then
        myball.x = event.x - myball.x0
        myball.y = event.y - myball.y0
    elseif phase == “ended” or phase == “cancelled” then
        display.getCurrentStage():setFocus(nil)
        myball.bodyType = “dynamic”
        ball:setLinearVelocity(speedX,speedY)
    end
    return true
end

function trackVelocity(event)
    local timePassed = event.time - prevTime
    prevTime = prevTime + timePassed
    speedX = (ball.x - prevX) / (timePassed / 1000)
    speedY = (ball.y - prevY) / (timePassed / 1000)
    prevX = ball.x
    prevY = ball.y
end

Runtime:addEventListener(“enterFrame”, trackVelocity)

ball:addEventListener(“touch”, drag)

scoreVal = 0
local lastGoalTime = 1000

function monitorScore(event)
    if event.time - lastGoalTime > 500 then
        if ball.x > rimFront.x + rimFront.width and ball.x < rimBack.x - rimBack.width and ball.y > rimMiddle.y and ball.y < rimMiddle.y + 10 then
            scoreVal = scoreVal + 1
            lastGoalTime = event.time
            score.text = "Score: " … scoreVal
        end
    end
end

–Runtime:addEventListener(“enterFrame”, monitorScore)

betsyjsg · March 19, 2015, 1:17am

Sorry … forgot to attach the screenshot.

Method_Mobile · March 19, 2015, 2:49pm

I edited your code to keep the ball inside the physics boundaries. Its a pretty easy concept. When ever the ball is moved just check for the edges of the screen. Hope this helps

JM

[lua]

display.setStatusBar(display.HiddenStatusBar) – Hide that pesky bar

local physics = require “physics”

physics.start()

physics.setGravity(0, 9.0)

physics.setScale(80)

physics.setDrawMode(“normal”)

local leftSide = display.screenOriginX;

local rightSide = display.contentWidth-display.screenOriginX;

local topSide = display.screenOriginY;

local bottomSide = display.contentHeight-display.screenOriginY;

– color interpretation

color = function(r,g, B) return (r/255), (g/255), (b/255); end

local background = display.newRect(0,0,display.contentWidth,display.contentHeight)

–local background = display.newImageRect(“SmartPhone.png”,display.contentWidth,display.contentHeight)

background.x = display.contentCenterX

background.y = display.contentCenterY

local floorHeight = 10

local floor = display.newRect(25, display.contentHeight-100, rightSide, floorHeight)

floor.x = display.contentWidth * 0.5

floor.y = bottomSide

floor:setFillColor( color( 0,150,0 ) )

floor.alpha = 0.5

local wallWidth = 5

local lWall = display.newRect(20, display.contentHeight-100, wallWidth, bottomSide)

lWall:setFillColor( color( 150,0,0 ) )

lWall.x = leftSide

lWall.y = display.contentHeight * 0.5

lWall.alpha = 0.5

local rWall = display.newRect(display.contentWidth-20, display.contentHeight-100, wallWidth, bottomSide)

rWall:setFillColor( color( 150,0,0 ) )

rWall.x = rightSide

rWall.y = display.contentHeight * 0.5

rWall.alpha = 0.5

local ceilingHeight = 10

local ceiling = display.newRect(25,200,rightSide ,ceilingHeight)

ceiling:setFillColor( color( 150,0,0 ) )

ceiling.x = display.contentWidth * 0.5

ceiling.y = topSide

ceiling.alpha = 0.5

staticMaterial = {density=2, friction=0.3, bounce=0.4}

physics.addBody(floor, “static”, staticMaterial)

physics.addBody(lWall, “static”, staticMaterial)

physics.addBody(rWall, “static”, staticMaterial)

physics.addBody(ceiling, “static”, staticMaterial)

local trashCanBack = display.newRect(display.contentWidth-20, display.contentHeight-200, 5, 100)

trashCanBack:setFillColor( color( 33,33,33 ) )

trashCanBack.alpha = 0

local trashCanFront = display.newRect(display.contentWidth-120, display.contentHeight-200, 5, 100)

trashCanFront:setFillColor( color( 33,33,33 ) )

trashCanFront.alpha = 0

local horizPost = display.newRect(trashCanBack.x, trashCanBack.y, 15, 15)

horizPost:setFillColor( color( 33,33,33) )

horizPost.alpha = 0

local backBoard = display.newRect(horizPost.x-horizPost.width, horizPost.y-75, 5, 100)

backBoard:setFillColor( color( 33,33,33) )

physics.addBody(trashCanBack, “static”, staticMaterial)

physics.addBody(trashCanFront, “static”, staticMaterial)

physics.addBody(horizPost, “static”, staticMaterial)

physics.addBody(backBoard, “static”, staticMaterial)

local rimMiddle = display.newRect(backBoard.x-10, horizPost.y, 74, 4)

rimMiddle:setFillColor( color( 180,120,40) )

local rimBack = display.newRect(rimMiddle.x+rimMiddle.width/14, horizPost.y, 6, 4)

rimBack:setFillColor( color( 207,67,4 ) )

local rimFront = display.newRect(rimMiddle.x-rimMiddle.width/3-49, horizPost.y, 7, 4)

rimFront:setFillColor( color( 207,67,4 ) )

physics.addBody(rimBack, “static”, staticMaterial)

physics.addBody(rimFront, “static”, staticMaterial)

local ball = display.newCircle(0.2*display.contentWidth, 0.4*display.contentHeight, 18)

ball:setFillColor( color(192,99,55) )

physics.addBody(ball, “dynamic”, {density=0.8, friction=0.3, bounce=0.4, radius=18})

local speedX = 0

local speedY = 0

local prevTime = 0

local prevX = 0

local prevY = 0

local halfBall = ball.contentWidth*0.5

local function checkBoundries()

if ball.contentBounds.xMax > rightSide then

ball.x = rightSide - halfBall

end

if ball.contentBounds.xMin < leftSide then

ball.x = leftSide + halfBall

end

if ball.contentBounds.yMax > bottomSide then

ball.y = bottomSide - halfBall

end

if ball.contentBounds.yMin < topSide then

ball.y = topSide + halfBall

end

local function drag(event)

local myball = event.target

local phase = event.phase

if phase == “began” then

display.getCurrentStage():setFocus(myball)

--print("myBall: " … myball.x … ", " … myball.y)

myball.x0 = event.x - myball.x

myball.y0 = event.y - myball.y

myball.bodyType = “static”

myball:setLinearVelocity(0, 0)

myball.angularVelocity = 0

elseif phase == “moved” then

myball.x = event.x - myball.x0

myball.y = event.y - myball.y0

checkBoundries()

elseif phase == “ended” or phase == “cancelled” then

display.getCurrentStage():setFocus(nil)

myball.bodyType = “dynamic”

ball:setLinearVelocity(speedX,speedY)

end

return true

end

function trackVelocity(event)

local timePassed = event.time - prevTime

prevTime = prevTime + timePassed

speedX = (ball.x - prevX) / (timePassed / 1000)

speedY = (ball.y - prevY) / (timePassed / 1000)

prevX = ball.x

prevY = ball.y

end

Runtime:addEventListener(“enterFrame”, trackVelocity)

ball:addEventListener(“touch”, drag)

scoreVal = 0

local lastGoalTime = 1000

function monitorScore(event)

if event.time - lastGoalTime > 500 then

if ball.x > rimFront.x + rimFront.width and ball.x < rimBack.x - rimBack.width and ball.y > rimMiddle.y and ball.y < rimMiddle.y + 10 then

scoreVal = scoreVal + 1

lastGoalTime = event.time

score.text = "Score: " … scoreVal

end

[/lua]

betsyjsg · March 19, 2015, 7:20pm

Thanks. This works perfectly.

James_Sherburne · March 19, 2015, 12:54am

@betsyjsg, could you post a bit of code? That would help figure out your current situation.

betsyjsg · March 19, 2015, 1:15am