sprite क्या है?

क्या?

Sprite PicoPixel का एक single widget है जिसमें कई अलग animations रहती हैं, और आप जब चाहें उनके बीच switch कर सकते हैं. हर animation को mode या state कहते हैं, जैसे "Idle," "Running," या "Happy."

इसे video game character की तरह सोचें. Screen पर character एक ही चीज है, लेकिन स्थिति के हिसाब से वह walk, jump या wave कर सकता है. Sprite भी वैसा ही है: एक widget, कई looks, और आप तय करते हैं कि कौन-सा play होगा.

PicoPixel के powerful event editor से आप अलग states trigger करके अपने sprite में life ला सकते हैं.

Example: मान लें आपके पास animated character है, या आप ESP32 या किसी LVGL application के लिए अपना stack-chan face बनाना चाहते हैं. आप एक single sprite use करके "Running," "Thinking," "Failed" जैसे modes conditionally trigger कर सकते हैं, अलग-अलग widgets के ढेर को manage किए बिना.

Sprite कब use करना चाहिए?

हर image को sprite होने की जरूरत नहीं. Decide करने का quick तरीका:

• Single, still picture? Regular Image use करें. जो चीज कभी move नहीं करती, उसके लिए sprite overkill है.
• एक animation जो बस loop होती रहती है (जैसे spinning loader)? Animated Image use करें. यह simpler और lighter है.
• कुछ ऐसा जो happening के हिसाब से बदलना चाहिए, task succeed होने पर smile करने वाला face, या idle से running में switch करने वाला character? यही sprite के लिए है.

Rule of thumb: अगर आपकी graphic में एक से ज्यादा "mood" या "behavior" है और आप उनके बीच switch करना चाहते हैं, तो sprite use करें.

Sprite कैसे create करें?

1. "Sprite" widget select करें. Right sidebar में आप उस sprite का पहला mode add कर सकते हैं. Example के लिए first state "Idle" हो सकती है. हर state को clear name दें ताकि triggers setup करते समय पहचान सकें.
2. Image sequence upload करें, यानी frames का set जो इस mode को बनाता है. हर frame एक picture है, और उन्हें order में play करना flipbook जैसी animation बनाता है.
   • उस specific state की duration adjust कर सकते हैं. Longer duration animation को slow करती है; shorter one speed up करती है.
3. Another state add करें. Minimum 2 modes required हैं. (अगर आपको सिर्फ एक animation चाहिए, तो Animated Image widget बेहतर है; ऊपर Sprite कब use करना चाहिए? देखें.)
4. Events tab/editor से different states को conditionally trigger और toggle करें. यही sprite को alive feel कराता है, अगले section में ज्यादा detail है.

Sprite को life देना

जो sprite सिर्फ एक state दिखाता है, वह ज्यादा कुछ नहीं करता. Magic तब होता है जब आप उसे बताते हैं कि कब switch करना है, और इसके लिए Events editor है.

Idea simple है: जब कुछ होता है, state switch करें. आप "something" चुनते हैं (button press, value change, timer, etc.) और PicoPixel बाकी संभालता है.

Typical example:

1. आपका sprite default रूप से "Idle" state पर start करता है.
2. Events editor में event add करें: button press होने पर sprite को "Running" state में switch करें.
3. दूसरा event add करें: task finish होने पर "Happy" पर switch करें (या वापस "Idle" पर).

बस इतना ही. आपका sprite अब user actions पर react करता है, बिना code लिखे. आप expressive widgets बनाने के लिए ऐसे जितने चाहें events chain कर सकते हैं.

Sprite को re-use कैसे करें?

Sprite बनाने के बाद आप उसे हर project में scratch से नहीं बनाना चाहेंगे. Library feature उसे एक बार save करके किसी भी project में drop करने देता है.

1. Completed sprite widget पर right-click करें और "Add Library Widget" क्लिक करें.
   • यह Assets tab की library में reusable entry बनाता है. इसे ready-made widgets की personal shelf समझें.
2. उस library को projects के बीच move या teammate से share करने के लिए Library में जाएं और Export क्लिक करें.
3. अब जब आप नया project बनाते हैं या existing workspace खोलते हैं, तो library import करके sprite सीधे drop कर सकते हैं: rebuild की जरूरत नहीं.
   • सभी frames, durations और states original copy से perfectly sync रहते हैं, इसलिए वह हर जगह same behave करता है.

Common issues

Sprite device पर flash करने के बाद दिखाई नहीं देता.

• यह लगभग हमेशा memory issue होता है: device को sprite image frames hold करने के लिए enough RAM चाहिए.
• यह आपकी LVGL configuration में set होता है और PicoPixel आपके लिए इसे change नहीं कर सकता; यह board पर depend करता है.
• Exported README.md file इसे note करती है, ताकि आपका AI assistant embedded device के SDK/LVGL config update करने में मदद कर सके.

Frames misaligned दिखते हैं या jump करते हैं.

• Double-check करें कि हर state में हर frame की exact same dimensions हैं. कुछ pixels का difference भी alignment बिगाड़ देगा.

Animation बहुत fast या slow play होती है.

• Affected state की duration adjust करें. हर state की अपनी duration होती है, इसलिए उन्हें individually tune करना पड़ सकता है.

Sprite save नहीं होने देता / another state मांगता है.

• Sprite को at least 2 states चाहिए. अगर आपके पास सिर्फ एक है, तो दूसरा state add करें या Animated Image widget पर switch करें.