Making UI on Crowpanel HMI ESP32 Display | Giveaway
techiesms techiesms
135K subscribers
7,112 views
361

 Published On Jun 8, 2024

This video is about creating our own User Interface using SquareLine Studio from completely scratch. And I have show that by creating a UI for Collecting Payment via UPI.

I have also discussed my upcoming project plan using this concept so watch this video till the end and learn something new..

You can support me🙏🏻 and also get benefitted on Patreon :-   / techiesms  

__________________________________________________________
👨🏻‍💻 Display Purchase Links 👨🏻‍💻

All CrowPanel displays: https://www.elecrow.com/display/esp-h...
CrowPanel 5'' display: https://www.elecrow.com/esp32-display...
__________________________________________________________
👨🏻‍💻 Important Links 👨🏻‍💻

Boards Package Link - https://raw.githubusercontent.com/esp...

Product Purchase Link - https://www.elecrow.com/esp32-display...

5inch Display Documentation Page - https://www.elecrow.com/wiki/esp32-di...

Demo Code used in this video - https://github.com/Elecrow-RD/CrowPan...

Square Line Studio Download page - https://squareline.io

Series of 3 episodes to understand UPI payment data using ESP32 -    • WebHooks For IOT projects  

__________________________________________________________
Buy the components for your projects and support techiesms💡🔌

ESP32 Dev board - https://www.techiesms.com/product/esp...
Seeed Studio XIAO ESP32C3 - https://www.techiesms.com/product/see...

and many more such components are available at https://www.techiesms.com
__________________________________________________________
⏱ Time Stamps ⏱

00:00 Introduction
00:41 Unboxing
01:06 Specifications
01:56 Setting up Arduino IDE to Program this display
03:42 Testing First Demo Code on our display
04:31 Testing First Demo Code
05:02 About SquareLine Studio
05:24 Downloading Square Line Studio
05:34 Setting up Square Line Studio for our display
06:38 Adding Background Image on Screen in Square Line Studio
07:30 Adding Button in Square Line Studio
09:20 Adding another screen in Square Line Studio
09:41 Adding Event to Button in Square Line Studio
10:31 Testing our UI in Square Line Studio itself (Play Mode)
10:53 Adding Image in Screen 2
11:26 Adding Spinner Widget in Square Line Studio
11:36 Adding Text Label in Square Line Studio
12:12 Adding Secondary Image on Screen 2
13:01 Testing final UI in Square Line Studio
13:24 Exporting UI Files in Square Line Studio
14:33 How to use UI files in Arduino IDE
16:10 Testing the Code without doing any modifications
17:06 Modifying code to Display Payment
20:23 Testing the complete project
20:51 My upcoming project
21:56 Giveaway Participation steps

__________________________________________________________

🎥 🎙 My Video Gear 🎙🎥

Camera - Canon 750d
Lens - 50mm f/1.8 STM Lens (https://amzn.to/32gqnsi), 24mm f/2.6
Key Light - Godox SL60W (https://amzn.to/3522mHe)
Fill Light/Back Light - Osaka Lightning Setup (https://amzn.to/2I5cdDi)
Tripod - https://amzn.to/3uNhC4H
Microphone - Zoom H1N(https://amzn.to/3Osh12A)
Editing - Final Cut Pro X on MacBook Pro ( https://amzn.to/3vHcSyJ )

__________________________________________________________
Get connected with techiesms everywhere..

Subscribe Main Channel :- http://bit.ly/techiesms_youtube
Subscribe Shorts Channel :- https://bit.ly/techiesms_shorts
Facebook :-   / techiesms  
Twitter :-   / imtechiesms  
Instagram :-   / techiesms  
Website :- http://www.techiesms.com
Telegram - @techiesms

__________________________________________________________


techiesms
explore | learn | share

show more

Share/Embed