Welcome back to my FPGA graphics tutorial series using the Digilent Arty or Basys3 boards. In part 2 we introduced bitmapped displays and loaded graphics files into memory. In this third part we animate sprites using bitmaps and double buffering: this classic technique is a staple of 2D games. By the end of this tutorial you'll be able to control a sprite using the switches on your FPGA board.
The principle of double buffering is simple: you draw on one buffer while driving the monitor from the other. This gives you an entire frame time (1/60th second) to create your image, whilst avoiding any screen tearing. There are two downsides: you need twice the memory and you increase latency by one frame. Read More
Welcome back to my FPGA graphics tutorial series using the Digilent Arty or Basys3 boards. In part 1 we created a VGA module and used it to animate squares on screen. In this second part, we introduce bitmapped displays. By the end of this tutorial, you'll be able to load your own image into FPGA memory and display it on your monitor.
Bitmaps Read More
A bitmapped display is backed by a memory array: each pixel corresponds to a location in memory. To create the display we read out the value of the current pixel from its memory location. To set the colour of a pixel, we modify the contents of its associated memory location. Bitmaps provides two significant benefits: we're free to create sophisticated graphics using whatever technique we like, and the setting of pixel colour is separated from the actual screen drawing process. The big downside of a bitmapped display is we need significant memory to store our pixel data.
You Need Video Timings
To work with standard monitors and TVs you need to use the correct video timings. This recipe includes the timings for three common modes using analogue VGA, DVI or HDMI: 640x480, 1280x720, and 1920x1080 all at 60 Hz.
Video Signals in Brief Read More
Video signals have two phases: drawing pixels and the blanking interval. The sync signals occur within blanking intervals; separated from pixel drawing by the front porch and back porch. Horizontal sync demarcates a line and vertical sync a screen. The following diagram illustrates the different parts of the display signal for 640x480 at 60Hz; the HD resolutions work in a similar way.
You want to use Block Ram in Verilog with Vivado
There are two types of internal memory available on a typical FPGA:
- Distributed Ram: made from the FPGA logic (LUTs)
- Block Ram: dedicated memory blocks within the FPGA; also known as bram
However, persuading Vivado to make use of block ram isn't simple a case of changing a preference. You need to create a Verilog implementation that Vivado can infer as block ram. This recipe looks at inferring block ram on Xilinx 7 Series FPGAs (Spartan-7. Artix-7, Kintex-7, and Virtex-7), but this information should be relevant to other developers too. Read More
You want to initialize memory from a file using Verilog.
It's common for a simulation or firmware to need data loading into a memory array. Fortunately Verilog provides the $readmemh and $readmemb functions for this very purposes. Unfortunately there is a dearth of good Verilog documentation online, so using them can be harder than it should be. This article explains the syntax and provides plenty of examples, including how to do this in Xilinx Vivado. Read More
This tutorial series introduces video graphics programming using FPGAs, starting with creating a VGA driver and moving onto more advanced features including bitmaps, sprites and effects. FPGAs excel at high-speed I/O and custom logic: you'll be surprised how much you can achieve with a few lines of Verilog.
This series is designed around the Digilent Arty and Basys 3 boards. If you're using the Arty you also need the VGA Pmod (the Basys3 has VGA output built-in). Detailed requirements are given below. Read More
This is the third part of my tutorial series on programming the Digilent Arty FPGA dev board with verilog. In this part we use the push buttons to control the brightness of the LEDs and learn about button debouncing. Read More
Welcome back to my FPGA tutorial series with the Digilent Arty dev board and Verilog. In this second part we're going to use the 100 MHz clock on the Arty board to control the LEDs. We can obviously use the clock to flash the LEDs on and off, but the clock also allows us to control the brightness of the LEDs using a technique called pulse width modulation (PWM). PWN is commonly used in digital circuits to control the speed of motors as well as the brightness of lights (for example in the backlight of LCD screens). Finally we'll make use of PWM to control the colour of the RGB LEDs. Read More
This Time to Explore tutorial series provides an introduction to development using FPGAs (Field Programmable Gate Arrays). On a microcontroller or PC you write software to run on an existing CPU. With an FPGA you develop the hardware itself at the logic level. This makes FPGAs uniquely flexible and powerful: especially when dealing with complex or parallel tasks and high-speed I/O such as networking and video.
However, FPGAs are more than just a faster way to do what you already do; they're a fundamentally different tool that can solve many problems that would otherwise be impractical. Different materials have different properties: metal is not simply shiny plastic it has its own strengths and weaknesses. The same applies to FPGAs and microcontrollers: they can be used for some of the same purposes, but are fundamentally different. It's difficult to convey this in words: you really do need to experiment with FPGAs yourself to appreciate what they can do.
Finally, I find working with FPGAs gives me a sense of delight so often lacking in modern software development. There's something deeply satisfying about designing at the hardware level, be it drawing graphics on a screen, producing sound from a speaker, or even implementing your own arcade game from scratch. I hope you find these tutorials useful and have fun experimenting with FPGAs. Read More