XNA ड्रा: एक शेडर का उपयोग करके तीन स्रोतों को आस्थगित प्रकाश लिखें

हब्रवचम को नमस्कार!

बहुत समय पहले मैंने हबर को नहीं लिखा था: अध्ययन, सत्र आ रहा है, आप समझते हैं। आज मैं तीन प्रकाश स्रोतों में सामान्य मानचित्रण का उपयोग करके XNA में आस्थगित प्रकाश व्यवस्था (विलंबित प्रकाश) को लागू करने का तरीका बताने की कोशिश करूँगा, जबकि हम Reach प्रोफ़ाइल और Shader मॉडल 2.0 का उपयोग करेंगे।
मुझे याद दिलाने से पहले, हम पहले से ही shaders के विषय पर छुआ: यहाँ । बाकी कटौती, वीडियो और डेमो के तहत है।







इस भाग में:

• डिफर्ड लाइटिंग क्या है
• सामान्य मानचित्रण क्या है?
• कार्यान्वयन, एक shader का कनेक्शन
• पिक्सेल शैडर कार्यान्वयन

सिद्धांत

एक ही समय में तीन प्रकाश स्रोत क्यों? शेडर्स की सीमाएं हैं: शेडर मॉडल 2.0 में , एक ही शेडर पास में 64 से अधिक अंकगणितीय ऑपरेशन नहीं हो सकते हैं। एक पास में तीन से अधिक के प्रकाश स्रोतों का उपयोग करने के लिए - शेडर मॉडल 3.0 की आवश्यकता है, यह 512 अंकगणितीय संचालन का समर्थन करता है, लगभग ~ 30 स्रोत प्रति पास। लेकिन मॉडल 3.0 के लिए, आपको एक छिपाने वाली प्रोफ़ाइल की आवश्यकता है, और इसके लिए डायरेक्टएक्स 10-उपयुक्त ग्राफिक्स कार्ड की आवश्यकता है। इसलिए, हम खुद को तीन स्रोतों तक सीमित रखते हैं (और इससे भी अधिक, जो कई स्रोतों में ड्राइंग स्रोतों को रोकता है? इसलिए, तीन स्रोत केवल एक shader की सीमा है, इस लेख में हम केवल एक पास पर विचार करेंगे)।

वैसे, shader मॉडल की तुलना:



अधिक विवरण यहां पाया जा सकता है ।

दूसरे मॉडल के पिक्सेल शेड्स की सीमाएँ छँटनी लगती हैं।

अब एक और अजीब शब्द देखें: " आस्थगित प्रकाश व्यवस्था ( आस्थगित प्रकाश व्यवस्था )।"

स्थगित प्रकाश

मानक प्रकाश विधियों से आस्थगित प्रकाश व्यवस्था और छायांकन के बीच मुख्य अंतर यह है कि ये विधियाँ तुरंत शेडर के परिणाम को रंगीन फ्रेमबफ़र पर लिखती हैं।

यदि यह व्याख्या करना बहुत सरल है, तो हम प्रकाश स्रोत से सभी पिक्सेल को गिनते हैं और तुरंत इसे फ्रेमबफ़र पर लिखते हैं, हमारे मामले में फ्रेमबफ़र के लिए चार रकम होगी (परिवेश + तीन स्रोतों का परिणाम)

बहुत संक्षेप में, जो आस्थगित प्रकाश व्यवस्था है जिसे हमने समझ लिया है, यह समझना बाकी है कि किस प्रकार की सामान्य मैपिंग है।

सामान्य मानचित्रण

आम लोगों में भी जाना जाता है, बनावट मानदंडों का एक नक्शा है, जो अभी भी सोचते हैं: सामान्य सतह के लंबवत है।

आइए देखें कि आप इसके साथ क्या जीत सकते हैं। मैं सामान्य मानचित्र का उपयोग करके और बिना प्रकाश व्यवस्था का एक उदाहरण दूंगा। और फिर मैं समझाता हूं कि यह कैसे काम करता है।

इस तरह से प्रकाश का उपयोग किए बिना हमारा दृश्य दिखता है:


इसी तरह से हमारा दृश्य प्रकाश का उपयोग करते हुए (सामान्य मैपिंग का उपयोग किए बिना) दिखता है:


इसी तरह से हमारा दृश्य प्रकाश (सामान्य मैपिंग का उपयोग करके) दिखता है:


जैसा कि आप देख सकते हैं, परिणाम चेहरे पर है, सामान्य मानचित्रण वाला दृश्य ऐसा है जैसे कि "स्वैच्छिक" और अधिक यथार्थवादी दिखता है, विशेष रूप से गतिशीलता में (प्रकाश स्रोतों की गति के साथ)।
आइए हम खुद बनावट पर एक नज़र डालें।

बनावट खुद ( रंग नक्शा ):



सामान्य बनावट ( सामान्य नक्शा ):



दूसरी बनावट पर, आपको तुरंत समझ में नहीं आया कि क्या है, विस्थापन shader के बारे में लेख याद रखें? वहाँ हम R, G चैनल के माध्यम से एक पिक्सेल को मोड़ने के बारे में जानकारी प्रसारित करते हैं, और यहाँ, हम R, G, B, अर्थात् का उपयोग करते हुए मानदंडों पर जानकारी प्रसारित करते हैं। आर = एक्स, जी = वाई, बी = जेड। और पहले से ही शेडर में, हम प्रकाश, सरल, सही की गणना में एक्स, वाई, जेड के साथ काम करते हैं?

और अगर पाठक को कुछ भी समझ में नहीं आया, तब भी जब उसने पहली बार सामान्य शब्द को देखा और उसके लिए स्पष्टीकरण प्राप्त किया, तो सामान्य मानचित्र का उपयोग करते हुए, बनावट को प्रकाश व्यवस्था के लिए 3 डी प्रतिनिधित्व मिलता है।

और हां, एक सामान्य नक्शा बनाने के बारे में, उन्हें खींचना व्यावहारिक रूप से असंभव है , उन्हें या तो हाई-पॉली मॉडल से हटा दिया जाता है या स्वयं बनावट से उत्पन्न होता है (उदाहरण के लिए, फ़ोटोशॉप प्लग के साथ)।

हम सिद्धांत को थोड़ा समझ लेते हैं, आइए कोड के साथ यह सब लागू करने की कोशिश करते हैं।

अभ्यास

यहां मैं पहले से ही टिप्पणियों के साथ कोड के टुकड़े दे दूंगा।
एक प्रकाश स्रोत दृश्य बनाएँ, लाइटमिटर वर्ग:

public class LightEmmiter { //      : X, Y, Z public Vector3 position; //   public Vector3 color; //   (  — ) public float corrector; //   public float radius; //       internal void UpdateEffect(EffectParameter effectParameter) { effectParameter.StructureMembers["position"].SetValue(position); effectParameter.StructureMembers["color"].SetValue(color * corrector); effectParameter.StructureMembers["invRadius"].SetValue(1f / radius); } } 

अब हम Game1 (मुख्य वर्ग) के साथ काम करते हैं:
चर बनाएं:

 Texture2D texture; // Color  ( ) Texture2D textureNormal; // Normal  private Effect deferred; //  SpriteFont spriteFont; // ,   Debug- EffectParameter lightParameter; //     private float lightRadius; //     private float lightZ; //   Z-  private float lightC; //     LightEmmiter[] lights = new LightEmmiter[2]; //   

अब यह सभी LoadContent मेथड में इनिशियलाइज़ किया गया है:

 texture = Content.Load<Texture2D>("test1"); //   textureNormal = Content.Load<Texture2D>("test1_map"); //   deferred = Content.Load<Effect>("deferred"); //   spriteFont = Content.Load<SpriteFont>("default"); //   lightRadius = 320f; //    lightZ = 50f; //   Z- lightC = 1f; //    lights[0] = new LightEmmiter(); lights[0].position = new Vector3(20, 30, 0); lights[0].radius = lightRadius; lights[0].corrector = lightC; lights[0].color = new Vector3(1f, 0f, 0f); lights[1] = new LightEmmiter(); lights[1].position = new Vector3(20, 30, 0); lights[1].radius = lightRadius; lights[1].corrector = lightC; lights[1].color = new Vector3(1f, 1f, 1f); 

अपडेट स्वयं बनाएं :

 //     RenderTarget —  GraphicsDevice.Clear(Color.LightSkyBlue); GraphicsDevice.SetRenderTarget(null); //     lights[0].position = new Vector3(Mouse.GetState().X, Mouse.GetState().Y, lightZ); lights[0].radius = lightRadius; lights[0].corrector = lightC; lights[1].position = new Vector3(800 - Mouse.GetState().X, 480 - Mouse.GetState().Y, lightZ); lights[1].radius = lightRadius; lights[1].corrector = lightC; //   deferred.CurrentTechnique = deferred.Techniques["Deferred"]; //    deferred.Parameters["screenWidth"].SetValue(GraphicsDevice.Viewport.Width); deferred.Parameters["screenHeight"].SetValue(GraphicsDevice.Viewport.Height); deferred.Parameters["ambientColor"].SetValue(new Vector3(1, 1, 1) * 0.1f); deferred.Parameters["numberOfLights"].SetValue(2); deferred.Parameters["normaltexture"].SetValue(textureNormal); //    lights-   lightParameter = deferred.Parameters["lights"]; //  lights-    for (int i = 0; i < lights.Length; i++) { LightEmmiter l = lights[i]; l.UpdateEffect(lightParameter.Elements[i]); } //   (   ) foreach (EffectPass pass in deferred.CurrentTechnique.Passes) { spriteBatch.Begin(SpriteSortMode.Immediate, BlendState.Opaque, SamplerState.LinearClamp, DepthStencilState.None, RasterizerState.CullCounterClockwise); pass.Apply(); spriteBatch.Draw(texture, new Rectangle(0, 0, 800, 480), Color.White); spriteBatch.End(); } //  Debug- spriteBatch.Begin(SpriteSortMode.Deferred, BlendState.NonPremultiplied, SamplerState.LinearClamp, DepthStencilState.None, RasterizerState.CullCounterClockwise, null); //800 480 spriteBatch.DrawString(spriteFont, "lightRadius: " + lightRadius + "\nlightCorrector: " + lightC + "\nligthZ: " + lightZ, new Vector2(10, 10), Color.LightYellow); spriteBatch.End(); 

सब, सबसे महत्वपूर्ण बात छोड़ दिया, deferred.fx shader बनाएँ, लिस्टिंग:

 //   ,   struct Light { float3 position; float3 color; float invRadius; }; //   texture normaltexture; // -      3-  int numberOfLights; Light lights[3]; //   float3 ambientColor; // ,   float screenWidth; float screenHeight; //  Color- () sampler ColorMap : register(s0); //  Normal- sampler NormalMap : samplerState { Texture = normaltexture; MinFilter = Linear; MagFilter = Linear; AddressU = Clamp; AddressV = Clamp; }; //      float3 CalculateLight(Light light, float3 normal, float3 pixelPosition) { //  float3 direction = light.position - pixelPosition; float atten = length(direction); direction /= atten; //      float amount = max(dot(normal, direction), 0); atten *= light.invRadius; //  ,  modifer       ,         float modifer = max((1 - atten), 0); //     return light.color * modifer * amount; } float4 DeferredNormalPS(float2 texCoords : TEXCOORD0) : COLOR { float4 base = tex2D(ColorMap, texCoords); //    color-   texCoords float3 normal = normalize(tex2D(NormalMap, texCoords) * 2.0f - 1.0f); //   X,Y,Z  -   texCoords     : -1, 1. //    float3 pixelPosition = float3(screenWidth * texCoords.x, screenHeight * texCoords.y,0); //  - float3 finalColor = 0; for (int i=0;i<numberOfLights;i++) { //          finalColor += CalculateLight(lights[i], normal, pixelPosition); } //   ,  *     ,  multiply          return float4((ambientColor + finalColor) * base.rgb, base.a); } technique Deferred { pass Pass0 { PixelShader = compile ps_2_0 DeferredNormalPS(); } } 

बस इतना ही, इस लेख में - मैं आपको यह नहीं बताऊंगा कि कई शेड पासों से अनंत प्रकाश स्रोतों को कैसे लागू किया जाए, आप इसे स्वयं कर सकते हैं;)

प्रकाश प्रदर्शन वीडियो:


डेमो (exe) से लिंक करें: यहां ।
स्रोतों से लिंक (परियोजना, वीएस2010): यहां ।

इसके अलावा, मैं सामग्री का विश्लेषण करने और एक साफ कुंवारी पथ की ओर इशारा करने में मदद के लिए, लज़ीज़शेयर के लिए विशेष आभार व्यक्त करना चाहूंगा ।

सौभाग्य;)