Graphics(4)-셰이더

simple_coding·2024년 4월 24일
0

셰이더 그래프(Shader graph)

Lit Shader graph 생성

좌측에 변수를 생성해 Fragment와 연결하면 인스펙터 창에 출력되어 입력이 가능하게 된다.

(인스펙터창에 기능이 추가된 모습)

레퍼런스 이름으로 컬러 찾기

 [SerializeField] Renderer renderer;

 public Color color;

 void Start()
 {
     //color = renderer.material.GetColor("_BaseColor");
     //renderer.material.SetColor("_BaseColor",color);
 }


Play 했을 때

color = renderer.material.GetColor("_BaseColor");

*결과

셰이더 컬러를 가져온다.

renderer.material.SetColor("_BaseColor",color);

*결과

스크립트 컬러를 셰이더에 적용한다.

이 때, RGBA값을 RGB만 지닌 BaseColor에 입력하기 때문에 A값이 생략된다.

변수 BaseColor를 Split으로 RGBA로 나눈 뒤 RGB는 Combine으로 다시 결합하여, 각각 Fragment의 Alpha와 BaseColor로 연결한다. 이로써 인스펙터에서 A값도 조절이 가능해진다.

오브젝트기준의 Position과 변수 Position을 Add로 결합하며 Vertex Position에 연결하면, 변수의 값에 따라 셰이더 위치가 변경된다.

x값에 +1했을 때

셰이더만 위치를 이동한 모습

이번엔 노멀벡터 방향을 value 값을 곱하고 오브젝트기준 위치에 더해준 경우다.

value 값을 증가시키면,

노멀벡터 방향으로 value값만큼 셰이더가 이동한다.

윤곽선

이전에 만든 그래프를 그대로 활용해서 윤곽선 표현하기(굴곡이 없는 직각오브젝트는 부적합)
value를 윤곽선의 두께로 사용

그래프를 적용한 셰이더를 대상 오브젝트에 추가

렌더러를 후면만 그려지게 했을 때,

다음처럼 value 값에 비례하는 두께를 가진 윤곽선이 표현된다.


*다른 모델 적용

등장효과

새롭게 Shader graph 생성하고 Texture2D변수를 Sample Textyre 2D를 거치며 컬러로 변환하여 Fragment에 연결한다. Metallic과 Emission도 같은 방식으로 적용할 수 있다.

Alpha Clipping을 체크해주면 Fragment에 Alpha와 Alpha Clip Threshold가 추가되는데, Alpha값이 Alpha Clip Threshold 설정 값보다 크면 그려주고, 낮으면 그리지 않는 방식이다.

Position에서 Split으로 Y값만 가져오고 Step에 연결한다. Step은 Value를 기준으로 보다 높으면 0, 낮으면 1로 양분해 주는 노드이다. 이 Step을 Alpha에 연결해준다.

이제 Value값을 높이거나 줄이면 다음 같은 표현이 가능하다.

profile
기록하는 것이 기억된다.

0개의 댓글