Photoframe Front View

Digital Photo Frame Using Raspberry Pi (With Weather)

I had bought several digital photo frames over the recent years. I was never truly satisfied with any of them. With some, the GUI was hard to use, others the screen was not very good and some just stopped working completely.

After having my Raspberry Pi for a couple of months I realised that I could make my own digital photo frame, using a Raspberry Pi and a monitor of my choice.  This would allow me to use an operating system that I liked and a monitor of my choice that was as big as I liked.

Choosing An Operating System

After a google search, I found massively complicated solutions that didn’t really suit my situation or level of expertise at this moment. I gave up for a few days.In the meantime I discovered Openelec an operating system for the Raspberry Pi (and many other devices) that I then used as a media centre on another Raspberry Pi. After discovering that I could set a slideshow as a screen saver, it gave me the idea to use Openelec on the Raspberry Pi and run the slideshow from the slideshow screensaver. After installing a test version on the Raspberry Pi I realised that having Openelec running on the Raspberry Pi would allow this device to do much more then just show photos. Using features built into the XBMC media centre, it could show the weather, play videos and much more.

Installing Openelec

Openelec can be downloaded as a disk image from the Raspberry Pi Foundations website or their own website. There is another option and that is to use the NOOBS installer that can also be downloaded from the Raspberry Pi foundations website. This installer will allow you to select Openelec from a list and the installer will download and install the operating system automatically.

For more detail on how to install the operating system see my other post Installing OS on Raspberry Pi.

Choosing A Monitor

The monitor is basically your own choice, however it will need a HDMI port to connect to the Pi. The size of my monitor was limited only by the size of the cupboard where it was going to go. After some research, taking into account my size limitation and efficiency, I decided to use a 27 Inch Dell, the S2740L.

Where To Put Your Photos

There are a few options about where to put your photos. The first option, and in my opinion the best option, is to put your photos on a external USB flash drive. This will allow easy transfer of files between your computer and the photoframe. It also allows the storage to increase with future demands.

Another option is to place the photos on the SD card itself. I found this to slow down the Pi slightly. This would also mean that if the storage needed to be updated a new SD card would be required and this would lead to you needing to reinstall the operating system and configure everything again.

The 3rd option is to keep your files on a network drive. This sounds like a good idea however in practice it caused a lot of network traffic and slowed down the whole process. This also led to the screensaver taking about 15 seconds to load.

Setting Up Openelec

After the operating system is installed, the next step is to set up the operating system to work less like a media centre and more like a digital photo frame. You will need a keyboard and/or mouse and have your Pi connected to your display.

Once Openelec has been installed you will be presented with the following screen. If you are using a different skin it may look a little different however the basic principles are the same.

The first XBMC screen after a fresh install
The first XBMC screen after a fresh install

Set Up Network (WIFI)

Note: This will require you to have a compatible USB WIFI adapter plugged into your Pi. 

Firstly navigate to the programs section on the XBMC home screen. Click on the ‘programs’ menu

Once in the programs menu it will show you the list of add-ons that you have. One of them should be called OpenElec configuration. Click on this one.

A new window should open up in a few seconds that will display the OpenElec settings. Navigate to the connections menu on the side of the window. This should display a list of the WIFI connections available near you. Select your one by clicking on it.

A prompt will appear for you to type in your password.

Press Ok. You will then be taken back to the previous menu where you can see the status of your connection. If all goes well this should change to connected. After it is connected return to the home screen.

The first step is to set up the slideshow screen saver.

We are going to use the slideshow screensaver to display the photos for this photoframe.

To do this first move to the ‘system’ tab on the home screen and then go down to the ‘settings’ sub menu. This can be done with the mouse or arrow keys.

XBMC with settings highlighted
XBMC with settings highlighted

In the ‘settings’ menu go to the ‘appearance’ tab.

XBMC with appearance highlighted
XBMC with appearance highlighted

In this menu select the ‘screensaver’ tab

XBMC With screensaver highlighted
XBMC With screensaver highlighted

Once in this menu navigate to the menu ‘screensaver mode’ and click.

XBMC with screensaver mode selected
XBMC with screensaver mode selected

In this menu you want to navigate to the ‘Get More’ button.

XBMC with get more highlighted
XBMC with get more highlighted

Once in the ‘get more’ menu navigate through the list of add-ons until you find one called ‘Slideshow’. Click on the slideshow add-on.

XBMC with slideshow highlighted
XBMC with slideshow highlighted

Another window will open. ‘Click install’.

XBMC with slideshow install highlighted
XBMC with slideshow install highlighted

XBMC will now download the add-on and install it for you. After the add-on is installed you will be returned to the add-ons selection menu. There should be writing next to the slideshow add-on that states enabled.

XBMC with slideshow enabled
XBMC with slideshow enabled

Press escape. This will return you to the screensaver screen, select the screensaver mode again.

XBMC with screensaver mode selected
XBMC with screensaver mode selected

Once the screensaver options windows is open go down and select the slideshow add-on that you just installed.

XBMC with slideshow selected
XBMC with slideshow selected

You will be taken back to the main screen saver menu. You will notice that next to the ‘screen saver mode’ menu it will now say ‘slideshow’.

XBMC with slideshow selected
XBMC with slideshow selected

The next step is to select the settings menu on the same screen.

XBMC with settings selected
XBMC with settings selected

A new window will open. Under the basic tab you want to set the ‘source of slideshow images’ to “Image Folder”. Set the folder to the location of where your photos are stored. Under the ‘amount of seconds to display each image’ set the time in seconds that you want the pictured to be displayed for. Dim level should be set at 100%. You can set the effect to any setting you want, however I like the default Pan and Zoom.  After being setup, mine looks like the picture below.

Slideshow with basic configured
Slideshow with basic configured

You can have a look at the additional and advanced menus however I didn’t need to change any of them. Click Ok when you are done.  Note: If you don’t press ok your changes will not be saved.

XBMC with screensaver settings. Ok highlighted
XBMC with screensaver settings. Ok highlighted

In the main screensaver menu you can now select how long the machine is idle for before starting the screensaver. I have mine set to one minute.

Main screensaver menu
Main screensaver menu

You can now press ‘escape’ until you arrive back at the home menu again.

At this point you should have a working digital photo frame powered by the Raspberry Pi. Just wait 1 minute for the screensaver to start.  If this is all you want then you can stop here however, there are many other features that you can enable to make this photo frame even better.

Configuring Weather

Configuring Location

Another feature of my photoframe that can easily be configured is the ability to have the weather automatically displayed when the photo frame starts and when it is brought back from the screensaver.

From the home screen navigate to the ‘system’ tab and select the submenu ‘settings’.

XBMC with settings highlighted
XBMC with settings highlighted

Navigate to the ‘weather’ tab inside the settings menu

XMBC settings with weather highlighted
XMBC settings with weather highlighted

You will be presented with the following window. The default weather provider is “weather underground” which is quite good and covers a large amount of places. Others can be selected, expanding the capabilities of the weather feature, however this will be covered in another of my posts later. At the moment you want to navigate to the settings tab.

XBMC weather settings
XBMC weather settings

When you open this menu you will want to select the ‘enable’ button and then go down and click on location 1.

XBMC weather settings open
XBMC weather settings open

This will bring up a window with a place for you to enter your current city or at least a big city near you. For example, I am going to enter Sydney. Press ‘done’ on the side panel when you are finished.

Sydney entered into weather prompt
Sydney entered into weather prompt

Depending on your internet connection and how many results are returned, it may take a couple of seconds until the following window is displayed. Select the city that you want from the list. For this example I am going to select Sydney Australia.

Weather with Sydney Australia Selected
Weather with Sydney Australia Selected

You should be returned to the main “weather underground” settings screen and your location should be in the location 1 slot. If this is correct press Ok.

Weather underground with sydney in location 1
Weather underground with sydney in location 1

You can now press escape and return to the home screen. Select the weather tab to check that it works.

XBMC home screen with weather selected
XBMC home screen with weather selected

If everything is working the following screen should display the weather for your location and look something like the following picture.

XBMC displaying weather
XBMC displaying weather
Configuring Weather To Start By Default

After you have the weather working correctly it is now time to configure XBMC to automatically open the weather tab.

To do this first go to the ‘system’ tab on the home screen and then select the ‘settings’ sub menu.

XBMC with settings highlighted
XBMC with settings highlighted

Next select ‘appearance’ from the side menu.

XBMC with appearance selected
XBMC with appearance selected

Stay on the ‘skin’ tab and navigate to the menu called ‘startup window’. At the moment this will say home window.

Appearance settings with skin and startup window highlighted
Appearance settings with skin and startup window highlighted

Using the arrows change the item listed from ‘home window’ to ‘weather’.

XBMC with startup window set to weather
XBMC with startup window set to weather

Restart the Raspberry Pi. When the Raspberry Pi boots up again it will display the weather until it has sat idle for one minute (or however long you set) before automatically starting the slideshow. Viewing the weather again is as simple as moving the mouse or pressing a button on the keyboard.

After my photo frame was working correctly I removed the mouse and left the keyboard connected. The keyboard now lives in the drawer below the photo frame so that it is just a simple press of the space bar to bring up the weather. Below are some photos of the finished product.

This photo frame will be getting better when I have time to work on it and any improvements will be posted in this blog.

Photoframe Front View
Photoframe Front View
Photoframe With Keyboard
Photoframe With Keyboard
Photoframe With Weather
Photoframe With Weather
Photoframe Picture Of Raspberry Pi
Photoframe Picture Of Raspberry Pi

One thought on “Digital Photo Frame Using Raspberry Pi (With Weather)”

Leave a Reply