Arduino Project: 1.8″ DIY Photo Frame using an Arduino Nano and a 1.8″ ST7735 Color TFT display.
Articles Blog

Arduino Project: 1.8″ DIY Photo Frame using an Arduino Nano and a 1.8″ ST7735 Color TFT display.

September 12, 2019


Dear friends welcome to another video! This
is Nick from educ8s.tv and today we are going to build this small but impressive digital
photo frame using an Arduino. Without any delay, let’s get started! If you have watched some of my previous videos, you may have noticed that I use this 1.8”
color TFT display a lot recently. The reason for that is that this display is very easy
to use, it costs less than $5 and it offers color! At the back, the display has an SD
card slot, so I thought that we have to learn how to use that as well. As it turned out,
it is really easy to use the SD card slot of the display! That makes this display even
better. The project that we are going to build today
is this. A simple photo frame which loads images from the SD card. I have placed some
.bmp images in the SD card and the project loads them and displays them at the display
in full color! As you can see the speed of the project is very high if we take in consideration
that the brains of this project is the old and slow Arduino Nano. In my opinion, this
is really impressive. But let’s now see how to build this project.
The parts needed in order to build this project are these:
• An Arduino Nano • A 1.8” Color TFT display
• A small breadboard • Some wires
• An SD card The cost of the project is around $15 but
I am sure you already have some of these parts available so you can build this project with
even less money. You can find link for all the parts in the description of the video.
Let’s see how to build this project. In order to use the SD card slot with Arduino
we need to connect these 4 top pins of the display with Arduino. In have soldered some
female header pins to them and we are ready to connect them. The SD card module uses the
SPI protocol in order to communicate with Arduino. So we have to use the hardware SPI
pin of the Arduino Nano. The SD_CS pin goes to Digital Pin 4. The SD_MOSI pin goes to
Digital Pin 11, the SD_MISO goes to Digital Pin 12 and lastly the SD_SCK pin goes to digital
pin 13. That’s it. Now we are ready to connect the bottom pins of the display. In order to
see how to connect the display check the detailed tutorial I have prepared on that a few months
back. You can click on the card here in order to watch this video. Both the display and
the SD card module are use the SPI pins so on some Arduino SPI pins we have connected
two wires! OK, now we are ready to power up the project. As you can see, everything is
working as expected and the images are displayed on the screen one after another.
Let’s now see the software side of the project. In order to achieve that result we have to
use Adafruit’s libraries for the ST7735 display. We also need the Adafruit GFX library.
Adafruit has made an amazing job with the library for the ST7735. The spitftbitmap example
loads an image from the SD card and displays it on the display. I slightly modified that
code in order to loop forever, load more images and use the landscape orientation of the display.
As always you can find the code of the project in a link in the description of the video.
With the bmpDraw function that the example offers we can easily load and display bitmap
graphics in our projects! You have to be sure though, that your bitmaps have the correct
format. In order to convert the images to correct format for this project, I used the
Paint.net free software for windows. I loaded my images and then I resized in the correct
resolution for the display which is 160×128 pixels. Then I saved the images as .bmp files
with a bit depth of 24bits. That’s it, all we have to do now is to save them in the SD
card and call the command bmpDraw with the name of the file.
As you can see, we very easily build impressive projects using Arduino. This display has become
my favorite, because it is so easy to use and offers so much for such a low price. Its
library support is great, so I am going to use it even more in the near future. I am
going to prepare another tutorial about this display soon, in order to see how to load
graphics, and how to draw simple shapes. I would love to hear your opinion about this
display. Do you use it in your projects? If so, do you have any tricks to share with us?
Please post your comments in the comments section below. Thanks! If this is your first time here, I would love
to have you subscribed. In this channel I post videos about DIY projects every Saturday.
I love making things and I believe that anyone can make things, anyone can become a maker.
That’s why I created this channel, in order to share my knowledge with the community and
learn from the community. I hope you will join us. Until next Saturday, Watch, Learn,
Build! [ Translating these subtitles? Add your name
here! ]

Only registered users can comment.

  1. I don't understand why did you bought these super expensive Eneloop pro batteries (not used in this video) after saving money so much on cheap Chinese Arduino clones. Can you explain it to me, please?

  2. If you change the "#define BUFFPIXEL" String you'll have faster image displaying. i set it to 85 instead of 20 and it's fastest that you can imagine! Be careful because 85 it's the maximum buffer that the atmega 328 can achieve

  3. Hi Nick! I have some suggestions for you
    1) Please change the cutting mat. Its color is awful. Maybe you can put your channel logo on some glossy paper.
    2) Our language is pretty wide. So, please dont use "in order to" every time.
    3)Change the Feynmann's quote every single video.
    4)Change the music which is always same and it makes me crazy.

    All my respect

  4. educ8s.tv your videos are very informative and easy to understand… I would love it if u make a video on how to use the 128×64 graphic LCD display.. please make one.. I haven't found any easily understandable video on youtube

  5. Nice explanation Sir.

    I am working on Internet of things project.
    As a initial stage of prototype , i have interfaced esp8266-01 wifi module with arduino uno and LCD(16*2).

    The communication between Esp8266 and webpage is working fine with AT commands.
    I used C programming.

    Now I have a web page where I have two text box and submit button.

     When I type some text on text box and click on submit button, the text should appear on LCD.
    I am new to web and server.
    I tried using GET method in html ,but could not achieve.

    Any Idea sir.

    Thank you.

  6. Hi, in programme is mistake, which forges colours:
    ……………………………………………………………………………………………………….
    // Convert pixel from BMP to TFT format, push to display
    b = sdbuffer[buffidx++];
    g = sdbuffer[buffidx++];
    r = sdbuffer[buffidx++];
    //tft.pushColor(tft.Color565(r,g,b)); //it was
    tft.pushColor(tft.Color565(b,g,r)); //it should be
    } // end pixel
    ……………………………………………………………………………………………………….

  7. Great video. When a new image is loading, the colours of both the old image and the new image are paler. When the new image is loaded the colours are fine. In your video, that problem is not apparent. Do you know the reason for the paler colours during image transition ?

  8. Sir this is to inform you that please make a 2.4 tft LCD screen with Arduino uno photo frame and please give me the code thank you

  9. Is there a way to send images using WiFi? Ex. Creating a basic website that sends the image to the display?

  10. Hi thanks for this video. I’m going to use the Adafruit 1.54″ TFT LCD Display with MicroSD – ST7789 with an Arduino UNO. My goal is to load several images on the flow and make a low fps animation. Is the refresh rate good or I’ll see the scanline when changing the image? It should be noted that all images are really little different. Thanks in advance!

  11. how about display image with value of some sensors ? so the value of sensors position is on top of the image ? is it possible ?

Leave a Reply

Your email address will not be published. Required fields are marked *