※ 현재 학습 중인 내용이므로 아직 완전하지 않은 내용일 수 있습니다.
내용에 대해서 피드백을 주시면 관련 내용 보완하여 작성하겠습니다.
11. 출력과 테스트 (2) : DebugValue 함수로 값 조회하기
※ 현재 학습 중인 내용이므로 아직 완전하지 않은 내용일 수 있습니다. 내용에 대해서 피드백을 주시면 관련 내용 보완하여 작성하겠습니다. 이번 포스팅에서는 머티리얼 값 연산을 조회할 수
wdnote.tistory.com
안녕하세요, 이번 포스팅에서는 11. 출력과 테스트(2) 편에 이어서 UV에서 값을 출력하는 방법에 대해서 알아보겠습니다.
Scala 값을 갖는 요소들에서 2차원, 3차원 값 없이 Gradient 형태인 모든 노드들은 DebugValue로는 값을 조회할 수 없었습니다.
그래서 방법이 없나 생각하고 찾던 중, PlotFunctionOnGraph 노드에 대해서 알게 되었습니다.
1. 원리 : Distance 노드
PlotFunctionOnGraph의 주요한 원리는 Distance노드를 이용하는 것입니다.
이 노드는 '거리'값을 반환하는 노드입니다.
-1과 1을 비교하면 2를 표시하는 원리를 갖고 있는데요.
만약 TexCoordinate 노드에서 G채널을 기준으로 1을 비교하게 되면, 출력이 어떻게 될까요?
0.5~ -0.5의 범위를 갖는 G채널을 가져와 Input(y)와 비교하면 왼쪽과 같은 결과가 나타납니다.
이와 마찬가지로
이와 마찬가지로 R채널을 기준으로 비교하면 위와 같은 그래프가 됩니다.
이렇듯, 그라디언트 영역으로 그래프의 위치를 그린 후(UV),
거리값으로 일치하는 영역만 남기고(Distance) → 반전시켜(1-x) → 나머지 소수점을 버리면(Floor) →
그래프로 나타낼 수 있는 것입니다.
※ 부연 설명 : Distance에서 0인값이 일치하는 값인 이유는 차이가 나지 않으므로 0이기 때문입니다. 혹시나 해서 적어둡니다.
2. 사용법 PlotFunctionOnGraph
2-1) 입력값과 출력값 설정
원리를 알았으니 이제 PlotFunctionOnGraph의 입력값과 출력값을 뜯어보겠습니다.
| 입력 핀 이름 (Input Pin Name) | 설명(Description) | 기본 값(Default Value) |
| X Range Y Range (V4) | 그래프 표현 범위를 설정합니다. | ( -1, 1, -1, 1 ) X축 : R ~ G Y축 : B ~ A |
| Gradient Height (S) | f(x)입력값의 프리뷰(preview) 영역의 높이를 설정합니다. | 0.2 |
| Show Grid?(B) | 좌표평면 격자 무늬의 출력 여부를 결정합니다. | True |
| UVs(V2) | 텍스트가 표시될 UV좌표를 설정합니다. | TexCoordinate(UV) |
| Thickness | f(x)입력값의 그래프 두께를 설정합니다. | 1.0 |
| Color | f(x)입력값의 그래프 색상을 설정합니다. | 2.0,0,0 |
| f(x) | 그래프로 출력하고 싶은 값을 입력합니다. | (연결된 노드가 없으면 에러) |
| 출력 핀 이름 (Output Pin Name) | 설명(Description) |
| f(x) = y | 그래프와 preview를 같이 출력합니다. |
| x | preview만 출력합니다. |
2-2) f(x)에 입력할 수 있는 요소들
- Sine 파와 Time
UV값에서 R채널만 추출하여 사인그래프를 만들 수 있고,
이 값에 시간입력값을 추가하여 Sine파를 지속해서 출력할수도 있습니다.
- 다양한 Gradient 값도 출력 가능.
선형(Linear), 방사형(Radial), 다이아몬드(Diamond) 그라디언트 형태도 그래프로 출력하여 살펴볼 수 있습니다.
- 텍스쳐 값도 출력 가능.
심지어는 텍스쳐 값도 조회가 가능합니다.
3.주의사항 : Gradient Height 시 오차 발생
그런데 이 머티리얼 함수에는 문제점이 하나 있습니다.
바로 Gradient Height 값이 있으면, 비율 유지를 위해 그래프의 양 폭이 좁아지면서
f(x)값이 배율에 맞춰 줄어들지 않고, 잘립니다.
0과 0.2일때의 값을 비교해보면 그 차이는 여실하게 드러납니다.
이 문제를 해결해보려고 이리저리 살펴봤었습니다만.. 잘 안되더라구요.
개인적으로는 출력 레벨에서 서로 따로 조회하는 것이 나은 선택이 아닐까 싶습니다.
추후 이 문제를 해결하게되면, 따로 포스팅으로 올려서 다루어 보도록 하겠습니다.
자 그럼 다음 포스팅에서 뵙겠습니다 ~ 읽어주셔서 감사합니다. ㅎㅎ
'Unreal5로 UI만들어보기 > 0) Material 다루기' 카테고리의 다른 글
| 13. 파라미터와 인스턴스로 모서리가 둥근 사각형 패널 만들기 (4) | 2023.03.10 |
|---|---|
| 11. 출력과 테스트 (2) : DebugValue 함수로 값 조회하기 (0) | 2023.03.08 |
| 10-1. 머티리얼 함수 (1) : UVMasking 함수 제작과 순서 (0) | 2023.03.06 |
| 9. 그래픽 요소 만들기 (1) 그라디언트와 IF로 도형 그리기 (0) | 2023.03.03 |
| 8. 텍스쳐 다루기 (2) 텍스쳐 회전(Rotate) 구현하기 (0) | 2023.03.02 |
