Monday, October 14, 2013

RetroArch Overlay Borders

RetroArch has long had support for fun borders/backgrounds that can fill the unused black space on HDTVs using a specially crafted shader combined with an image, as described in a previous post. However, this system can be finicky and it isn't very forgiving of different screen sizes and aspect ratios. There is another way to achieve a similar outcome, though, using RetroArch's built-in overlay system.
Gameboy border pictured with Harlequin's Gameboy shader
This system was designed to provide onscreen touch controls for the Android and iOS ports of RetroArch, but we can use the same hooks on PC to display our borders. All you have to do is add this to the bottom of your retroarch.cfg:
input_overlay = "/path/to/overlay.cfg"
You can also load overlays directly from the in-game RGUI menu under Settings > Overlay Options.

The overlay.cfg file is extremely simple, containing only 4 short lines (you can either copy these into a blank text file yourself or use the one I include in the download at the bottom of the post):
overlays = 1
overlay0_overlay = border.png
overlay0_descs = 0
overlay0_fullscreen = true
 
This file tells RetroArch that there will only be 1 overlay, which image to load as the border (in this case, border.png, located in the same directory as the overlay.cfg), that there will be no buttons attached to the overlay (that is, for touchscreen controls) and that it will take up the full screen, including any black space.

In addition to these border effects, you can also use this system to apply semi-transparent overlay effects, such as scanlines, which can be useful in very low-power settings, such as on Raspberry Pis, homebrew-capable Nintendo Wiis or older cell phones that can't handle even lightweight scanline shaders. Even some MAME "rgb" effects can be used with this system with minor modification.

This system will work fine with the borders from my previous post, and here's a bunch more (formatted for 1920x1200 displays) from NeoGaf user richisawesome.

Here is the download (contains border.cfg, two example borders and an integer scale Cg shader, though the shader should not be necessary now that you can force integer scaling through RGUI):

Analytics Tracking Footer