सर्वश्रेष्ठ ड्रैग-एंड-ड्रॉप LVGL एडिटर और GUI बिल्डर।

ESP32 का टचस्क्रीन UI देखकर डिज़ाइन करें

PicoPixel एक ब्राउज़र-आधारित विज़ुअल LVGL एडिटर है जो आपको ड्रैग-एंड-ड्रॉप से टचस्क्रीन इंटरफ़ेस डिज़ाइन करने, लाइव सिम्युलेटर में प्रीव्यू करने, और किसी भी ESP32 प्रोजेक्ट के लिए इस्तेमाल के लिए तैयार C कोड एक्सपोर्ट करने देता है। कोई इंस्टॉलेशन नहीं। कोई क्रेडिट कार्ड नहीं। मिनटों में अपना पहला ESP32 UI डिज़ाइन करें।

मुफ़्त में शुरू करें

ESP32 डेवलपर PicoPixel क्यों चुनते हैं

ESP32 का टचस्क्रीन UI बनाने के लिए आम तौर पर सैकड़ों लाइन LVGL C कोड लिखना पड़ता है। फिर बोर्ड पर फ़्लैश करें, डिस्प्ले देखें, विजेट की जगह ठीक करें और फिर फ़्लैश करें। खासकर लेआउट और रूप बदलते समय यह बार-बार करने में काफ़ी समय लगता है।

PicoPixel में विजेट कैनवास पर खींचकर रखें और रंग, फ़ॉन्ट तथा दूरी तय करें। WebAssembly वाला लाइव LVGL सिम्युलेटर बदलाव तुरंत दिखाता है। डिज़ाइन तैयार होने पर C कोड की ज़िप निकालें और अपने ESP-IDF, Arduino या PlatformIO प्रोजेक्ट में जोड़ें। इसमें मानक LVGL 8.x API हैं; अलग बंद-स्रोत लाइब्रेरी नहीं चाहिए।

PicoPixel ब्राउज़र में चलता है, इसलिए अपने मौजूदा डेवलपमेंट सेटअप के साथ कुछ नया इंस्टॉल नहीं करना पड़ता। एक्सपोर्ट की फ़ाइलें खुद जोड़ सकते हैं या ज़िप Claude Code या GitHub Copilot जैसे AI असिस्टेंट को देकर मदद ले सकते हैं। सभी सुविधाएँ देखें, काम करने का तरीका जानें या दूसरे LVGL एडिटर से तुलना पढ़ें।

ESP32 के साथ यह कैसे काम करता है

1. अपना इंटरफ़ेस डिज़ाइन करें

ब्राउज़र में PicoPixel खोलकर नया प्रोजेक्ट बनाएँ। बटन, लेबल, स्लाइडर, चार्ट, आर्क और स्विच जैसे LVGL विजेट कैनवास पर खींचकर रखें। स्क्रीन का रिज़ॉल्यूशन अपने ESP32 के अनुसार चुनें: सामान्य SPI TFT के लिए 320×240, गोल GC9A01 के लिए 240×240 या बड़े पैनल के लिए 800×480। रंग, फ़ॉन्ट और दूरी देखकर तय करें; अभी C कोड नहीं लिखना पड़ता।

2. लाइव LVGL सिम्युलेटर में प्रीव्यू करें

PicoPixel असली LVGL इंजन को WebAssembly के ज़रिए ब्राउज़र में चलाता है। हार्डवेयर पर फ़्लैश किए बिना टच, स्क्रॉल और एनिमेशन आज़माएँ। टीम के साथियों या क्लाइंट से राय लेने के लिए सिम्युलेटर लिंक साझा करें।

3. अपनी UI फ़ाइलें एक्सपोर्ट करें

अपना UI ज़िप में LVGL C कोड (.c और .h फ़ाइलें) के रूप में एक्सपोर्ट करें। इसमें विजेट बनाने, स्टाइल और लेआउट तय करने तथा इवेंट जोड़ने का मानक LVGL 8.x कोड है। अलग PicoPixel रनटाइम या बंद-स्रोत लाइब्रेरी नहीं चाहिए। LVGL v9.x सपोर्ट की योजना है।

4. प्रोजेक्ट में जोड़ें और फ़्लैश करें

फ़ाइलें अपने ESP-IDF, Arduino या PlatformIO प्रोजेक्ट में खोलें। UI हेडर शामिल करें और LVGL के डिस्प्ले व इनपुट ड्राइवर तैयार होने के बाद ui_init() कॉल करें। कंपाइल करके फ़्लैश करें; ESP32 का UI सिम्युलेटर से पिक्सेल-दर-पिक्सेल मेल खाता है। चाहें तो ज़िप Claude Code या Codex जैसे AI असिस्टेंट को देकर फ़ाइलें जुड़वा सकते हैं।

ESP32-P4 पर टेस्ट किया गया

PicoPixel का UI एक्सपोर्ट ESP32-P4 पर टेस्ट और सत्यापित किया गया है — Espressif का नवीनतम और सबसे शक्तिशाली चिप। विशेष रूप से Waveshare और Guition ESP32-P4 डेवलपमेंट बोर्ड्स के साथ टेस्ट किया गया।

ESP32-P4 में अलग GPU और हार्डवेयर पर पिक्सेल प्रोसेस करने की व्यवस्था है। यह सहज एनिमेशन और अधिक रिज़ॉल्यूशन वाले जटिल LVGL इंटरफ़ेस के लिए उपयुक्त है। PicoPixel का मानक LVGL C कोड वही रहता है और LVGL 8.x वाले दूसरे ESP32 वेरिएंट पर भी काम करता है।

संगत ESP32 बोर्ड और डिस्प्ले

ESP32 वेरिएंट

PicoPixel मानक LVGL कोड जनरेट करता है जो LVGL 8.x सपोर्ट वाले किसी भी ESP32 वेरिएंट पर काम करता है:

  • •ESP32 (मूल) — सीमित SRAM; सरल UI के लिए सर्वोत्तम
  • •ESP32-S2 — USB OTG सपोर्ट, मध्यम डिस्प्ले क्षमता
  • •ESP32-S3 — अधिकांश डिस्प्ले प्रोजेक्ट्स के लिए अनुशंसित; PSRAM के साथ ड्यूअल-कोर और जटिल UI के लिए पर्याप्त शक्ति
  • •ESP32-C3 — RISC-V सिंगल-कोर; हल्के UI के लिए उपयुक्त
  • •ESP32-C6 — Wi-Fi 6 + Bluetooth 5.3; C3 जैसी डिस्प्ले क्षमता
  • •ESP32-P4 — समर्पित GPU और हार्डवेयर पिक्सेल-प्रोसेसिंग के साथ नवीनतम वेरिएंट; जटिल, हाई-रिज़ॉल्यूशन GUI के लिए उत्कृष्ट। Waveshare और Guition बोर्ड्स के साथ टेस्ट किया गया।

लोकप्रिय डेवलपमेंट बोर्ड

किसी भी LVGL-सक्षम ESP32 डेव बोर्ड के साथ संगत, जिसमें शामिल हैं:

  • •LILYGO T-Display / T-Display-S3
  • •M5Stack Core2 / CoreS3
  • •Waveshare ESP32-S3 / ESP32-P4 डिस्प्ले बोर्ड
  • •Guition ESP32-P4 डिस्प्ले बोर्ड
  • •Elecrow डिस्प्ले बोर्ड
  • •Adafruit Feather ESP32-S3 TFT
  • •Espressif ESP32-S3-BOX / BOX-3
  • •Sunton बोर्ड (लोकप्रिय बजट ESP32 डिस्प्ले बोर्ड)

संगत डिस्प्ले ड्राइवर

PicoPixel का LVGL कोड किसी एक प्लेटफ़ॉर्म पर निर्भर नहीं है। डिस्प्ले ड्राइवर आपके LVGL पोर्ट में कॉन्फ़िगर होता है। ESP32 पर LVGL के साथ इस्तेमाल होने वाले आम डिस्प्ले कंट्रोलर हैं:

  • •ST7789 (छोटे TFT के लिए सबसे सामान्य)
  • •ILI9341 (240×320 डिस्प्ले)
  • •ILI9488 (320×480 डिस्प्ले)
  • •GC9A01 (गोल डिस्प्ले)
  • •ST7796 (बड़े डिस्प्ले)
  • •SSD1306 (छोटे OLED)
  • •MIPI DSI डिस्प्ले (ESP32-P4)

यदि आपका डिस्प्ले LVGL के साथ काम करता है, तो PicoPixel का आउटपुट उसके साथ काम करेगा।

ESP-IDF, Arduino, और PlatformIO के साथ काम करता है

ESP-IDF प्रोजेक्ट में जोड़ें

PicoPixel का एक्सपोर्ट पूरी तरह से UI कोड है — इसमें lv_init(), डिस्प्ले ड्राइवर रजिस्ट्रेशन, या टिक हैंडलिंग शामिल नहीं है। आपके प्रोजेक्ट में पहले से काम करने वाला LVGL 8.x सेटअप होना चाहिए। PicoPixel का UI जोड़ने के लिए:

  1. 1.PicoPixel से अपना UI एक्सपोर्ट करें (.zip फ़ाइल डाउनलोड होती है)
  2. 2.अपने प्रोजेक्ट के components/ फ़ोल्डर के अंदर ui/ डायरेक्टरी बनाएँ
  3. 3.एक्सपोर्ट की गई फ़ाइलों को components/ui/ में अनज़िप करें
  4. 4.components/ui/ में CMakeLists.txt बनाएँ जो lvgl पर डिपेंडेंसी के साथ सोर्स को रजिस्टर करे
  5. 5.अपने main/CMakeLists.txt में REQUIRES लिस्ट में ui जोड़ें
  6. 6.अपने main.c में #include "ui/ui.h" शामिल करें और अपने डिस्प्ले सेटअप के बाद ui_init() कॉल करें
  7. 7.बिल्ड और फ़्लैश करें: idf.py build && idf.py flash

Arduino IDE प्रोजेक्ट में जोड़ें

आपके स्केच में पहले से LVGL 8.x इंस्टॉल और काम करने वाला डिस्प्ले ड्राइवर कॉन्फ़िगर होना चाहिए।

  1. 1.PicoPixel से अपना UI एक्सपोर्ट करें (.zip फ़ाइल डाउनलोड होती है)
  2. 2.अपने स्केच की src/ डायरेक्टरी के अंदर ui/ फ़ोल्डर बनाएँ
  3. 3.एक्सपोर्ट की गई फ़ाइलों को src/ui/ में अनज़िप करें
  4. 4.अपनी .ino फ़ाइल में #include "src/ui/ui.h" शामिल करें
  5. 5.setup() में lv_init() और आपका डिस्प्ले ड्राइवर कॉन्फ़िगर होने के बाद ui_init() कॉल करें
  6. 6.Arduino IDE src/ और उसके सभी उपफ़ोल्डर की .c फ़ाइलें अपने-आप कंपाइल करता है; बिल्ड की सेटिंग नहीं बदलनी पड़ती
  7. 7.अपने ESP32 पर अपलोड करें

PlatformIO प्रोजेक्ट में जोड़ें

आपके प्रोजेक्ट में पहले से lib_deps में LVGL 8.x और काम करने वाला डिस्प्ले ड्राइवर कॉन्फ़िगर होना चाहिए।

  1. 1.PicoPixel से अपना UI एक्सपोर्ट करें (.zip फ़ाइल डाउनलोड होती है)
  2. 2.एक्सपोर्ट की गई फ़ाइलों को src/ui/ में अनज़िप करें
  3. 3.main.cpp में #include "ui/ui.h" शामिल करें
  4. 4.अपने LVGL सेटअप के बाद ui_init() कॉल करें
  5. 5.कोई platformio.ini बदलाव ज़रूरी नहीं — PlatformIO src/ में सभी सोर्स ऑटो-कम्पाइल करता है
  6. 6.बिल्ड और फ़्लैश करें: pio run --target upload

AI की मदद से प्रोजेक्ट में जोड़ें

PicoPixel की ज़िप अपने AI कोडिंग असिस्टेंट को दें। Claude Code, GitHub Copilot या Codex से कहें: “इन PicoPixel UI फ़ाइलों को मेरे ESP32 LVGL प्रोजेक्ट में जोड़ें।” अधिकांश असिस्टेंट फ़ाइलें सही जगह रखने, हेडर शामिल करने और बिल्ड की सेटिंग बदलने में मदद कर सकते हैं।

अक्सर पूछे जाने वाले प्रश्न

क्या PicoPixel ESP32 के साथ काम करता है?

हाँ। मानक LVGL C कोड ESP-IDF, Arduino या PlatformIO से किसी भी ESP32 वेरिएंट के लिए कंपाइल कर सकते हैं। एक्सपोर्ट Waveshare और Guition के ESP32-P4 बोर्ड पर जाँचा गया है और LVGL 8.x चलाने वाले ESP32 पर काम करता है।

कौन-से ESP32 बोर्ड इस्तेमाल कर सकते हैं?

कोड किसी एक बोर्ड पर निर्भर नहीं है। LVGL चलाने वाले ESP32 बोर्ड के साथ काम करता है, जिनमें LILYGO T-Display, M5Stack, Waveshare, Guition, Elecrow, Adafruit Feather, Espressif DevKits और Sunton शामिल हैं।

कौन-सा LVGL वर्शन चाहिए?

अभी LVGL 8.x। LVGL v9.x के लिए सपोर्ट की योजना है।

क्या PicoPixel ESP-IDF या Arduino का कोड देता है?

PicoPixel ज़िप में मानक LVGL C कोड (.c और .h फ़ाइलें) देता है। किसी बंद-स्रोत लाइब्रेरी की ज़रूरत नहीं है। इसे अपने मौजूदा ESP-IDF, Arduino या PlatformIO प्रोजेक्ट में जोड़ सकते हैं।

क्या ESP32 के लिए टचस्क्रीन UI बना सकता हूँ?

बिलकुल। विज़ुअल एडिटर में टच इनपुट हैंडलर, स्क्रॉल होने वाले कंटेनर और इशारों से स्क्रीन बदलने जैसी प्रतिक्रियाएँ तय करें। एक्सपोर्ट में उनसे जुड़ा LVGL सेटअप शामिल होता है।

क्या ESP32 प्रोजेक्ट के लिए PicoPixel मुफ़्त है?

निजी और शौकिया इस्तेमाल के लिए हाँ; क्रेडिट कार्ड नहीं चाहिए। व्यावसायिक उपयोग $17/माह ($204/वर्ष) से शुरू होता है।

ESP32 के लिए PicoPixel और SquareLine Studio में क्या अंतर है?

PicoPixel ब्राउज़र में चलता है, टीम को साथ काम करने देता है और लाइव LVGL सिम्युलेटर देता है। SquareLine Studio डेस्कटॉप ऐप है और व्यावसायिक काम के लिए सशुल्क लाइसेंस चाहिए। पूरी तुलना देखें।

अपना LVGL इंटरफ़ेस मुफ़्त में बनाना शुरू करें

एम्बेडेड UI को सीधे कैनवास पर डिज़ाइन करें, लाइव LVGL सिम्युलेटर में आज़माएँ और तैयार C कोड एक्सपोर्ट करें। ब्राउज़र में PicoPixel खोलकर शुरू करें; कुछ इंस्टॉल करने या क्रेडिट कार्ड देने की ज़रूरत नहीं है।

मुफ़्त में शुरू करें

FAQ पढ़ें · संपर्क करें