स्प्राइट को रेखांकित करता है


9

मैं वर्तमान में एक 2D गेम पर काम कर रहा हूं, और मेरा वर्तमान कार्य चयनित ऑब्जेक्ट को रेखांकित करना है।

मैं मूल रूप से इसे पूरी तरह से रनटाइम करने के लिए ब्लर शेडर का उपयोग करता हूं। मैं पहली बार एक ऊर्ध्वाधर गाऊसी ब्लर शेडर का उपयोग करके अपने स्प्राइट को आकर्षित करता हूं, फिर मैं इसे एक क्षैतिज गॉसियन ब्लर शेडर के साथ खींचता हूं, और फिर मैं अपने स्प्राइट को सामान्य रूप से खींचता हूं।

यहाँ मेरा धब्बा छायादार है: नमूना बनावट बनावट: रजिस्टर (s0);

#define SAMPLE_COUNT 15

float2 SampleOffsets[SAMPLE_COUNT];
float SampleWeights[SAMPLE_COUNT];


float4 PixelShaderFunction(float2 texCoord : TEXCOORD0) : COLOR0
{
    float4 c = 0;

    // Combine a number of weighted image filter taps.
    for (int i = 0; i < SAMPLE_COUNT; i++)
    {
        c += tex2D(TextureSampler, texCoord + SampleOffsets[i]) * SampleWeights[i];
    }

    return c;
}

SampleOffets वे राउंडिंग पिक्सेल हैं जो मुझे परीक्षण करने की अनुमति देते हैं। नमूना भार गॉसियन फ़ंक्शन ( http://en.wikipedia.org/wiki/Gaussian_blur ) के साथ गणना की जाती है।

यहाँ परिणाम है:

यहाँ छवि विवरण दर्ज करें

यह बुरा नहीं है, काफी चिकना है, लेकिन खेल में पर्याप्त दिखाई नहीं दे रहा है ... लेकिन मैं मोटाई (इसे बड़ा करने के लिए) को नियंत्रित करने में सक्षम होना चाहता हूं, और अल्फा में इसे बनाने से पहले पहली अपारदर्शी रूपरेखा जोड़ें। यह अधिक दिखाई देता है)। और मुझे लगता है कि गाऊसी धब्बा शायद उतना अच्छा नहीं है जितना मैंने अपने काम के लिए सोचा था :)

एक और विचार यह स्वचालित रूप से .png (इसे स्वचालित बनाने के लिए एक फ़ोटोशॉप स्क्रिप्ट का उपयोग करके) से उत्पन्न करना है। मुझे केवल एक कस्टम रंग के साथ आउटलाइन पिक्सल को भरने की जरूरत है, उदाहरण के लिए लाल घटक में अल्फा मान को संग्रहीत करना, और अन्य सभी घटकों को 0. पर सेट करना है। फिर मुझे सिर्फ एक shader को लागू करना होगा जो पारदर्शी पिक्सल को उस रंग में बदलना चाहता है जो मैं चाहता हूं।

float4 PixelShaderFunction2(float2 texCoord : TEXCOORD0) : COLOR0
{
    float4 color = tex2D(TextureSampler, texCoord);
    float4 newColor = 0;
    if (color.a == 0 && color.r != 0)
    {
        color.a = color.r;
        // Blue outline
        color.b = 1;
    }
}

समस्या यह है, मैं अपने स्प्राइट के लिए डीएक्सटी 5 संपीड़न का उपयोग कर रहा हूं, इसलिए मुझे यकीन नहीं हो सकता है कि जिस रंग को मैं अपनी छाया में प्राप्त करूंगा वह ठीक वैसा ही होगा जैसा मैंने लिखा था। यही कारण है कि मैं भी यह कोशिश नहीं की ... कोई विचार?

किसी भी सलाह का स्वागत किया जाएगा :)


आपको अपनी छाया में मोटाई और अल्फा ड्रॉप-ऑफ को नियंत्रित करने में सक्षम होना चाहिए। संदर्भ के लिए इसे पोस्ट करने की देखभाल करें?
सेठ बट्टिन

मैंने इस नमूने से गॉसियन ब्लर शेडर का उपयोग किया: लिंक मुझे अपनी पोस्ट को संपादित करने के लिए आपको विवरण में शेडर दिखाने के लिए
s0ubap

मुझे यकीन नहीं है कि गौसियन कलंक आपके लिए सही है। इसके बजाय कुछ रेडियल धुंधला होने की कोशिश करें।
user1306322

जवाबों:


6

आप जिस चीज की तलाश कर रहे हैं , वह आपके गॉसियन कलंक से पहले, बाद में या उसके बाद भी बढ़त का एक रूप है । शायद सोबेल एज डिटेक्शन का एक संस्करण काम कर सकता है। मुझे पता है कि आपका गेम 2 डी है लेकिन अगर विकी पेज बहुत मोटा है तो यहां एक ट्यूटोरियल है कि इसे यूडीके में कैसे काम करना है जो बेहतर अनुवाद कर सकता है।

यदि आपकी गति बढ़ाने की आवश्यकता है तो आपकी बढ़त का पता लगाने के लिए केवल अल्फा चैनल के किनारों को खोजना होगा।


दिलचस्प! मैं इसे करने की कोशिश की। परिणाम अच्छा था, सिवाय इसके कि जब मैं ज़ूम इन / आउट ... पिक्सेल दिखाई देते हैं और गायब हो जाते हैं, तो अवांछित कलाकृतियों के परिणामस्वरूप ...
s0ubap

1
आप किस तरह की कलाकृतियों को देख रहे हैं? क्या आप एक छवि प्रदान कर सकते हैं?
एलेक्स शेपर्ड

2

पाठ रूपरेखा के साथ मेरे लिए क्या काम किया गया था:

  • रूपरेखा रंग चुनें
  • बाह्यरेखा रंग के साथ (x-1, y-1) पाठ को ड्रा करें
  • बाह्यरेखा रंग के साथ (x + 1, y-1) पाठ को ड्रा करें
  • बाह्यरेखा रंग के साथ (x-1, y + 1) पाठ को ड्रा करें
  • बाह्यरेखा रंग के साथ (x + 1, y + 1) पाठ को ड्रा करें
  • पाठ (x, y) पर ड्रा करें

आप एक ही काम कर सकते हैं - आपको बस इतना करना है कि आप अपने आउटलाइन रंग से रंगे हुए अपारदर्शी पिक्सल के साथ स्प्राइट खींचें। (पारदर्शिता मूल्यों को बनाए रखें ताकि गोल किनारे अभी भी गोल दिखें)।

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


1

मैं इस सब के लिए नया हूँ, लेकिन यहाँ मेरा विचार है:

आप एक और बनावट बनाने के लिए अपनी बनावट के अल्फा चैनल का उपयोग कर सकते हैं। थ्रेशोल्ड मान के नीचे कोई भी अल्फा मान पूरी तरह से पारदर्शी पर सेट किया जाएगा। ऊपर कोई भी पूरी तरह से अपारदर्शी होगा। इस नई बनावट का उपयोग करके, आप किसी भी रंग को पसंद करने के लिए RGB के मान सेट कर सकते हैं। अपने चरित्र की बनावट से थोड़ा बड़ा होने के लिए इस नई "बनावट" को स्केल करें। यह आपको चरित्र के चारों ओर एक अच्छा ठोस रंग देगा। फिर अपनी बनाई बनावट के आसपास अच्छी रूपरेखा देने के लिए अपने गाऊसी शेड के साथ उस रंग का उपयोग करें। मुझे लगता है कि यह एक और बनावट बनाने के बिना किया जा सकता है, और चरित्र बनावट के आधार पर सभी shader हो।

क्या यह बिल्कुल समझ में आता है?


गैर-अवतल आकृतियों के साथ काम करते समय इस पद्धति का एक प्रमुख दोष है। उदाहरण के लिए, डोनट पर लागू होने पर केवल बाहरी छोर को एक रूपरेखा मिलेगी। अन्य रूपरेखा मोटाई विकृतियों का उल्लेख नहीं करना।
क्रॉमास्टर
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.