- 42
- 58 598
LVGL_BEGINNER
United Kingdom
เข้าร่วมเมื่อ 30 ก.ย. 2020
LVGL ESP32-2432S028R Read and display data from SD Card(Beginner)
*If video was helpful give a like PLEASE*
LVGL ESP32-2432S028R Read txt/CSV data from SD Card.
Chapters:
00:00 - Aim show text and csv data from SD Card?
00:16 - Explain the basic components of GUI?
01:00 - Not able to use images directly from SD Card?
02:05 - How to add bitmap image?
03:40 - Build and generate C files for Arduino?
04:55 - Update image files?
05:45 - Explain Arduino sketch file?
06:50 - Intialise SD card and verify we can read it?
07:10 - Load text and csv data from SD Card?
08:05 - Register event handler for dropdown?
10:10 - Explain utils.h file?
11:20 - utils.h Load data from CSV file using CSV_Parser library?
15:33 - utils.h Display symbols in image?
16:10 - utils.h Set logo image for team?
16:45 - utils.h Failed to load image from SD Card?
18:17 - Final Result?
Video on using custom fonts:
th-cam.com/video/ynHcOtYNopg/w-d-xo.html
Use Image as Bitmap:
th-cam.com/video/NRyf-t-fDvw/w-d-xo.html
Software Used:
ESP32 Dev Module
Arduino 2.3.2
LVGL 9.1.0
EEZ Studio 0.16.0
GitHub:
github.com/nu1504ta0609sa0902/CYD_practice_projects/tree/main/LVGL9/Test_SDCard_LVGL
Other videos listed here:
github.com/nu1504ta0609sa0902/CYD_practice_projects?tab=readme-ov-file#lvgl-youtube-tutorial-using-eez-studio
LVGL ESP32-2432S028R learn how to read txt/CSV data from SD card and display it(Beginner)
fonts.google.com/specimen/Orbitron
I use EEZ Studio because they support LVGL 9 and don't require login like Squareline.
I am learning about LVGL and ESP32 and documenting what I learn so it may help others.
Note: these tutorials can be done on any displays supporting LVGL.
Assumes:
- you have ve done basic tutorials for ESP32 LVGL before.
- More info regarding the widgets/UI
- docs.lvgl.io/master/widgets/index.html
- This has lots of examples
- Installl EEZ Studio
- www.envox.eu/studio/studio-introduction/
- you are familiar with ESP32-2432S028R AKA Cheap Yellow Display (CYD)
- randomnerdtutorials.com/lvgl-cheap-yellow-display-esp32-2432s028r/
- you've already setup all the required libraries for ESP32-2432S028R and LVGL
- randomnerdtutorials.com/lvgl-cheap-yellow-display-esp32-2432s028r/
- Great setup instructions
- Lots of tutorials
- github.com/witnessmenow/ESP32-Cheap-Yellow-Display
- This has lots of examples for LVGL
- Arduino examples are great source too
- File - Examples - Select one of the library example
LVGL ESP32-2432S028R Read txt/CSV data from SD Card.
Chapters:
00:00 - Aim show text and csv data from SD Card?
00:16 - Explain the basic components of GUI?
01:00 - Not able to use images directly from SD Card?
02:05 - How to add bitmap image?
03:40 - Build and generate C files for Arduino?
04:55 - Update image files?
05:45 - Explain Arduino sketch file?
06:50 - Intialise SD card and verify we can read it?
07:10 - Load text and csv data from SD Card?
08:05 - Register event handler for dropdown?
10:10 - Explain utils.h file?
11:20 - utils.h Load data from CSV file using CSV_Parser library?
15:33 - utils.h Display symbols in image?
16:10 - utils.h Set logo image for team?
16:45 - utils.h Failed to load image from SD Card?
18:17 - Final Result?
Video on using custom fonts:
th-cam.com/video/ynHcOtYNopg/w-d-xo.html
Use Image as Bitmap:
th-cam.com/video/NRyf-t-fDvw/w-d-xo.html
Software Used:
ESP32 Dev Module
Arduino 2.3.2
LVGL 9.1.0
EEZ Studio 0.16.0
GitHub:
github.com/nu1504ta0609sa0902/CYD_practice_projects/tree/main/LVGL9/Test_SDCard_LVGL
Other videos listed here:
github.com/nu1504ta0609sa0902/CYD_practice_projects?tab=readme-ov-file#lvgl-youtube-tutorial-using-eez-studio
LVGL ESP32-2432S028R learn how to read txt/CSV data from SD card and display it(Beginner)
fonts.google.com/specimen/Orbitron
I use EEZ Studio because they support LVGL 9 and don't require login like Squareline.
I am learning about LVGL and ESP32 and documenting what I learn so it may help others.
Note: these tutorials can be done on any displays supporting LVGL.
Assumes:
- you have ve done basic tutorials for ESP32 LVGL before.
- More info regarding the widgets/UI
- docs.lvgl.io/master/widgets/index.html
- This has lots of examples
- Installl EEZ Studio
- www.envox.eu/studio/studio-introduction/
- you are familiar with ESP32-2432S028R AKA Cheap Yellow Display (CYD)
- randomnerdtutorials.com/lvgl-cheap-yellow-display-esp32-2432s028r/
- you've already setup all the required libraries for ESP32-2432S028R and LVGL
- randomnerdtutorials.com/lvgl-cheap-yellow-display-esp32-2432s028r/
- Great setup instructions
- Lots of tutorials
- github.com/witnessmenow/ESP32-Cheap-Yellow-Display
- This has lots of examples for LVGL
- Arduino examples are great source too
- File - Examples - Select one of the library example
มุมมอง: 428
วีดีโอ
LVGL ESP32-2432S028R Use Animation to create a moving cartoon(Beginner)
มุมมอง 45214 วันที่ผ่านมา
*If video was helpful give a like PLEASE* LVGL ESP32-2432S028R Use Animation to create a moving cartoon(Beginner) Chapters: 00:00 - Aim to create Animation cartoon? 00:10 - Create EEZ Studio project and add label for header? 00:32 - Build and generate C files for Arduino? 01:35 - Add animation and callback code? 01:55 - Explain the animation and callback function? 04:10 - Add code to create the...
LVGL ESP32-2432S028R Use Animation to update Bar and Slider(Beginner)
มุมมอง 49321 วันที่ผ่านมา
*If video was helpful give a like PLEASE* LVGL ESP32-2432S028R Use Animation to update Bar and Slider(Beginner) Chapters: 00:00 - Aim to use Animation to update slider? 00:24 - Create EEZ Studio project and add label for header? 01:26 - GUI add Bar and set styles? 02:30 - GUI Add bitmap image use it on Bar? 04:30 - GUI Add Slider and set styles? 07:00 - GUI add Button and set styles? 09:30 - Bu...
LVGL ESP32-2432S028R Update Dropdown list with Keyboard and TextArea(Beginner)
มุมมอง 47528 วันที่ผ่านมา
*If video was helpful give a like PLEASE* LVGL ESP32-2432S028R Update Dropdown list with Keyboard and TextArea(Tutorial Link In Description for Beginners) Chapters: 00:00 - Aim to update dropdown list dynamically? 00:25 - Create LVGL project? 01:08 - GUI add Dropdown list and set styles? 02:15 - GUI add Label and set styles? 03:15 - GUI add TextArea and set styles? 03:50 - GUI add Button and se...
LVGL ESP32-2432S028R Use Image Buttons to create multiple image slideshow (Beginner)
มุมมอง 498หลายเดือนก่อน
*If video was helpful give a like PLEASE* LVGL ESP32-2432S028R learn how to Use Image Buttons to create an Image Viewer(Beginner)(Beginner) Chapters: 00:00 - Aim to create an Image Viewer? 00:18 - GUI add Label and set styles? 02:56 - GUI add Next and Prev Buttons and set styles? 04:34 - GUI add Image and set styles? 05:51 - Add Bitmap Image? 07:50 - Build and generate C files for Arduino? 08:3...
LVGL ESP32-2432S028R Use ARC to control brigthness of an LED on a Breadboard(Beginner)
มุมมอง 1.3Kหลายเดือนก่อน
*If video was helpful give a like PLEASE* LVGL ESP32-2432S028R learn how to use an Arc to control brigthness of an LED on a Breadboard(Beginner) Chapters: 00:00 - Aim to dim an LED using LVGL Arc? 00:16 - GUI add Arc and set styles? 04:11 - GUI add Scale and set styles? 07:02 - GUI add LED and set styles? 07:55 - GUI set ARC and Scale to be same size? 08:42 - GUI add Label and set styles? 10:23...
LVGL ESP32-2432S028R Learn to add bitmap images and add font symbols and use them(Beginner)
มุมมอง 751หลายเดือนก่อน
*If video was helpful give a like PLEASE* LVGL ESP32-2432S028R learn how to add and use bitmap images and font symbols. Chapters: 00:00 - Aim to add and use Images and Font symbols? 00:18 - How to add Bitmap Image with EEZ Studio? 02:15 - How to add Font symbols like £? 04:20 - How to edit Font and add symbols? 05:07 - Generate C files for Arduino? 06:10 - Final Result? GitHub: github.com/nu150...
LVGL ESP32-2432S028R Add custom FONTS and use it on a label and buttons (Beginner)
มุมมอง 993หลายเดือนก่อน
*If video was helpful give a like PLEASE* LVGL ESP32-2432S028R CYD learn how to add and use custom FONTS on a label and buttons. Chapters: 00:00 - Aim to add custom FONTS? 00:13 - Download fonts from Google Fonts? 01:00 - How to add Orbitron font to EEZ Studio? 02:46 - Use Orbitron font on a label? 03:44 - Add Orbitron font 30 pixel? 04:39 - Add Orbitron font 40 pixel? 05:22 - Use the newly cre...
LVGL ESP32 2432S028R CYD Switch to turn LED on and off(Beginner)
มุมมอง 878หลายเดือนก่อน
LVGL ESP32 2432S028R CYD Switch to turn LED on and off(Beginner)
LVGL ESP32 2432S028R CYD Buttons to turn LED on and off(Beginner)
มุมมอง 1.2K2 หลายเดือนก่อน
LVGL ESP32 2432S028R CYD Buttons to turn LED on and off(Beginner)
LVGL ESP32 2432S028R Create circular speedometer with Arc, Spinner, Scale and Labels (Beginner)
มุมมอง 2.9K2 หลายเดือนก่อน
LVGL ESP32 2432S028R Create circular speedometer with Arc, Spinner, Scale and Labels (Beginner)
LVGL ESP32 2432S028R learn about SWITCH and handle events (Beginner)
มุมมอง 1.3K2 หลายเดือนก่อน
LVGL ESP32 2432S028R learn about SWITCH and handle events (Beginner)
LVGL ESP32 2432S028R CYD learn to handle ARC events (Beginner)
มุมมอง 5302 หลายเดือนก่อน
LVGL ESP32 2432S028R CYD learn to handle ARC events (Beginner)
LVGL ESP32 2432S028R CYD learn about button events (Beginner)
มุมมอง 7822 หลายเดือนก่อน
LVGL ESP32 2432S028R CYD learn about button events (Beginner)
LVGL ESP32 2432S028R CYD (Beginner) create a simple speedometer with Arc, Scale, Image and Label.
มุมมอง 9K2 หลายเดือนก่อน
LVGL ESP32 2432S028R CYD (Beginner) create a simple speedometer with Arc, Scale, Image and Label.
LVGL ESP32 2432S028R CYD create a simple game with Sliders, Dropdown, Button and Labels (Beginners)
มุมมอง 1.3K3 หลายเดือนก่อน
LVGL ESP32 2432S028R CYD create a simple game with Sliders, Dropdown, Button and Labels (Beginners)
LVGL ESP32 2432S028R CYD (Beginner) create a temperature bar with Bar, Button, Checkbox, Label
มุมมอง 1.5K3 หลายเดือนก่อน
LVGL ESP32 2432S028R CYD (Beginner) create a temperature bar with Bar, Button, Checkbox, Label
LVGL ESP32 2432S028R CYD (Beginner) tutorial on simple gestures/swipe to navigate between screen.
มุมมอง 2.5K3 หลายเดือนก่อน
LVGL ESP32 2432S028R CYD (Beginner) tutorial on simple gestures/swipe to navigate between screen.
LVGL ESP32 2432S028R CYD (Beginner) tutorial on creating a cool design with Slider and an Image.
มุมมอง 1.6K3 หลายเดือนก่อน
LVGL ESP32 2432S028R CYD (Beginner) tutorial on creating a cool design with Slider and an Image.
LVGL ESP32 2432S028R CYD (Beginner) tutorial on using Button events to navigate between screens.
มุมมอง 3.7K3 หลายเดือนก่อน
LVGL ESP32 2432S028R CYD (Beginner) tutorial on using Button events to navigate between screens.
Output on CYD once EEZ Studio GUI uploaded
มุมมอง 2234 หลายเดือนก่อน
Output on CYD once EEZ Studio GUI uploaded
LVGL ESP32 2432S028R CYD example with EEZ Studio
มุมมอง 4.6K4 หลายเดือนก่อน
LVGL ESP32 2432S028R CYD example with EEZ Studio
Subscribed, I'm looking for beginner lvgl tutorials🙏
"Hello, I just started using EEZ Studio, and I'm using Windows 11. I'm getting errors related to images during the build process, specifically with pypng and lz4. Can you help me with this, or could you share a video?"
It's in the description. I am using LVGL 9.1.0 in Arduino. I don't know what pypng/Iz4 is, it sounds like some python libraries. Unfortunately I have 0 knowledge of Python.
What software are you using
It's in the description. I am using LVGL 9.1.0 in Arduino.
Nice video
Hi does this only work for this spicific board, i bought this board to use as a built in screen for my dj controller not getting anywhere dont have coding knowledge or experience
I'm a beginner and I can tell you that it will be very hard if you don't have some coding knowledge.
Can you explain how to handle external push-button events? Navigation on Screen, Edit text, etc
would it be possible for the my text to be sent to the serial monitor
You can using Serial.println("some text or variable")
Hi, I will followed the steps inrandomnerdtutorials, but my display show the image with lines black and distorted image, doy you have any idea why does this happen?
Hi, I will followed the steps in randomnerdtutorials, but my display show the image with lines black and distorted image, doy you have any idea why does this happen?
Can you try and see if an example with simple button or image works. This one th-cam.com/video/NRyf-t-fDvw/w-d-xo.html uses one image. If that doesn't work maybe check if the following values are enabled/ON in User_Setups: Arduino\libraries\TFT_eSPI\User_Setups - #define TFT_INVERSION_ON - #define TFT_RGB_ORDER TFT_BGR
@@lvgl_beginner Yes, I applied those changes, but the image still looks distorted, it only happens when using files created with EEZ. Using code LVGL in files .ino, as showed in tutorials in randomnerdtutorial, the image looks good.
Can you check that you're using the correct version of LVGL. I was using LVGL 9.1.0 in Arduino.
@@lvgl_beginner YESSS, are you right! this was the problem!! thank youuu!!!!!🥳🥳🥳
Hi I like your videos but I would like you to do some tests on esphome LVGL thank you for your work
Can this be done in Platformio?
I haven't tried platformIO yet.
Hi. Thanks for you videos. Is this a custom code you created yourself? I cant use any events with EEZ Studio's events handler
You will need to build and copy the files over to your Arduino sketch. Events are than added there. github.com/nu1504ta0609sa0902/CYD_practice_projects/tree/main/EEZ_simple_multi_screen
Thanks for your work!
How to adjust the scale to be 180 degrees, like the final result?
Please see here for more information: th-cam.com/video/TGUtOXiPaHE/w-d-xo.html
😮🤩
Im really finding your videos useful, I have ordered a CYD and a Time of Flight sensor (VL53L0X) i'd like to be able to see the distance from the sensor displayed on the screen. If you ever are looking for a new video and have obe of these sensors, id love to see a demonstration. Keep up the great work friend
Does the touchscreen work with a finger?
Yes it works with finger and stylus.
Good explanation, now my question is, will that create the void septup and void loop part of the arduino sketch that have to be setup to control the led or that part have to be build separately?
Hello you can clone the project from GitHub: github.com/nu1504ta0609sa0902/CYD_practice_projects github.com/nu1504ta0609sa0902/CYD_practice_projects/tree/main/LVGL9/EEZ_bb_arc_dim_led I've updated the description with the project linksj.
Hi! It's good to me as good reference. But Only 1 is not got it which is How to make Arduino file xxx.ino. It is shown. Please let me know or guide me?
To create an Arduino sketch: - Open Arduino - File->New Sketch - Save the new sketch xxx.ino
sir please if my early comment not understandable due to poor english. my simple request is please make a short video explaining eez file put in arduino sketch.
This one th-cam.com/video/1fXV2woCHqA/w-d-xo.html It shows how to: - Create EEZ Project - Build GUI and generate C files at 4:00 - Copy files over to Arduino sketch
Thanks for giving your precious time.
@@lvgl_beginner I do same. First open a tutorial sketch and put EEZ generate file. It show in a sketch as you did. But when i upload it to cyd board its run a tutorial not EEZ project.
Hi a very usefull video for beginner.Thanks for your effort. 10:43 time stamp. as eez studio didnot make arduino sketch, so from where skectch file and code written in it come ?or we made a new sketch and save it.
Hi, you can download/clone the code from here: github.com/nu1504ta0609sa0902/CYD_practice_projects/tree/main/LVGL9/EEZ_bb_arc_dim_led
Hello friend, please help me out. I copied your zip-file "cool design slider and Image". But I get an Error "ld.exe: screens.c.o:(.literal.create_screen_main+0xc): undefined reference to _bg_img ".
Open the EEZ project in the *EEZ_yt_lvgl_83_simple_cool_UI/EEZ lvgl 83 simple cool UI.zip* and check the image files are there. They should appear in the bitmap tab in EEZ Studio. If not you can check this video on how to add them - th-cam.com/video/NRyf-t-fDvw/w-d-xo.html Than Save and Build the project and copy over the C files to your Arduino sketch. Hope this helps.
Thank you so much for start to share the sources!!
I am following up your all videos thanks ..also please make a video on charts 🙏
The £165 is the new Monthly fee if you were to use SquareLine Studio instead of EEZ Studio!..
Very good! Have you ever managed to read images from an SD card? When you put too many images, the memory becomes insufficient...
Where does the needle image come from, or where should a png be stored to show up?
You can upload any images using EEZ Studio, on the right side there is a tab called *Bitmap*. This might help: th-cam.com/video/NRyf-t-fDvw/w-d-xo.html I added the needle image in the assets folder: github.com/nu1504ta0609sa0902/CYD_practice_projects/blob/main/LVGL9/EEZ_circular_speedometer/assets/needle_mid-removebg-preview.png
thanks for this video
Suggestions for users of LVGL: I will use the LED widget a lot but I do not like the OFF state color... looks aweful. So instead I use LED OFF code: lv_led_set_color(objects.led_1, lv_palette_main(LV_PALETTE_GREY)); LED ON code: lv_led_set_color(objects.led_1, lv_palette_main(LV_PALETTE_RED)); or lv_led_set_color(objects.led_1, lv_color_hex(0xffe62c2c); // choose any hex color Alternatively, if you want to NOT have the 'glow' effect when off, you can use this code to color the LED if OFF state: LED OFF code: lv_led_off(objects.led_2); lv_led_set_color(objects.led_2, lv_color_hex(0xfffbfcfe)); //very light grey lv_led_set_brightness(objects.led_2, 170); LED ON code: lv_led_on(objects.led_2); lv_led_set_color(objects.led_2, lv_palette_main(LV_PALETTE_RED)); lv_led_set_brightness(objects.led_2, 255); NOTE: in the OFF state, setting the brightness higher will give you more 'glow' effect around the LED's edges. Anyhow, this works for me perfectly!
You are the only useful source on TH-cam for beginners to learn to use LVGL and EEZ Studio. 👏
Sir, thank you for your very helpful video's! I was playing this afternoon with your multiple button sketch and found out how to change the color of a led on the display instead of the button color. I did not know the lv_led_on and off function you showed so I learned some more today! Now I can use/display a LED as 'RGB' led or use simple on/off led's
thanks
Please keep up the good work very helpful.
thanks a lot for all your projects, very helpful , nicely explained .
super helpful, thanks for sharing!
Hi, I made this slide-image for my second screen. But when I press button to change to thes second screen CYD just hangs. Is it too weak to load the image I made? My CYD has no R. Background picture is 8,16 KB and Foreground is 23,3 KB. In EEZ included them under colorformat ARGB8888.
When I add an image I use RGB565 format, unfortunately that is all I can tell you. I've loaded images upto 200KB each using RGB565 format. Lots of things to learn.
@@lvgl_beginner maybe SD card is needed? Can I please send you my code and you will try on you display if it works. Somehow I can't compile this very example from your github.
please show arduino settings for this screen.
I use the ESP32 Dev Module with default settings. github.com/nu1504ta0609sa0902/CYD_practice_projects/blob/main/LVGL9/ESP32%20Dev%20Module.png github.com/nu1504ta0609sa0902/CYD_practice_projects/blob/main/LVGL9/ESP32 Dev Module.png
Which software is used ?
I use EEZ Studio to create UI: www.envox.eu/studio/studio-introduction/
The links in your description do not work.
It should work, try copy and pasting. Not sure why it's not working. github.com/nu1504ta0609sa0902/CYD_practice_projects/tree/main/LVGL9/EEZ_circular_speedometer
sounds like you making this video from ISS
I bought a new microphone, hopefully it will sound better. Sorry for the sound.
Niiiiiice
Thank you for putting time into making these videos. This one was useful - I just went to your repo and will be checking out your other ones - great job - thanks
Please which software is this?
I use EEZ Studio to create the UI. www.envox.eu/studio/studio-introduction/
Niiiice
I have question, in my program event handler my button can’t be use to control LED so what is solution or may i ask for github link? thankyou sir
This might help: th-cam.com/video/mk7B_LBags8/w-d-xo.html
Tutorial for Esp32-2432s028
Thank you so much for making these video's! I have problems with Squareline studio which is too complicated for me. EEZ studio seems more suitable for hobbyists
Hãy làm về loại màn hình 4.3 inch esp32 S3. Cám ơn
As usual, another excellent tutorial! Thanks!
Hi good work on the videos plz keep going, but can you tell me how you added an event handlers, thanks
I have a video on button event handling. th-cam.com/video/_AAg4TQdDpI/w-d-xo.html
@@lvgl_beginner thanks a lot, but i meant that there is an event handler from ezz Studio but i couldn't figure out how to use it