본문 바로가기
Shader CG

기초 2. 기본 색상 출력 해보기

by SimonLee 2023. 6. 28.

opengl 기본지식과 Unity를 다뤄본 사람 수준정도면 이해할수 있는 수준으로 작성 할 것 입니다.

 

Unity Shader 작성방법은 3가지가 있습니다.

  • Shader Lab.
  • Surface Shader
  • Vertex & Fragment Shader

 

조금 어렵지만 자유롭게 Customize가 가능한 3번째 방법으로 코드를 작성할 예정입니다.

 

기본 Unity 설정 방법

따라해 봅시다.

Text로만 따라하기 힘든 분들을 위해서 영상으로 제작 예정입니다.^^~

 

 

1) Quad를 만들고, Scale을 키운다.

- 3D Object -> Quad 클릭

- Quad Object 클릭 -> Transform Scale --> x, y, z  5 이상으로 설정.

 

2) Camera 설정 및 Transform 설정

- Position Z value를 -1로 설정하여 

- 2D 처럼 보기 위하여 Projection을 Orthographic으로 설정한다.

-

3) Material을 생성후 Quad의 MeshRenderer --> Material로 Attach 해준다.

 

4) Project 탭에서 Create -> Shader -> Unlit Shader를 생성한다.

 

5) Material클릭 하고 생성한 Unlit Shader로 설정한다.

 

6) 생성한 Shader Code를 수정한다.

- 아래 Shader 코드를 복사해서 붙여 넣어보자.

 

아래 코드는 0장에서 언급한

Shader Lab 기반의 코드 + Fragment Shader 구조 입니다.

Properties, SuabShader 복잡해 보이지만 일단 그대로 복붙해서 사용 하시고

Pass { } 괄호 안에 CG를 작성해주시면 됩니다.

Shader "SimonLee/Shader1Unlit"
{
    Properties
    {
    }

    SubShader
    {
        Tags { "RenderType" = "Opaque" }
        LOD 100

        Pass
        {
            CGPROGRAM
            #pragma vertex vert_img
            #pragma fragment frag

            #include "UnityCG.cginc"
            

            fixed4 frag(v2f_img i) : SV_Target
            {
                return fixed4(0, 0, 1, 1);
            }
            ENDCG
        }
    }
}

 

Grammar

Shader  " SimonLee/Shader1Unlit" 

- Shader Name을 설정합니다.

- Unity Material에서 Shader를 선택할 수 가 있습니다.

 

Tags { " renderType = " Opaque " }

- 투명도 없이 오브젝트를 불투명하게 렌더링 합니다.

 

Pass

- 모 든 픽셀마다 거쳐가는 파이프 라인으로 생각하시면 됩니다.

- 2 Pass 경우, 모든 픽셀이 파이프 라인을 두번 거쳐 가고, Pass block을 추가 하면 됩니다.

- 파이프 라인 : Vertex shader --> rasteriazation --> Fragment shader --> output merger

 

CGPROGRAM ~ ENDCG

- CG block의 시작지점과 끝 지점을 나타 냅니다. 모든 CG 코드는 해당 block 내부에 있어야 합니다.

 

#pragma vertex vert_img

- vertex shader를 vert_img 함수로 사용하겠다 의미 입니다.

- vert_img 함수가 해당 코드에 존재 하지 않고, UnityCG.cginc 파일안에 존재 합니다.

 

#pragma fragment frag

- fragment shader를 frag 함수로 사용하겠다 의미 입니다.

 

fixed4 frag(v2_img i) : SV_Target

- 프래그 먼트 쉐이더의 함수 정의 부분입니다.

- 여기서 리턴형이 fixed4면 float 4개의 struct 형태 이기 때문에, fixed4(0,0,1,1) (파랑색 불투명)을 리턴 합니다.

- 함수인자 v2f_img는 vertex shader 리턴 값으로 부터 전달 받습니다.

 

코드에 존재하지 않는 vert_img 함수는 다음 경로에 존재 합니다.

- Program Files\Unity\Hub\Editor\2021.2.19f1\Editor\Data\CGIncludes\UnityCG.cginc

struct v2f_img
{
    float4 pos : SV_POSITION;
    half2 uv : TEXCOORD0;
    UNITY_VERTEX_INPUT_INSTANCE_ID
    UNITY_VERTEX_OUTPUT_STEREO
};

...

v2f_img vert_img( appdata_img v )
{
    v2f_img o;
    UNITY_INITIALIZE_OUTPUT(v2f_img, o);
    UNITY_SETUP_INSTANCE_ID(v);
    UNITY_INITIALIZE_VERTEX_OUTPUT_STEREO(o);

    o.pos = UnityObjectToClipPos (v.vertex);
    o.uv = v.texcoord;
    return o;
}

해당 함수의 리턴 값은 v2f_img type 입니다.

struct v2f_img를 보면 position 정보와 texture uv, 값을 전달하고 있네요. 

이 정보를 fragment shader에서 사용할수 있지만,

사용하지 않고 모든 픽셀은 파랑색으로 출력하도록 되어 있습니다.

 

마지막으로 SV_Target가 뭐냐구요?

뭔가 상속처럼 생겼는데, SV_Target은 함수의 호환성을 위한 Semantic 정도로 알고 계시면 될 것 같습니다.

DX 계열의 Version이 달라지거나, 다른 종류의 Shader Language의 경우라도 Shader 코드를 동작하기 위해

컴파일러들은 Semantic word를 다른 graphic api 계열에 맞도록 교체 하는 코드가 있다고 하네요.

'Shader CG' 카테고리의 다른 글

1.2 도형 - Draw Rectangle - 1  (0) 2023.07.09
1.1 도형 - draw Circle  (0) 2023.07.09
기초 3. 블렌딩 해보자 (step, smoothstep)  (0) 2023.07.06
기초 2. 블렌딩 해보자  (0) 2023.07.05
기초 1. Shader 배워보자.  (0) 2023.07.05