Microsoft MVP성태의 닷넷 이야기
글쓴 사람
정성태 (techsharer at outlook.com)
홈페이지
첨부 파일
 
(연관된 글이 1개 있습니다.)
(시리즈 글이 13개 있습니다.)
Graphics: 2. Unity로 실습하는 Shader
; https://www.sysnet.pe.kr/2/0/11607

Graphics: 3. Unity로 실습하는 Shader (1) - 컬러 반전 및 상하/좌우 뒤집기
; https://www.sysnet.pe.kr/2/0/11608

Graphics: 4. Unity로 실습하는 Shader (2) - 고로 셰이딩(gouraud shading) + 퐁 모델(Phong model)
; https://www.sysnet.pe.kr/2/0/11609

Graphics: 5. Unity로 실습하는 Shader (3) - 고로 셰이딩(gouraud shading) + 퐁 모델(Phong model) + Texture
; https://www.sysnet.pe.kr/2/0/11610

Graphics: 6. Unity로 실습하는 Shader (4) - 퐁 셰이딩(phong shading)
; https://www.sysnet.pe.kr/2/0/11611

Graphics: 7. Unity로 실습하는 Shader (5) - Flat Shading
; https://www.sysnet.pe.kr/2/0/11613

Graphics: 8. Unity Shader - Texture의 UV 좌표에 대응하는 Pixel 좌표
; https://www.sysnet.pe.kr/2/0/11614

Graphics: 9. Unity Shader - 전역 변수의 초기화
; https://www.sysnet.pe.kr/2/0/11616

Graphics: 10. Unity로 실습하는 Shader (6) - Mosaic Shading
; https://www.sysnet.pe.kr/2/0/11619

Graphics: 11. Unity로 실습하는 Shader (7) - Blur (평균값, 가우스, 중간값) 필터
; https://www.sysnet.pe.kr/2/0/11620

Graphics: 12. Unity로 실습하는 Shader (8) - 다중 패스(Multi-Pass Shader)
; https://www.sysnet.pe.kr/2/0/11628

Graphics: 13. Unity로 실습하는 Shader (9) - 투명 배경이 있는 텍스처 입히기
; https://www.sysnet.pe.kr/2/0/11631

Graphics: 19. Unity로 실습하는 Shader (10) - 빌보드 구현
; https://www.sysnet.pe.kr/2/0/11641




Unity로 실습하는 Shader (3) - 고로 셰이딩(gouraud shading) + 퐁 모델(Phong model) + Texture

지난 글에 만든 고로 셰이딩에,

Unity로 실습하는 Shader (2) - 고로 셰이딩(gouraud shading) + 퐁 모델(Phong model)
; https://www.sysnet.pe.kr/2/0/11609

Texture를 연결해 보겠습니다. 이를 위해 Properties에 Texture 정의를 하나 추가하고,

Properties
{
    _MainTex("Texture", 2D) = "white" {}
}

texture 용 UV 좌표도 포함한 후,

sampler2D _MainTex;

struct appdata
{
    float4 vertex : POSITION;
    float3 normal : NORMAL;
    float2 uv : TEXCOORD0;
};

struct v2f
{
    float4 vertex : SV_POSITION;
    float4 illumination : COLOR0;
    float2 uv : TEXCOORD0;
};

pixel shader에서 다음과 같이 texture 색상과 빛을 조합할 수 있습니다.

fixed4 frag (v2f i) : SV_Target
{
    fixed4 col = tex2D(_MainTex, i.uv);
    float4 color = col * i.illumination;

    return color;
}

위의 상태에서 테스트하면 다음과 같은 결과를 얻을 수 있습니다.

gouraud_light_texture_1.png

좌측은 gouraud shader를 적용한 것이고 우측은 단순 texture만 씌운 것입니다. 오히려 좀 어두워진 것 같은데요. (물론, 계수를 조정해 주면 밝게 만들 수 있습니다.) 그런데 검색해 보면, 원래 texture 색상에 적용하는 것은 주변광과 확산광이라고 합니다. 그래서 pixel shader 측에 "주변광 + 확산광"한 값과 반사광 값을 분리해서 보내주고,

struct v2f
{
    float4 vertex : SV_POSITION;
    float4 diffuse : COLOR0;
    float4 specular : COLOR1;
    float2 uv : TEXCOORD0;
};

v2f vert (appdata v)
{
    v2f o;
    
    // ...[생략]...

    o.diffuse = float4(ambientReflection + diffuseReflection, 1.0);
    o.specular = float4(specularReflection, 1.0);

    return o;
}

pixel shader에서 texture에 주변광과 확산광만 곱하고 반사광은 더해 주면,

fixed4 frag (v2f i) : SV_Target
{
    fixed4 col = tex2D(_MainTex, i.uv);

    float4 color = col * i.diffuse + i.specular;
    return color;
}

반사광의 효과가 더 나오는 것을 볼 수 있습니다.

gouraud_light_texture_2.png

다음은 이번 실습에서 사용한 shader의 전체 소스입니다.

Shader "My/gouraudShader"
{
    Properties
    {
        _MainTex("Texture", 2D) = "white" {}
        _Ka("Ambient Reflectance", Float) = 1.0
        _Color("Main Color", Color) = (1.0, 1.0, 1.0, 1.0)
    }
    SubShader
    {
        Pass
        {
            Tags{ "LightMode" = "ForwardBase" }

            CGPROGRAM
            #pragma vertex vert
            #pragma fragment frag

            #include "UnityCG.cginc"
            #include "Lighting.cginc"

            uniform float _Ka;
            float4 _Color;

            sampler2D _MainTex;

            struct appdata
            {
                float4 vertex : POSITION;
                float3 normal : NORMAL;
                float2 uv : TEXCOORD0;
            };

            struct v2f
            {
                float4 vertex : SV_POSITION;
                float4 diffuse : COLOR0;
                float4 specular : COLOR1;
                float2 uv : TEXCOORD0;
            };

            v2f vert (appdata v)
            {
                v2f o;
                o.vertex = UnityObjectToClipPos(v.vertex);
                o.uv = v.uv;
                
                // 주변광
                float4 ambientReflection = _Ka * UNITY_LIGHTMODEL_AMBIENT;

                // 확산광
                float3 worldNormal = UnityObjectToWorldNormal(v.normal);
                float3 lightDir = normalize(_WorldSpaceLightPos0); /* float4 _WorldSpaceLightPos0; */
                float3 diffuseReflection = 1.0 * _LightColor0.rgb * saturate(dot(worldNormal, lightDir));

                // 반사광
                float3 reflectedDir = reflect(-lightDir, worldNormal);
                float3 viewDir = normalize(_WorldSpaceCameraPos - worldNormal); /* float3 _WorldSpaceCameraPos; */
                float reflectIntensity = saturate(dot(reflectedDir, viewDir));

                float n = 4.0;
                reflectIntensity = pow(reflectIntensity, n);
                float3 specularReflection = 1.0 * _LightColor0 * reflectIntensity;

                o.diffuse = float4(ambientReflection + diffuseReflection, 1.0);
                o.specular = float4(specularReflection, 1.0);

                return o;
            }

            fixed4 frag (v2f i) : SV_Target
            {
                fixed4 col = tex2D(_MainTex, i.uv);

                float4 color = col * i.diffuse + i.specular;
                return color;
            }
            ENDCG
        }
    }
}




[이 글에 대해서 여러분들과 의견을 공유하고 싶습니다. 틀리거나 미흡한 부분 또는 의문 사항이 있으시면 언제든 댓글 남겨주십시오.]

[연관 글]






[최초 등록일: ]
[최종 수정일: 8/3/2018]

Creative Commons License
이 저작물은 크리에이티브 커먼즈 코리아 저작자표시-비영리-변경금지 2.0 대한민국 라이센스에 따라 이용하실 수 있습니다.
by SeongTae Jeong, mailto:techsharer at outlook.com

비밀번호

댓글 작성자
 




... 76  77  78  [79]  80  81  82  83  84  85  86  87  88  89  90  ...
NoWriterDateCnt.TitleFile(s)
11674정성태8/29/201813052Phone: 12. Xamarin - 기존 리모컨 기능을 핸드폰의 적외선 송신으로 구현파일 다운로드1
11673정성태8/28/201810651오류 유형: 480. Fritzing 실행 시 Ordinal Not Found 오류
11672정성태8/28/201811046오류 유형: 479. 윈도우 - 시스템 설정에서 도메인 참가를 위한 "Change" 버튼이 비활성화된 경우
11671정성태8/28/201816889사물인터넷: 39. 아두이노에서 적외선 송신기 기본 사용법파일 다운로드1
11670정성태8/28/201814851사물인터넷: 38. 아두이노에서 적외선 수신기 기본 사용법 [1]파일 다운로드1
11669정성태8/24/201813598개발 환경 구성: 394. 윈도우 환경에서 elasticsearch의 한글 블로그 검색 인덱스 구성
11668정성태8/24/201824340오류 유형: 478. 윈도우 업데이트(KB4458842) 이후 SQL Server 서비스 시작 오류
11667정성태8/24/201812551오류 유형: 477. "Use Unicode UTF-8 for worldwide language support" 옵션 설정 시 SQL Server 2016 설치 오류 [1]
11666정성태8/22/201812344사물인터넷: 37. 아두이노 - 코딩으로 대신하는 오실레이터 회로의 소리 출력파일 다운로드1
11665정성태8/22/201813923사물인터넷: 36. 오실레이터 회로 동작을 아두이노의 코딩으로 구현하는 방법파일 다운로드1
11664정성태8/22/201813702개발 환경 구성: 393. 윈도우 환경에서 elasticsearch의 한글 형태소 분석기 설치 [1]
11663정성태8/22/201816145개발 환경 구성: 392. 윈도우 환경에서 curl.exe를 이용한 elasticsearch 6.x 기본 사용법
11662정성태8/21/201811331사물인터넷: 35. 병렬 회로에서의 커패시터파일 다운로드1
11661정성태8/21/201812984사물인터넷: 34. 트랜지스터 동작 - 컬렉터-이미터 간의 저항 측정파일 다운로드1
11660정성태8/19/201811959사물인터넷: 33. 세라믹 커패시터의 동작 방식파일 다운로드1
11659정성태8/19/201811540사물인터넷: 32. 9V 전압에서 테스트하는 PN2222A 트랜지스터파일 다운로드1
11658정성태8/18/201814653사물인터넷: 31. 커패시터와 RC 회로파일 다운로드3
11657정성태8/18/201812754사물인터넷: 30. 릴레이(Relay) 제어파일 다운로드3
11656정성태8/16/20189844사물인터넷: 29. 트랜지스터와 병렬로 연결한 LED파일 다운로드1
11655정성태8/16/201811448사물인터넷: 28. 저항과 병렬로 연결한 LED파일 다운로드1
11654정성태8/15/201811977사물인터넷: 27. 병렬 회로의 저항, 전압 및 전류파일 다운로드1
11653정성태8/14/201812916사물인터넷: 26. 입력 전압에 따른 LED의 전압/저항 변화 [1]파일 다운로드1
11652정성태8/14/201810988사물인터넷: 25. 컬렉터 9V, 베이스에 5V와 3.3V 전압으로 테스트하는 C1815 트랜지스터파일 다운로드1
11651정성태8/14/201815487사물인터넷: 24. 9V 전압에서 테스트하는 C1815 트랜지스터 [1]파일 다운로드3
11650정성태8/14/201810629사물인터넷: 23. 가변저항으로 분압파일 다운로드1
11649정성태8/12/201812485사물인터넷: 22. 저항에 따른 전류 테스트파일 다운로드1
... 76  77  78  [79]  80  81  82  83  84  85  86  87  88  89  90  ...