मैं कई 2D स्पॉटलाइट कैसे बनाऊं?


12

मैं एक 2 डी "स्पॉटलाइट" प्रभाव बनाने के लिए देख रहा हूं जो कई संस्थाओं पर स्पॉटलाइट की अनुमति देता है। यानी, जैसे कि कई स्प्राइट मशालें पकड़े हुए थे। एक इकाई (एक स्पॉटलाइट) के लिए, मैं एक तकनीक का उपयोग करता हूं जहां मैं एक ढाल स्प्राइट को ओवरले करता हूं और उस इकाई का केंद्र बिंदु पीछा करता हूं। यह तकनीक एकल स्पॉटलाइट के लिए ठीक काम करती है। यहाँ स्क्रीनशॉट के बारे में बताया गया है कि मैं किस बारे में बात कर रहा हूँ:

एकल स्पॉटलाइट - काम करता है

स्पॉटलाइट एक स्पॉटलाइट के साथ प्रभाव

मैं जिस समस्या को चलाता हूं वह यह है कि यह तकनीक कई संस्थाओं तक नहीं पहुंचती है। यदि मैं एक और स्पॉटलाइट छवि को ओवरले करता हूं तो मैं कई समस्याओं में चला जाता हूं। यहाँ एक नकली स्क्रीनशॉट है:

मल्टीपल स्पॉटलाइट्स = समस्याएं

स्पॉटलाइट दो स्पॉटलाइट के साथ प्रभाव

सबसे स्पष्ट समस्या दृश्य कोनों है। यह पूरे स्तर को कवर करने के लिए स्पॉटलाइट इमेज को विशाल बनाकर हल किया जा सकता है, लेकिन यह सही नहीं लगता है। दूसरी और अधिक स्पष्ट समस्या यह है कि मैं इस तकनीक के साथ अंधेरे को प्रभावी ढंग से बढ़ा रहा हूं। इसलिए प्रत्येक स्प्राइट जोड़ा पर हर किसी को काला करने का प्रभाव पड़ता है। स्पष्ट रूप से मैं इस समस्या को गलत तरीके से ले रहा हूं।

कोई विचार?


निरंतर प्रयास

टिप्पणियों में सम्मिश्रण विकल्पों की कुछ चर्चा हुई है। यहां मेरी वर्तमान सोच है। ऊपर मेरे एकल स्पॉटलाइट उदाहरण में, मैं एक छवि फ़ाइल का उपयोग करता हूं जो कुछ इस तरह दिखाई देती है: (मैंने इसे बदलने में आसान बनाने के लिए पारदर्शिता को हरे रंग के साथ बदल दिया है)

पारदर्शिता दृष्टिकोण

जैसा कि ऊपर चर्चा की गई है, समस्या यह है कि अल्फा इस छवि को किसी अन्य छवि के साथ मिश्रित करने से वांछित प्रभाव उत्पन्न नहीं होने वाला है। इसके बजाय यह इसका उत्पादन करेगा:

दो पारदर्शिता हलकों को ओवरले करना

यह एक सम्मिश्रण विकल्प समस्या के रूप में मुझ पर प्रहार नहीं करता है। यह समस्या मुझे यह प्रतीत होती है कि इस तरह की छवि में पारदर्शिता मुखौटा और छवि (एक काला वर्ग) है, जब उन्हें अलग किया जाना चाहिए।

इसलिए बिल्ट-इन ट्रांसपेरेंसी वाली ब्लैक इमेज के बजाय, मुझे पारदर्शिता मास्क का उपयोग करना चाहिए जो कि ब्लैक स्क्वायर के खिलाफ रन टाइम पर उपयोग किए जाते हैं। ऐसा करते समय, मैं अभी भी एक पारंपरिक सफेद और काले पारदर्शिता मास्क का उपयोग नहीं कर सकता हूं या यह उसी समस्या में चलेगा। यहाँ एक उदाहरण है, इस बार सफेद और काले सफेद और काले रंग का प्रतिनिधित्व करते हैं:

पारदर्शिता मास्क

ऐसा लगता है कि समाधान, एक पारदर्शिता मुखौटा लागू करना होगा जो स्वयं पारदर्शिता का उपयोग करता है। कुछ इस तरह: (हरा = पारदर्शी)

पारदर्शिता के साथ पारदर्शिता मास्क

इस तरह, कई पारदर्शिता मास्क को एक साथ मिश्रित किया जा सकता है और काले वर्ग के खिलाफ पारदर्शिता मास्क के रूप में उपयोग किया जाता है। यहाँ दो पारदर्शिता मास्क अल्फा का उदाहरण दिया गया है जो एक साथ मिश्रित हैं:

पारदर्शिता के साथ दो पारदर्शिता मास्क

वैसे भी, यह वह तरीका है जिसे मैं लागू करने पर काम कर रहा हूं। यदि यह काम करता है तो मैं परिणाम पोस्ट करूँगा। मैं (वर्तमान में) नहीं जानता कि क्या मैं एक पारदर्शिता मास्क का उपयोग कर सकता हूं जिसमें स्वयं पारदर्शिता है।


इसके बारे में सोचते हुए, ऐसा लगता है कि मुझे चारों ओर पारदर्शिता वाले मुखौटे ले जाना चाहिए और उन्हें एक बड़ी काली बनावट पर लागू करना चाहिए। हालांकि यह कैसे किया जाएगा इसका कोई अंदाजा नहीं है।
कैमरून फ्रेडमैन 19

7
सुनिश्चित नहीं है कि आप अपने ग्रेडिएंट कैसे बना रहे हैं या लागू कर रहे हैं, हालाँकि यह एक सम्मिश्रण मुद्दा हो सकता है, जहाँ यदि आप सही सम्मिश्रण का उपयोग करते हैं तो यह ठीक काम करेगा। हमें बनावट के बारे में अधिक जानकारी की आवश्यकता होगी।
dennmat 21

मैं फ्रेम के रूप में एन्डेजाइन का उपयोग कर रहा हूं, और बहुत से सम्मिश्रण पर्दे के पीछे हो रहे हैं, हालांकि एक "सेटब्लेंडफंक्शन ()" उपलब्ध है।
कैमरून फ्रेडमैन

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

यद्यपि वह धागा पहली बार में आपकी समस्या को ठीक करता दिख रहा है, क्या आपके पास उस परिवर्तन सहित संस्करण है?
dennmat

जवाबों:


3

वैचारिक रूप से, कई स्पॉटलाइट के समाधान में निम्न शामिल हैं:

  1. दृश्य में प्रत्येक पिक्सेल के लिए प्रकाश मान रखने के लिए पूरी तरह से काले रंग की सरणी के साथ शुरू करें।
    • शून्य छवि के एक क्षेत्र का प्रतिनिधित्व करेगा जिसमें कोई प्रकाश नहीं है।
    • 100% एक ऐसे क्षेत्र का प्रतिनिधित्व करेगा जो पूरी तरह से दिन के उजाले से संतृप्त है।
    • यदि आप फैंसी प्राप्त करना चाहते हैं, तो आपके पास 100% से अधिक मूल्य हो सकता है (जैसे, 200%) उस छवि के एक क्षेत्र का प्रतिनिधित्व करता है जो ओवरसैटेड है, और पिक्सेल की एक अंधा सफेद बूँद में सब कुछ धुंधला कर देता है। इस बारे में बाद में चिंता करें, और समय के लिए 0-100% के बीच बस कैप वैल्यूज़ का मूल्यांकन करें।
  2. प्रत्येक प्रकाश स्रोत के लिए या तो स्क्रीन के भीतर, या किनारे के लिए पर्याप्त है कि उसका प्रभामंडल प्रकाश में जोड़ देगा, प्रकाश स्रोतों से प्रकाश मानों को दृश्य पिक्सेल के लिए आपके प्रकाश मूल्यों के सरणी में जोड़ देगा।
  3. अपने दृश्य के लिए पिक्सेल को संशोधित करने के लिए परिणामी प्रकाश-मान-सरणी का उपयोग करें जैसे:
    • 0% प्रकाश द्वारा जलाए गए पिक्सेल काले हैं।
    • 100% प्रकाश द्वारा जलाए गए पिक्सेल अपने सामान्य रंग में हैं।
    • अन्य पिक्सल के बीच एक रंग का हिस्सा है।
    • आप पहले से ही जानते हैं कि यह कदम कैसे करना है, अपने स्क्रीनशॉट्स को देखते हुए।

चाल समझ रही है कि अल्फा-सम्मिश्रण इन चरणों में से एक या अधिक कर सकते हैं। अल्फा-सम्मिश्रण एक साधारण तरीके से एक छवि या बनावट के पिक्सल को संशोधित करने के लिए एक अल्फा मानचित्र / छवि का उपयोग करने के लिए संदर्भित करता है। आमतौर पर इसका मतलब यह भी है कि यह तेजी से बनाने के लिए, फंक्शन का एक तेज़ सेट होने वाला है, या विशेष हार्डवेयर कमांड के साथ कार्यान्वित किया जा रहा है। आप इसे नियमित सरणियों और सामान्य भाषा के आदेशों के साथ कर सकते हैं, लेकिन विशेष अल्फा / सम्मिश्रण पुस्तकालय कार्यों का उपयोग करना शायद बेहतर है। ... और बग नहीं होगा। कभी-कभी इसका मतलब होता है पिक्सेल को आंशिक रूप से पारदर्शी बनाना, लेकिन आपके मामले के लिए, इसका मतलब होगा:

  • # 1 से प्रकाश-मान-सरणी बनाने के लिए, प्रत्येक पिक्सेल में अल्फा मान जोड़ना।
  • # 1 चरण से पिक्सेल के लिए अंतिम रंगों को हल करने के लिए # 1 से प्रकाश-मूल्य-सरणी का उपयोग करना।

मैं आपके अल्फा-सम्मिश्रण फ़ंक्शंस के लिए दस्तावेज़ देखना शुरू करूँगा कि वे विभिन्न प्रकार के पिक्सेल के संयोजन के लिए क्या कार्यक्षमता प्रदान करते हैं। मुझे संदेह है कि आपके पास प्रदर्शन करने के लिए आवश्यक प्रत्येक चरण के लिए उनके कार्य होंगे, लेकिन वे ऐसे नामों के तहत हो सकते हैं जो स्पष्ट नहीं हैं।


मैं इस जवाब को खोद रहा हूं और इसे एक शॉट देने जा रहा हूं। 100% से ऊपर के मूल्यों के लिए लेंस-फ्लेयर / ब्लर का विचार एक अच्छा और प्रेरणादायक बोनस है। प्रक्रिया में सीखे गए पाठों के साथ अपडेट पोस्ट करेगा। धन्यवाद ET
कैमरून फ्रेडमैन
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.