Basic animation in your SPI LCD touchscreen
ฝัง
- เผยแพร่เมื่อ 29 พ.ย. 2020
- Once you've got your LCD touchscreen working it opens up a vast array of possibilities to enhance your Arduino projects. You can create games, control panels, information displays or anything else that can use a screen output.
The Adafruit GFX library contains a full set of graphics functions to let you develop your project.
In this video I'll show you how to use the library and where to find out what functions it provides. But I'll also show you the limitations of these SPI screens in terms of speed for animations.
To get animated objects on the screen you need to use an overdrawing method as the data transfer speed is too slow to clear the screen every frame. I'll cover this and then show you how to modify and optimise your code to get smooth animated displays.
All the code used in this video is available on the project page in my website.
bytesnbits.co.uk/basic-animat...
You can easily get hold of one of these touchscreens at Amazon or eBay.
Amazon: amzn.to/39ZyWMD
eBay : ebay.us/sOCSyI
Adafruit GFX Library Tutorial
learn.adafruit.com/adafruit-g...
Once again a marvellous video, well explained. I learned a lot. Going from basic "Arduino" style coding to using C++ classes feels like coming out of the stone age! :) Your effort is very much appreciated!
Hi Patrick. No problem. Moving to Object Orientated Programming makes complex coding so much easier by breaking up the problems into well defined blocks. Glad you found it useful.
Absolutely awesome tutorial that deserves much more views. Thank you!
Glad you enjoyed it!
Thanks Bytes N Bits. Perfect explanation !!
No problem. I hope it was useful.
That blew my mind, thank you sir
Glad you liked it!
Man, you are AWESOME !!!!
Hi Unai. Thanks.
Good video. Keep up the good work
Thanks
Excellent tutorial, and I was quite surprised to hear the N.Irish accent! Takes me back to the learning graphics on the old 386 and eventually moving to assembler to write directly to the VGA memory with all the clever smoke and mirrors type effects that could make it look like you were doing impossible things. 50hz of course being the correct refresh rate :-)
Thanks for the comments. Have fun with the coding.
Brilliant vid! Thanks.
Do you have an example of a chasing style graphic? I am programming a watering system and I want to have a mimic indicating the pump running and water flowing through the pipe. Thanks.
Hi. Unfortunately this setup requires you to do the animations yourself. Even animated gifs, etc. need you to handle the frame changes in code. My advice would be to create a 2 frame animation of a short horizontal and vertical pipe (basically 2 image files per direction). Draw frame one in place, then a short time later draw frame 2 over the top of it. Place multiple short lengths together to make longer pipes. Maybe use a non animated corner piece.
Good luck!
Nice and use full
Great. I hope you got it working OK.
Very, very interesting channel... I just bought 4 of these LCD and wanted to program them. This video will be very useful!! Thank you! One question: what's the maximum clock for SPI transfers referred to this kind of LCD? I want to drive these with a STM32F103 or a STM32F429.
Indeed, an LCD with SPI is very useful with STM32 because they are not fast enough when using GPIO I/O...
Hi. The data sheet timings suggest about 10MB/s data rate but I know people are running it at much, much higher. About 80MB/s gives you a 60Hz frame rate and some are getting this so I guess it's a matter of trying it out. I've just bought a new RPi Pico so plan some tests with that.
Have fun and let me know how you get on.
Thanks for the answer! I will try it in a few days...
Good video, can a query be used without a pencil?
Yes. Both resistive and capacitive screens will work with a finger. These resistive screens basically work with anything that presses on the touch panel.
can you suggest proteus simulation for this project ??
Hi. Sorry, I don't use Proteus.
Can you do with GIF images?? I wanna built a touchscreen DIGI PET with this
You'll need to either find a library that handles GIF format files or write your own. You need to be able to break it down to pixels. Have a look in the Adafruit graphics library. It may well handle GIF.
Dear sir, how do I start drawing on the LCD display? I have all the libraries uploaded. Need to configure the screen? I have a 2.8 inch LCD. Please help. Well thank you.
Hi. Is your LCD powered by the ILI9341 driver. If not you'll need to load the correct driver version that matches your screen. Most drivers are in the library package.
SD card - did you get it to work with this display?
Hi. I haven't had a play with the SD card yet. I'll be making another video soon using some images stored on the card. Keep an eye out for that one in a couple of weeks.
@@BytesNBits yes sir please make soon i need to learn to be make my project
I just redraw the rectangle(or bmp, ect) in background colors, so it gets erased and then draw a new rectangle in the new position in normal colors again. That is faster than refreshing a whole bar.
That sounds good.
Only showing white screen, nothing showing, how to solve this problem
Hi. I've replied on your other comment.
Hi Bob, great tutorial, very well made and a pleasure to follow along with. Just one comment, for anyone copy/pasting code from the website into Arduino IDE, change < to < and > to > and & to &.
Thanks for the info! My code highlighter on the website has messed up some of the older posts. I'll have to go through and update them.
What does that mean? I'm really trying to learn this stuff. Maybe I'll look it up Xy
Intro is too loud :-//
Hi. Sorry about that :)
Bob, I don't know what is going on but the files you have put on your website for us to download are nothing like what you show us here, this file on your site has the setup in the wrong place half way through the script and the script does not match what you show on here, Also some of your other script files have C++ code in them which will not run in the Arduino IDE, Pretty abysmal really and I am thinking you don't care as I have messaged you twice and you have not bothered to respond. Bob. UK
Sorry you're having problems. I've had a look at the code. It's all OK apart from the website code renderer has replaced the < symbols with the html code < and > with >. I think this is on the older code listings. Do a find and replace and the code should compile, though do have a look in case some other characters have been replaced.
I assure you I do care. This is why I post these videos. I try to answer as many comments as I can.