# 만지면 색을 바꾸는 카멜레온
카멜레온에게 터치 입력을 주면 색을 바꾸는 작업을 진행하겠습니다. 새로운 내용이 많이 나와도 당황하지 마시고 천천히 따라오세요.
1. Chameleon 액터 블루프린트의 Event Graph(이벤트 그래프)를 여세요. 지난 장에서 만든 로직이 보여야 합니다.
2. Print String 노드를 지워주세요. (선택 후 Delete키)
3. 좌측 상단 Components 탭에 보이는 Plane을 이벤트 그래프 안으로 끌어다 놓으세요.
4. 아래 그림처럼 파란색 Plane 노드의 핀을 뽑아 들고, 빈공간에서 놓으세요. 검색창이 뜰거예요.
블루프린트 그래프에서 이렇게 핀을 뽑아 들고 노드를 검색하는게 매우매우매우매우매우매우매우매우매우매우매우매우매우매우매우매우매우매우매우매우매우 중요합니다.
그냥 우클릭 검색과 핀을 뽑아들고 검색은 검색 결과의 차이를 불러옵니다. 그 이유는 다른 포스팅(링크 준비중)에서 자세히 설명할게요.
5. 계속해서 param 이라는 검색어를 통해 Set Vector Parameter Value on Materials 노드를 찾아서 만들어주세요.
6. 연결까지 해주세요.
위 그래프에서 Set Vector Parameter Value on Materials 노드가 하는 일은 아래와 같습니다. (이해 안되면 패스하세요. 뒤에 바로 실습 들어갑니다.)
- Plane이 사용중인 머티리얼에 혹시 Parameter Name과 이름이 같은 Parameter가 있는지 확인
- 이름이 같은 Parameter가 있다면 Parameter Value에 적힌 값을 전달
7. Parameter Name에 None 을 PreviousColor로 바꿔주세요. Parameter Value 는 1, 1, 1 로 바꿔주세요.
6장의 기억을 되살려 보세요.
M_Chameleon 머티리얼 작성할 때 PreviousColor 라고 이름 지어준 Vector Parameter 노드가 있었습니다.
다시 설명충 등판하겠습니다. 장문 주의하세요...
- 먼저 우리 판떼기(Plane)는 M_Chameleon 머티리얼을 갖고있습니다.
- Set Vector Parameter on Materials 노드는 Target(타겟, 대상)이 갖고있는 머티리얼을 조사합니다.
- 우리가 사용한 Set Vector 어쩌구~ 노드의 Target은 Plane 입니다.
- 그래서 Set Vector Parameter on Materials 노드는 Plane이 갖고있는 M_Chameleon을 조사합니다.
- PreviousColor 의 값을 Parameter Value 값(1.0, 1.0, 1.0)으로 바꿔줍니다.
8. 그 원리야 어쨌든, 바로 결과를 확인해보겠습니다. 메인화면으로 가서 플레이 버튼을 눌러주세요.
9. 플레이가 시작되면 카멜레온을 한번 클릭해주세요.
PreviousColor의 영역이었던 노란색 부분이 흰색으로 바뀐것을 확인할 수 있습니다. (Parameter Value 1,1,1을 색으로 표현하면 흰색이에요)
이제 ESC를 눌러서 플레이를 종료해주세요.
# 아직 만족하긴 이르다.
Chameleon 액터 블루프린트에서 M_Chameleon에 접근해서 색상 값을 바꾸는 데 성공했지만,
카멜레온은 아직도 우리가 원하는 방식으로는 색을 바꾸질 않습니다.
이번에는 새로운 색이 카멜레온을 서서히 덮어가는 방식을 소개하겠습니다. 이 파트가 이번 장의 마지막 파트입니다. (문제점이 발생할텐데요 그건 다음 장에서 다룹니다.)
1. Chameleon 액터 블루프린트의 이벤트 그래프로 돌아오세요.
2. 이번엔 우클릭 검색을 해도 됩니다. Timeline(타임라인) 노드를 찾아서 만드세요. (Add Timeline으로 검색)
그리고 Parameter Name의 PreviousColor는 NewColor로 바꿔주세요. 마지막으로 아래와 같이 연결합니다.
3. Timeline 노드를 더블클릭하세요. 새로운 탭으로 이동할거예요.
4. 아래 그림에 표시된 버튼을 누르세요. Track(트랙)이라는 것이 하나 나올거예요.
5. NewTrack_0 이라는 이름을 Radius 로 바꿔준 다음 엔터를 누르세요.
지금 뭘 하는걸까요?
우리는 지금 카멜레온이 색을 바꿀 때, 새롭게 물드는 색의 영역이 점점 넓어지게 만드는 작업을 하는 중이에요. M_Chameleon 머티리얼 작업할 때 제가 얘기했듯이 우리는 머티리얼의 Radius 값을 이용해서 원의 크기를 조절할거예요.
일단 진행하면서 방법을 마저 보여드릴게요.
6. Radius 트랙 위에 우클릭을 해서 Add key to CurveFloat_1을 선택하세요. Key를 하나 만드는 거예요.
7. 아래와 같이 점같은 게 나와야 합니다.
8. Key(키)를 하나 더 만드세요. 처음 만드는 위치는 상관 없어요. 어차피 조절 할거예요.
Key는 원래 흰색 점이에요. 선택하면 주황색으로 표시가 됩니다.
9. 아무 Key를 하나 선택한 상태에서 Time과 Value를 각각 0으로 만드세요.
10. 다른 키를 선택해서 아래처럼 Time과 Value를 설정하세요. 각각 2.0과 5.0 입니다.
11. 두번째 키가 트랙 바깥으로 나가서 보이지 않을거예요. 이때는 아래 버튼을 한번씩 눌러주세요. 아래 두번째 그림처럼 나오게 됩니다.
트랙의 가로 세로 폭을 점의 위치에 맞게 바로 잡아주는 버튼들이에요.
12. 마지막으로 Length를 2.0으로 바꿔주세요.
13. Compile & Save 를 하세요.
14. Event Graph 탭으로 이동하세요.
15. Timeline 노드에 우리가 만든 Radius 핀이 생긴것을 확인하세요.
16. 이번엔 Plane 노드에서 핀을 뽑아 들고 검색할게요. Set Scalar Parameter Value on Materials 검색.
17. 새로 만든 Set Scalar Parameter Value on Materials 노드를 Timeline 노드의 Update와 연결짓고 Radius는 Parameter Value에 연결하세요. 아래처럼요.
18. Set Scalar Parameter Value on Materials 의 Parameter Name을 None에서 Radius로 바꾸세요.
19. Compile & Save를 하세요. 이제 그림으로 알려드리지 않아도 할 수 있을거라 믿습니다.
20. 테스트를 하겠습니다. 에디터 메인으로 나가서 플레이 버튼을 누르세요. 그 다음 카멜레온을 여러번 클릭(터치)해보세요.
노란색 카멜레온이 흰색으로 덮여지는 게 보이면 일단은 성공입니다.
# 여전히 부족해. 그게 뭘까?
이제 새로운 색으로 서서히 덮여지는 느낌은 납니다. 하지만 여전히 우리가 딱 원하는 기능은 아닌 것 같네요. 그 이유는 무엇이며 어떻게 해결할지는 다음 장에서 소개할게요. 여기까지 따라오시느라 수고하셨습니다.
'모바일 게임 개발 > [입문]브러쉬유' 카테고리의 다른 글
| 10. 브러쉬유: 카멜레온을 터치하면 일어나는 일(4) (0) | 2020.10.23 |
|---|---|
| 9. 브러쉬유: 카멜레온을 터치하면 일어나는 일(3) (0) | 2020.10.23 |
| 7. 브러쉬유: 카멜레온을 터치하면 일어나는 일(1) (0) | 2020.10.23 |
| 6. 브러쉬유: 카멜레온 머티리얼 완성하기 (0) | 2020.10.23 |
| 5. 브러쉬유: 카멜레온 만들기(3) (0) | 2020.10.23 |
