특정 영역에 들어가면 객체의 색 바꾸기 (Sensor)

오늘 다룰 예제는 작은 원을 드래그해서 큰 원에 닿으면 작은 원의 색을 바뀌게 하는 기능 입니다.

기본적으로 Physics와 Collision 이벤트 리스너를 이용합니다.
그리고 addBody에서 isSensor 기능을 이용하게 됩니다.

이 isSensor 기능이 오늘 보실 새로운 기능입니다. 그리고 두번째 예제에서 preCollision 이벤트도 덤으로 보시겠습니다.

결과 화면을 먼저 보시고 소스코드를 보겠습니다.

display.setStatusBar(display.HiddenStatusBar)

require ( "physics" )
physics.start()
physics.setGravity( 0, 0 )
local hero = display.newCircle( 40, 40, 30 )
hero.name = "hero"
physics.addBody(hero, "dynamic")

local function moveHero (event)
hero.x = event.x
hero.y = event.y
end
hero:addEventListener("touch", moveHero)

local colorSensor = display.newCircle( 160, 240, 80 )
physics.addBody(colorSensor, {isSensor = true})
colorSensor.alpha = 0.2

colorSensor:addEventListener("collision", colorSensor)
function colorSensor:collision (event)
if event.other.name == "hero" and event.phase == "began" then
red = math.random(0,255)
green = math.random(0,255)
blue = math.random(0,255)
hero:setFillColor(red, green, blue)
end
end

소스를 보시면 우선 status바를 없애고 physics를 require하고 중력을 0으로 합니다.
나중에 원 두개 다 dynamic으로 addBody를 할 거니까 중력을 0으로 하지 않으면 밑으로 떨어지겠죠?

그리고 hero라는 이름으로 작은 원을 만들고 name을 정해주고 dynamic으로 addBody를 해 줍니다.

이 작은 원에 touch 리스너 이벤트를 달아서 touch 한 지점에 위치하게 됩니다.
그러면 손가락으로 잡고 끌면 따라 오겠네요.

다음엔 큰 원을 만들고 addBody에서 isSensor = true로 선언합니다.

이 큰 원에 collision이벤트를 줍니다.
이 이벤트에서 불러오는 함수는 (colorSensor) event.other.name이 hero이고 이벤트가 시작 됐을 때 hero.setFillColor로 작은 원의 색을 바꿔 줍니다.

간단하죠?

여기서 isSensor를 false 로 하면 어떻게 될까요?
그러면 둘 다 dynamic으로 addBody를 했기 때문에 둘이 부딪히면 큰 원이 밀려 날 겁니다.

isSensor를 true로 한다는 얘기는 physics 객체가 와서 부딪혀도 밀려나지않고 제자리에서 센서의 역할만 한다는 의미입니다.

한가지만 더 볼까요?

이번 예제는 노란 사각형이 위에서 떨어지는데 첫번째 흰 줄은 그냥 통과하고 두번째 흰 줄에서 걸리는 프로그램 입니다.

local physics = require("physics")
physics.start()
display.setStatusBar( display.HiddenStatusBar )
 
local platform1 = display.newRect( 20, 200, 280, 15 )
platform1.myName = "platform1"
physics.addBody(platform1, "static")
 
local platform2 = display.newRect( 20, 320, 280, 15 )
platform2.myName = "platform2"
physics.addBody(platform2, "static")
 
local box = display.newRect( 20, 20, 50, 50 )
box:setFillColor(255,255,0,255)
box.myName = "box"
physics.addBody(box)
 
local function onLocalPreCollision( self, event )
        -- Let box pass through platform 1
        local platform = event.other
        if platform.myName == "platform1" then
                platform.isSensor = true
        end
end
 
box.preCollision = onLocalPreCollision
box:addEventListener( "preCollision", box )

첫번째 세줄은 그냥 넘어가겠습니다.
다음은 두개의 긴 사각형을 만들고 모두 static으로 선언합니다.
그리고 각각 myName에 이름을 할당합니다.

그리고 노란 정사각형을 만들로 addBody를 합니다. 디폴트로 dynamic이 선언됩니다.

여기에 노란 정사각형에 preCollision 이벤트를 달로 이 preCollision은 onLocalPreCollision 함수를 콜 합니다.

preCollision은 충돌하기 직전에 호출 되는 이벤트 입니다.
그러니까 onLocalPreCollision은 충돌되기 직전에 이것이 platform1 이면 isSensor를 true로 바꿔서 그냥 통과 시켜 버리게 됩니다.

오늘 배운 기능도 꽤 유용한 기능이네요.

잘 알아두면 게임 만들 때 아주 요긴하게 쓰일 것 같습니다.

그럼 다음 시간에 또 뵐께요.