중간고사와 여러 행사로 인해 고도엔진을 몇 주 만에야 들었습니닷.....
오랜만에 수업 듣는 거라... 정말 단 하나도 모르겟더라구요....
복습을 미리 하고 갔어야 하는 것이지만... 중반부터는 나름 잘 따라갔습니닷.
저번에 Timer 노드까지 추가해 주었는데요~
저희가 Timer 를 추가해서 일정 기간 동안 생존 해 있으면 게임이 끝나는 것으로 할 거예요!
그러한 방식으로 작동하기 위한 코드가 바로
extends Node2D
var remain_times
func _ready():
$GameTimer.start()
remain_times = 20
func _process(delta):
pass
func _on_game_timer_timeout():
remain_times -= 1
if remain_times == 0:
print("게임 종료!")
queue_free()
대략 이러한 코드였어요!
제가 코드를 날려서 살짝 이상할 수도 있습니다.....
우선 남은 시간은 20 이며 Timer 가 실행될 때마다 remain_times 를 1씩 감소해 줘요!
마지막에 remain_times 가 0 이 되면 그냥 바로 game 을 종료하고, queue_free() 를 줘서 화면을 아무것도 없게 만들었습니닷!
그럼 이제 그 타이머가 사용자에게 보여야 하기 때문에 UI 를 사용해 줄 건데여~
UI 는 대략적으로 게임 화면과 무관하게 작동하는 것이라는 의미예요!
이를 위한 특별한 노드가 고도엔진에 저장되어있어요!
그 중에서도 제일 많이 쓰는 것은 Label 입니다. 쉽게 말해서 글씨를 쓰는 UI 예요!
남는 시간을 보여주기 위해서 노드를 추가하고 이름을 변경했어요!
이렇게 노드를 추가하고, 노드의 이름을 변경해 주시면 이런 요상한 모양이 뜹니다.
여기 Insepctor 에 가주시면
이렇게 자유자재로 텍스트를 작성할 수 있어요!
여기서는 저희가 가져온 font 도 사용할 수 있고 font color , font size 도 바꿀 수 있어요!
그리고 처음 script 코드를
extends Node2D
var remain_times
func _ready():
remain_times = 10
$GameTimer.start()
$GameUI/RemainTimeCountText.text = str(remain_times)
func _process(delta):
pass
func _on_game_timer_timeout():
remain_times -= 1
$GameUI/RemainTimeCountText.text = str(remain_times)
if remain_times == 5:
$GameUI/RemainTimeCountText.set("theme_override_colors/font_color", Color(1.0,0.0,0.0,1.0))
if remain_times == 0:
print("게임 종료!")
queue_free()
코드는 이렇게 추가해 주었어요!
우선 시간이 감소할 때마다 사용자에게 보여지는 시간도 감소해야 하기 때문에
remain_times 를 .text 에 대입해주면 됩니닷.
그리고 꼭 str 로 형변환을 해주어야 합니다! 이유는 여기에서 자동으로 해주지 않는데요~ ㅜㅜ
감소는 똑같이 해주되, 사용자에게 보여주기 위해 .text 를 사용했다는 것을 기억하시길 바랍니다.
그리구 저는 5초가 남았을 때는 사용자에게 빨간색으로 텍스트를 보여주기 위해
코드를 추가해 줬는데용
if remain_times == 5:
$GameUI/RemainTimeCountText.set("theme_override_colors/font_color", Color(1.0,0.0,0.0,1.0))
바로 이 코드예요!!!!!
제가 아까 font_color 를 수정할 수 있다고 했잖아요!!!
고도에서는 색을 0.0 에서 1.0 사이로 나타내야 합니닷.
rgb 는 0 ~ 256 사이의 숫자로 나타내잖아요!
그래서 Color(1.0,0.0,0.0,1.0) 가 여기서는 r, g, b 를 나타내용
마지막은 투명도!를 나타내며 저는 1.0은 완전히 불투명하게 해 줬답니닷. OwO
여기서 크기를 커서로 끌어당겨 맞춰주고 파란색으로 되어 있는 부분을 Center 로 줘서 가운데로 맞춰줬어요!
마지막으로는 CanvasLayer 의 특징입니닷!
CanvasLayer 는 완전 별도로 움직여요!
- 씬의 다른 요소들과 별도로 렌더링 됨
- 카메라 움직임의 영향을 받지 않음
- 일반 노드(가령 Node2D, Sprite2D 등등)보다 항상 위에 렌더링 됨
- 화면 해상도가 변경되어도 일관된 위치를 유지
- UI, HUD, 메뉴와 같은 씬을 구현하는데 적합
UI 는 위치가 바뀌면 안 되기 때문에 카메라의 움직임의 영향을 절대 받지 않구, UI 는 무조건 앞에 있어야 해서 위에 렌더링을 해줍니닷. 마지막으로는 항상 일관된 위치에 있어야 해용 ^3^
이상!!! 또 금방 돌아올게유...