You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
838 lines
40 KiB
838 lines
40 KiB
<!DOCTYPE html>
|
|
<html lang="en">
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<head>
|
|
|
|
|
|
<!-- Global site tag (gtag.js) - Google Analytics -->
|
|
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-148999312-2"></script>
|
|
<script>
|
|
window.dataLayer = window.dataLayer || [];
|
|
function gtag(){dataLayer.push(arguments);}
|
|
gtag('js', new Date());
|
|
|
|
gtag('config', 'UA-148999312-2');
|
|
</script>
|
|
|
|
|
|
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
|
|
|
<link href="https://fonts.googleapis.com/css?family=Noto+Sans&display=swap" rel="stylesheet">
|
|
<link rel="icon" type="image/png" href="/favicon.png?v=10" />
|
|
|
|
|
|
<link rel="stylesheet" href="/scripts/lib/bootstrap/css/bootstrap.min.css?v=10">
|
|
|
|
<link href="/css/style.css?v=9a4cd35" rel="stylesheet">
|
|
|
|
|
|
<title>Tutorial: 10FPS Video with the OV7670 Module and Arduino - Circuit Journal</title>
|
|
<meta name="description" content='A step-by-step guide to building a circuit with the OV7670 module and an Arduino that sends live video to a 1.8 inch TFT.'/>
|
|
|
|
</head>
|
|
|
|
<body>
|
|
|
|
|
|
<div class="container-fluid">
|
|
<div class="row">
|
|
<div class="col">
|
|
<div class="side-to-side">
|
|
<picture>
|
|
<source type="image/webp" srcset="/img/header.webp?v=10">
|
|
<img style="width: 100%" src="/img/header.jpg?v=10">
|
|
</picture>
|
|
<div style="position: absolute; top: 50%; left: 50%; width: 10%; ">
|
|
<a href="https://circuitjournal.com/">
|
|
<img style="width: 100%; transform: translate(-50%, -50%); " src="/img/logo.png?v=10"/>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<nav class="site-menu py-1">
|
|
<div class="container content-width-limit">
|
|
<div class="row justify-content-center">
|
|
<a class="py-2 px-4 col-sm-auto col-12 text-center"
|
|
href="https://circuitjournal.com/how-to">
|
|
<span class="menu-active">How-To Guides</span>
|
|
</a><a class="py-2 px-4 col-sm-auto col-12 text-center"
|
|
href="https://circuitjournal.com/tools">
|
|
<span>Tools</span>
|
|
</a><a class="py-2 px-4 col-sm-auto col-12 text-center"
|
|
href="https://circuitjournal.com/about-me">
|
|
<span>About Me</span>
|
|
</a>
|
|
|
|
|
|
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
|
|
<div class="container content-width-limit">
|
|
<div class="pt-5 pb-2"></div>
|
|
<div class="row idclass-page-content" data-pageScripts="app/utils/ImageSelection">
|
|
<div class="col">
|
|
<article>
|
|
<section>
|
|
|
|
<h1 class="h2 pb-3 font-weight-bold">Tutorial: 10FPS Video with the OV7670 Module and Arduino</h1>
|
|
|
|
<p>
|
|
You can buy very cheap OV7670 camera modules from eBay or Aliexpress.
|
|
</p>
|
|
<p>
|
|
Getting them to work with an Arduino can be quite complicated.
|
|
It requires a lot of connections and precise timing on the software side.
|
|
</p>
|
|
<p>
|
|
<strong>
|
|
This article is a step-by-step guide for building all the necessary connections
|
|
on a breadboard. Then you can use my example code to run a 10fps
|
|
video live stream on a tiny display.
|
|
</strong>
|
|
</p>
|
|
<p>
|
|
The following video clip is a short demo of the camera in action.
|
|
In this video, you see a PCB version of the same circuit presented in this article.
|
|
</p>
|
|
<div class="row pb-3">
|
|
<div class="col-12 col-sm-8">
|
|
<div class="video-container"><iframe width="560" height="315" src="https://www.youtube.com/embed/TqSY6FETuos" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="pt-4"><div>
|
|
<p class="alert alert-secondary">
|
|
Disclosure: Bear in mind that some of the links in this post are affiliate
|
|
links and if you go through them to make a purchase I will earn a commission.
|
|
Keep in mind that I link these companies and their products because of their
|
|
quality and not because of the commission I receive from your purchases.
|
|
The decision is yours, and whether or not you decide to buy something is completely up to you.
|
|
</p>
|
|
</div></div>
|
|
|
|
<p class="pt-5">
|
|
<strong>
|
|
To follow this tutorial, you need:
|
|
</strong>
|
|
</p>
|
|
<ul>
|
|
<li>
|
|
An Arduino
|
|
<a target="_blank" href="https://www.banggood.com/custlink/K33G2p0Vi5">Uno</a> or
|
|
<a target="_blank" href="https://www.banggood.com/custlink/Km3KMpgt9n">Nano</a>
|
|
</li>
|
|
<li>
|
|
<a target="_blank" href="https://www.banggood.com/custlink/DvGGUJBVcl">The OV7670 camera module (without the FIFO chip)</a>
|
|
</li>
|
|
<li>
|
|
<a target="_blank" href="https://www.banggood.com/custlink/KGvGqre5gK">The 1.8 inch TFT module</a>
|
|
</li>
|
|
<li>
|
|
<a target="_blank" href="https://www.banggood.com/custlink/mG3GMrBP0F">A breadboard</a>
|
|
</li>
|
|
<li>
|
|
Two 10kΩ
|
|
<a target="_blank" href="https://www.banggood.com/custlink/Dv3GqpeH1f">resistors</a>
|
|
for the I<sup>2</sup>C connection to the camera
|
|
</li>
|
|
<li>
|
|
Six pairs of 650Ω and 1kΩ
|
|
<a target="_blank" href="https://www.banggood.com/custlink/Dv3GqpeH1f">resistors</a>
|
|
for signal voltage dividers
|
|
</li>
|
|
<li>
|
|
A bunch of jumper wires:
|
|
<a target="_blank" href="https://www.banggood.com/custlink/Dm33UrBo8a">male to male</a>,
|
|
<a target="_blank" href="https://www.banggood.com/custlink/D3GmMcBaiI">male to female</a>
|
|
</li>
|
|
|
|
</ul>
|
|
|
|
</section>
|
|
|
|
|
|
|
|
|
|
|
|
<section>
|
|
|
|
<h2 class="h4 pt-5 pb-3 font-weight-bold">Video Tutorial</h2>
|
|
|
|
<p>
|
|
A step-by-step guide in video form.
|
|
It has the same schematics I am using in this article.
|
|
</p>
|
|
|
|
<div class="row pb-3">
|
|
<div class="col-12 col-sm-8">
|
|
<div class="video-container"><iframe width="560" height="315" src="https://www.youtube.com/embed/Dp3RMb0e1eA" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div>
|
|
</div>
|
|
</div>
|
|
|
|
</section>
|
|
|
|
|
|
<section>
|
|
|
|
<h2 class="h4 pt-5 pb-3 font-weight-bold">1. Preparing the Screen</h2>
|
|
|
|
<p>
|
|
<strong>
|
|
Short the J1 connector on the back of the screen.
|
|
</strong>
|
|
Then the VCC pin of the display can be connected to the 3.3V pin of the Arduino board.
|
|
</p>
|
|
|
|
<div class="row pb-5 pt-3">
|
|
<div class="col-12 col-sm-8 col-md-6">
|
|
<picture>
|
|
<source type="image/webp" srcset="/img/articles/7_arduino_OV7670_10fps/tft_j1_short.webp?v=10">
|
|
<img alt="Short J1 on the back of the screen to enable 3.3V power input." style="width: 100%" src="/img/articles/7_arduino_OV7670_10fps/tft_j1_short.jpg?v=10">
|
|
</picture>
|
|
</div>
|
|
</div>
|
|
|
|
<p>
|
|
When I started experimenting with the 1.8 inch TFT,
|
|
I had faint vertical stripes going across the screen.
|
|
By default, the screen is configured to be powered by 5V,
|
|
but internally it operates at 3.3V levels.
|
|
I was able to get rid of those ghosting lines by
|
|
using 3.3V data signals (with voltage dividers) and switching the power input over to 3.3V.
|
|
</p>
|
|
|
|
<div class="row pb-5 pt-3">
|
|
<div class="col-12 col-sm-8 col-md-6">
|
|
<picture>
|
|
<source type="image/webp" srcset="/img/articles/7_arduino_OV7670_10fps/tft_ghosting.webp?v=10">
|
|
<img alt="Ghosting effect on the 1.8 inch TFT module." style="width: 100%" src="/img/articles/7_arduino_OV7670_10fps/tft_ghosting.jpg?v=10">
|
|
</picture>
|
|
</div>
|
|
</div>
|
|
|
|
</section>
|
|
|
|
|
|
<section>
|
|
|
|
<h2 class="h4 pt-5 pb-3 font-weight-bold">2. Connecting the 1.8 Inch TFT to Arduino</h2>
|
|
|
|
<p>
|
|
The input pins of the 1.8 inch TFT screen are not 5V tolerant.
|
|
You have to convert the Arduino 5V signals to 3V.
|
|
The easiest way to achieve that is to put voltage dividers on the signal wires.
|
|
</p>
|
|
|
|
<div class="row pb-5 pt-3">
|
|
<div class="col-6 col-sm-4 col-md-3">
|
|
<picture>
|
|
<img alt="Voltage divider from 5V to 3V" style="width: 100%" src="/img/articles/7_arduino_OV7670_10fps/voltage_divider.png?v=10">
|
|
</picture>
|
|
</div>
|
|
</div>
|
|
|
|
<p>
|
|
The full schematic for the connections looks like a rat's nest
|
|
and is a bit hard to follow.
|
|
I have divided it into steps to make it easier.
|
|
Click on the buttons to switch between the schematics.
|
|
</p>
|
|
|
|
<div class="image-selection">
|
|
<div class="row py-4">
|
|
<div class="col-12 col-md pr-md-1 py-1">
|
|
<button class="btn btn-article idclass-select-button text-nowrap active" style="width: 100%" data-u="u0">Schematic</button>
|
|
</div>
|
|
<div class="col-4 col-md px-md-1 py-1">
|
|
<button class="btn btn-article idclass-select-button text-nowrap" style="width: 100%;" data-u="u1">Step 1</button>
|
|
</div>
|
|
<div class="col-4 col-md px-md-1 py-1">
|
|
<button class="btn btn-article idclass-select-button text-nowrap" style="width: 100%" data-u="u2">Step 2</button>
|
|
</div>
|
|
<div class="col-4 col-md px-md-1 py-1">
|
|
<button class="btn btn-article idclass-select-button text-nowrap" style="width: 100%" data-u="u3">Step 3</button>
|
|
</div>
|
|
<div class="col-4 col-md px-md-1 py-1">
|
|
<button class="btn btn-article idclass-select-button text-nowrap" style="width: 100%" data-u="u4">Step 4</button>
|
|
</div>
|
|
<div class="col-4 col-md px-md-1 py-1">
|
|
<button class="btn btn-article idclass-select-button text-nowrap" style="width: 100%" data-u="u5">Step 5</button>
|
|
</div>
|
|
<div class="col-4 col-md pl-md-1 py-1">
|
|
<button class="btn btn-article idclass-select-button text-nowrap" style="width: 100%" data-u="u6">Step 6</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row pb-5">
|
|
<div class="col-12">
|
|
<picture>
|
|
<source type="image/webp"
|
|
srcset="/img/articles/7_arduino_OV7670_10fps/screen_pins_all_1_6.webp?v=10"
|
|
|
|
class="idclass-image-source"
|
|
|
|
data-u0="/img/articles/7_arduino_OV7670_10fps/screen_pins_all_1_6.webp?v=10"
|
|
|
|
data-u1="/img/articles/7_arduino_OV7670_10fps/screen_pins_1.webp?v=10"
|
|
|
|
data-u2="/img/articles/7_arduino_OV7670_10fps/screen_pins_2.webp?v=10"
|
|
|
|
data-u3="/img/articles/7_arduino_OV7670_10fps/screen_pins_3.webp?v=10"
|
|
|
|
data-u4="/img/articles/7_arduino_OV7670_10fps/screen_pins_4.webp?v=10"
|
|
|
|
data-u5="/img/articles/7_arduino_OV7670_10fps/screen_pins_5.webp?v=10"
|
|
|
|
data-u6="/img/articles/7_arduino_OV7670_10fps/screen_pins_6.webp?v=10"
|
|
>
|
|
<img alt="Schematic for connecting an Arduino to the to 1.8 inch TFT." style="width: 100%"
|
|
src="/img/articles/7_arduino_OV7670_10fps/screen_pins_all_1_6.jpg?v=10"
|
|
|
|
class="idclass-image-source"
|
|
|
|
data-u0="/img/articles/7_arduino_OV7670_10fps/screen_pins_all_1_6.jpg?v=10"
|
|
|
|
data-u1="/img/articles/7_arduino_OV7670_10fps/screen_pins_1.jpg?v=10"
|
|
|
|
data-u2="/img/articles/7_arduino_OV7670_10fps/screen_pins_2.jpg?v=10"
|
|
|
|
data-u3="/img/articles/7_arduino_OV7670_10fps/screen_pins_3.jpg?v=10"
|
|
|
|
data-u4="/img/articles/7_arduino_OV7670_10fps/screen_pins_4.jpg?v=10"
|
|
|
|
data-u5="/img/articles/7_arduino_OV7670_10fps/screen_pins_5.jpg?v=10"
|
|
|
|
data-u6="/img/articles/7_arduino_OV7670_10fps/screen_pins_6.jpg?v=10"
|
|
>
|
|
</picture>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<p>
|
|
<strong>
|
|
Add a Voltage divider to every connection made in steps 1 to 5.
|
|
</strong>
|
|
</p>
|
|
|
|
<p class="pt-4">
|
|
<strong>
|
|
Step 1. Connect the screen pin 1 (RST) to the Arduino pin 10.
|
|
</strong>
|
|
</p>
|
|
<p>
|
|
This is the reset pin.
|
|
It is used by the Adafruit library when initializing the screen.
|
|
</p>
|
|
|
|
<p class="pt-4">
|
|
<strong>
|
|
Step 2. Connect the screen pin 2 (CS) to the Arduino pin 9.
|
|
</strong>
|
|
</p>
|
|
<p>
|
|
Chip select pin.
|
|
Signal LOW – the screen is active and listening to the SPI port.
|
|
Signal HIGH – the screen ignores all the data on the SPI wire.
|
|
</p>
|
|
|
|
<p class="pt-4">
|
|
<strong>
|
|
Step 3. Connect the screen pin 3 (D/C) to the Arduino pin 8.
|
|
</strong>
|
|
</p>
|
|
<p>
|
|
Data/Configuration pin.
|
|
You can send either pixel data (image to be displayed) or configuration data (color format, screen orientation, etc.).
|
|
Input HIGH is for sending pixel data and LOW for sending configuration.
|
|
</p>
|
|
|
|
<p class="pt-4">
|
|
<strong>
|
|
Step 4. Connect the screen pin 4 (DIN) to the Arduino pin 11.
|
|
</strong>
|
|
</p>
|
|
<p>
|
|
SPI data input pin. The screen is listening to the SPI port if the CS pin is LOW.
|
|
</p>
|
|
|
|
<p class="pt-4">
|
|
<strong>
|
|
Step 5. Connect the screen pin 5 (CLK) to the Arduino pin 13.
|
|
</strong>
|
|
</p>
|
|
<p>
|
|
SPI clock pin. The screen is listening to the SPI port if the CS pin is LOW.
|
|
</p>
|
|
|
|
<p class="pt-4">
|
|
<strong>
|
|
Step 6. Connect the screen power pins. The pins 6 (VCC) and 7 (BL) to the Arduino 3.3V pin.
|
|
The screen pin 8 (GND) to the Arduino GND pin.
|
|
</strong>
|
|
</p>
|
|
<p>
|
|
Pin 7 is the signal to activate the backlight.
|
|
We connect it to the 3.3V, so the display is always lit.
|
|
The Arduino could control it, but in this project,
|
|
we need all the other Arduino pins for the camera connections.
|
|
</p>
|
|
<p>
|
|
Pins 6 and 8 are power pins for the screen.
|
|
Since we shorted the J1 connector, we need to use 3.3V input for the VCC.
|
|
</p>
|
|
|
|
</section>
|
|
|
|
|
|
<section>
|
|
|
|
<h2 class="h4 pt-5 pb-3 font-weight-bold">3. Test the Screen Connections</h2>
|
|
|
|
<p>
|
|
You should test the screen wiring before continuing with connecting the camera.
|
|
</p>
|
|
|
|
<p class="pt-4">
|
|
<strong>
|
|
1. Download the code of my LiveOV7670 project:
|
|
</strong><br>
|
|
<a href="https://github.com/indrekluuk/LiveOV7670">https://github.com/indrekluuk/LiveOV7670</a>
|
|
</p>
|
|
<p>
|
|
Click on the green "Clone or download" button and then "Download ZIP."
|
|
</p>
|
|
|
|
<div class="row pb-5 pt-3">
|
|
<div class="col-12">
|
|
<picture>
|
|
<source type="image/webp" srcset="/img/articles/7_arduino_OV7670_10fps/download_ov7670_project.webp?v=10">
|
|
<img alt="Short J1 on the back of the screen to enable 3.3V power input." style="width: 100%" src="/img/articles/7_arduino_OV7670_10fps/download_ov7670_project.jpg?v=10">
|
|
</picture>
|
|
</div>
|
|
</div>
|
|
|
|
<p>
|
|
Extract the downloaded ZIP file.
|
|
</p>
|
|
|
|
<p class="pt-4">
|
|
<strong>
|
|
2. Copy the the two libraries "LiveOV7670Library" and "Adafruit_GFX_Library"
|
|
from "src/lib" to your Arduino "libraries" folder
|
|
</strong>
|
|
</p>
|
|
<div>On Windows:</div>
|
|
<pre class="pl-4 text-muted">C:\Users\<username>\Documents\Arduino\libraries</pre>
|
|
<div>On Mac:</div>
|
|
<pre class="pl-4 text-muted">/Users/<username>/Documents/Arduino/libraries</pre>
|
|
|
|
<p>
|
|
"LiveOV7670Library" contains the code that communicates with the OV7670 camera module.
|
|
</p>
|
|
<p>
|
|
"Adafruit_GFX_Library" is a dependency of the "Adafruit-ST7735" screen library.
|
|
In this project, I am using a modified version of the Adafruit's ST7735 library
|
|
– "Adafruit_ST7735_mod.h" and "Adafruit_ST7735_mod.cpp" in the "src/LiveOV7670" folder.
|
|
The original was too slow.
|
|
To get it faster, I had to cut some corners in the method that sends pixel data to the display.
|
|
</p>
|
|
|
|
<p class="pt-4">
|
|
<strong>
|
|
3. Open "src/LiveOV7670/LiveOV7670.ino" and load it into your Arduino.
|
|
</strong>
|
|
</p>
|
|
<p>
|
|
This project takes advantage of some of the C++11 features.
|
|
C++11 is enabled by default since Arduino IDE version 1.6.6.
|
|
If, for some reason, you have an older version, then you should either
|
|
upgrade or enable C++11 in the Arduino IDE configuration file.
|
|
</p>
|
|
|
|
<p class="pt-4">
|
|
<strong>
|
|
4. If everything is connected correctly, then the screen should flash red.
|
|
</strong>
|
|
</p>
|
|
|
|
<div class="row pb-5 pt-3">
|
|
<div class="col-12 col-sm-8 col-md-6">
|
|
<picture>
|
|
<source type="image/webp" srcset="/img/articles/7_arduino_OV7670_10fps/tft_test.webp?v=10">
|
|
<img alt="First OV7670 connections test for the TFT." style="width: 100%" src="/img/articles/7_arduino_OV7670_10fps/tft_test.jpg?v=10">
|
|
</picture>
|
|
</div>
|
|
</div>
|
|
|
|
<p>
|
|
The solid red color means that the code wasn't able to detect the camera module.
|
|
But since we see the color, we can be sure that the screen wiring is OK.
|
|
</p>
|
|
<p>
|
|
If you do not see the red image, then check your wiring,
|
|
and make sure that you have shorted the J1 connector on the back of the screen.
|
|
</p>
|
|
|
|
</section>
|
|
|
|
|
|
<section>
|
|
|
|
<h2 class="h4 pt-5 pb-3 font-weight-bold">4. First Part of the Camera Connections – Power It Up</h2>
|
|
|
|
<p>
|
|
We will do the camera wiring in two phases.
|
|
In this chapter, we are going to make all the necessary connections
|
|
to get the camera running and configured by the Arduino.
|
|
</p>
|
|
|
|
<div class="image-selection">
|
|
<div class="row py-5">
|
|
<div class="col-12 col-md pr-md-1 py-1">
|
|
<button class="btn btn-article idclass-select-button text-nowrap active" style="width: 100%" data-u="u0">Schematic</button>
|
|
</div>
|
|
<div class="col-4 col-md px-md-1 py-1">
|
|
<button class="btn btn-article idclass-select-button text-nowrap" style="width: 100%;" data-u="u1">Step 1</button>
|
|
</div>
|
|
<div class="col-4 col-md px-md-1 py-1">
|
|
<button class="btn btn-article idclass-select-button text-nowrap" style="width: 100%" data-u="u2">Step 2</button>
|
|
</div>
|
|
<div class="col-4 col-md px-md-1 py-1">
|
|
<button class="btn btn-article idclass-select-button text-nowrap" style="width: 100%" data-u="u3">Step 3</button>
|
|
</div>
|
|
<div class="col-4 col-md px-md-1 py-1">
|
|
<button class="btn btn-article idclass-select-button text-nowrap" style="width: 100%" data-u="u4">Step 4</button>
|
|
</div>
|
|
<div class="col-4 col-md px-md-1 py-1">
|
|
<button class="btn btn-article idclass-select-button text-nowrap" style="width: 100%" data-u="u5">Step 5</button>
|
|
</div>
|
|
<div class="col-4 col-md pl-md-1 py-1">
|
|
<button class="btn btn-article idclass-select-button text-nowrap" style="width: 100%" data-u="u6">Step 6</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row pb-5">
|
|
<div class="col-12">
|
|
<picture>
|
|
<source type="image/webp"
|
|
srcset="/img/articles/7_arduino_OV7670_10fps/camera_pins_all_1_6.webp?v=10"
|
|
|
|
class="idclass-image-source"
|
|
|
|
data-u0="/img/articles/7_arduino_OV7670_10fps/camera_pins_all_1_6.webp?v=10"
|
|
|
|
data-u1="/img/articles/7_arduino_OV7670_10fps/camera_pins_1.webp?v=10"
|
|
|
|
data-u2="/img/articles/7_arduino_OV7670_10fps/camera_pins_2.webp?v=10"
|
|
|
|
data-u3="/img/articles/7_arduino_OV7670_10fps/camera_pins_3.webp?v=10"
|
|
|
|
data-u4="/img/articles/7_arduino_OV7670_10fps/camera_pins_4.webp?v=10"
|
|
|
|
data-u5="/img/articles/7_arduino_OV7670_10fps/camera_pins_5.webp?v=10"
|
|
|
|
data-u6="/img/articles/7_arduino_OV7670_10fps/camera_pins_6.webp?v=10"
|
|
>
|
|
<img alt="Schematic for connecting an Arduino to the OV7670 module." style="width: 100%"
|
|
src="/img/articles/7_arduino_OV7670_10fps/camera_pins_all_1_6.jpg?v=10"
|
|
|
|
class="idclass-image-source"
|
|
|
|
data-u0="/img/articles/7_arduino_OV7670_10fps/camera_pins_all_1_6.jpg?v=10"
|
|
|
|
data-u1="/img/articles/7_arduino_OV7670_10fps/camera_pins_1.jpg?v=10"
|
|
|
|
data-u2="/img/articles/7_arduino_OV7670_10fps/camera_pins_2.jpg?v=10"
|
|
|
|
data-u3="/img/articles/7_arduino_OV7670_10fps/camera_pins_3.jpg?v=10"
|
|
|
|
data-u4="/img/articles/7_arduino_OV7670_10fps/camera_pins_4.jpg?v=10"
|
|
|
|
data-u5="/img/articles/7_arduino_OV7670_10fps/camera_pins_5.jpg?v=10"
|
|
|
|
data-u6="/img/articles/7_arduino_OV7670_10fps/camera_pins_6.jpg?v=10"
|
|
>
|
|
</picture>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<p class="pt-4">
|
|
<strong>
|
|
Step 1. Make a voltage divider from the Arduino pin 3 to the XCLK pin of the camera.
|
|
</strong>
|
|
</p>
|
|
<p>
|
|
Similarly to the screen, the camera module is not 5V tolerant.
|
|
This is the only connection that needs a voltage divider on the camera side.
|
|
It's the single digital output signal from Arduino to the OV7670 module
|
|
(all the other ones are inputs for the Arduino).
|
|
</p>
|
|
<p>
|
|
XCLK is the input clock that makes the camera run.
|
|
The maximum frequency that Arduino can put out is 8Mhz.
|
|
For full speed, the camera module needs 30Mhz,
|
|
but eight is enough to display ten frames per second image.
|
|
</p>
|
|
|
|
<p class="pt-4">
|
|
<strong>
|
|
Step 2. Make the I<sup>2</sup>C connections.
|
|
Arduino pin A5 to SIOC and Arduino pin A4 to SIOD.
|
|
Then add a 10k pull-up resistors to 3.3V to both of the wires
|
|
(A5 to 10k to 3.3V, A4 to 10k to 3.3V).
|
|
</strong>
|
|
</p>
|
|
<p>
|
|
I<sup>2</sup>C is necessary for sending configuration data to the camera
|
|
(resolution, pixel format, etc.).
|
|
</p>
|
|
|
|
<p class="pt-4">
|
|
<strong>
|
|
Step 3. VSYNC to Arduino pin 2.
|
|
</strong>
|
|
</p>
|
|
<p>
|
|
It's a 3.3V signal from the camera to the Arduino.
|
|
This connection can be made directly without a voltage divider.
|
|
</p>
|
|
<p>
|
|
We need vertical sync to know when a new frame begins.
|
|
Otherwise, it looks to Arduino like a constant pixel stream with no start or end.
|
|
</p>
|
|
|
|
<p class="pt-4">
|
|
<strong>
|
|
Step 4. PCLK to Arduino pin 12.
|
|
</strong>
|
|
</p>
|
|
<p>
|
|
This is also a 3.3V signal from the camera to the Arduino
|
|
and can be connected directly.
|
|
</p>
|
|
<p>
|
|
Pixel cock is necessary for knowing the exact time when to read pixel data.
|
|
</p>
|
|
|
|
<p class="pt-4">
|
|
<strong>
|
|
Step 5. Connect power to the camera. From Arduino 3.3V pin to the camera's 3.3V input and
|
|
from Arduino GND pin to the camera's GND.
|
|
</strong>
|
|
</p>
|
|
|
|
<p class="pt-4">
|
|
<strong>
|
|
Step 6. Connect the camera's RESET pin to 3.3V and PWDN to GND.
|
|
</strong>
|
|
</p>
|
|
<p>
|
|
Reset pin could be used to reset the camera module and power down to turn it off.
|
|
But since we don't have any left-over pins, we let it run all the time.
|
|
</p>
|
|
|
|
</section>
|
|
|
|
|
|
<section>
|
|
|
|
<h2 class="h4 pt-5 pb-3 font-weight-bold">5. Validate That the Camera is Running</h2>
|
|
|
|
<p>
|
|
This is the second test before we get to the actual images from the camera.
|
|
</p>
|
|
<p>
|
|
When you start the Arduino again, then it should flash a green screen.
|
|
This means that the LiveOV7670 library was able to detect and configure the camera successfully.
|
|
</p>
|
|
|
|
<div class="row pb-5 pt-3">
|
|
<div class="col-12 col-sm-8 col-md-6">
|
|
<picture>
|
|
<source type="image/webp" srcset="/img/articles/7_arduino_OV7670_10fps/camera_conf_test.webp?v=10">
|
|
<img alt="First connection test with the OV7670 module." style="width: 100%" src="/img/articles/7_arduino_OV7670_10fps/camera_conf_test.jpg?v=10">
|
|
</picture>
|
|
</div>
|
|
</div>
|
|
|
|
<p>
|
|
You can't see any images yet since the pixel data pins are not connected.
|
|
</p>
|
|
|
|
<p>
|
|
If you still see the red screen, then check the wiring.
|
|
Make sure that the XCLK wire isn't too long.
|
|
The square wave of the input clock signal to the camera may become too deformed
|
|
for it to operate correctly.
|
|
</p>
|
|
|
|
</section>
|
|
|
|
|
|
<section>
|
|
|
|
<h2 class="h4 pt-5 pb-3 font-weight-bold">6. Second Part of the Camera Connections – Pixel Data Pins</h2>
|
|
|
|
<p>
|
|
Now we can finish the camera wiring by connecting pixel data inputs.
|
|
Pixels are streamed from the camera one byte at the time.
|
|
Each pixel consists of two bytes that are read sequentially.
|
|
</p>
|
|
|
|
<div class="image-selection">
|
|
<div class="row py-5">
|
|
<div class="col-12 col-sm pr-sm-1 py-1">
|
|
<button class="btn btn-article idclass-select-button text-nowrap active" style="width: 100%" data-u="u0">Schematic</button>
|
|
</div>
|
|
<div class="col-6 col-sm px-sm-1 py-1">
|
|
<button class="btn btn-article idclass-select-button text-nowrap" style="width: 100%;" data-u="u1">Step 1</button>
|
|
</div>
|
|
<div class="col-6 col-sm pl-sm-1 py-1">
|
|
<button class="btn btn-article idclass-select-button text-nowrap" style="width: 100%" data-u="u2">Step 2</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row pb-5">
|
|
<div class="col-12">
|
|
<picture>
|
|
<source type="image/webp"
|
|
srcset="/img/articles/7_arduino_OV7670_10fps/camera_pins_all_7_8.webp?v=10"
|
|
|
|
class="idclass-image-source"
|
|
|
|
data-u0="/img/articles/7_arduino_OV7670_10fps/camera_pins_all_7_8.webp?v=10"
|
|
|
|
data-u1="/img/articles/7_arduino_OV7670_10fps/camera_pins_7.webp?v=10"
|
|
|
|
data-u2="/img/articles/7_arduino_OV7670_10fps/camera_pins_8.webp?v=10"
|
|
>
|
|
<img alt="Schematic for connecting an Arduino to the OV7670 module." style="width: 100%"
|
|
src="/img/articles/7_arduino_OV7670_10fps/camera_pins_all_7_8.jpg?v=10"
|
|
|
|
class="idclass-image-source"
|
|
|
|
data-u0="/img/articles/7_arduino_OV7670_10fps/camera_pins_all_7_8.jpg?v=10"
|
|
|
|
data-u1="/img/articles/7_arduino_OV7670_10fps/camera_pins_7.jpg?v=10"
|
|
|
|
data-u2="/img/articles/7_arduino_OV7670_10fps/camera_pins_8.jpg?v=10"
|
|
>
|
|
</picture>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<p class="pt-4">
|
|
<strong>
|
|
Step 1. Connect Camera's D0 to D3 to the Arduino pins A0 to A3.
|
|
</strong>
|
|
</p>
|
|
<p>
|
|
These are the lower four bits of a pixel byte.
|
|
</p>
|
|
|
|
<p class="pt-4">
|
|
<strong>
|
|
Step 2. Connect Camera's D4 to D7 to the Arduino pins 4 to 7.
|
|
</strong>
|
|
</p>
|
|
<p>
|
|
These are the higher four bits of a pixel byte.
|
|
</p>
|
|
|
|
|
|
</section>
|
|
|
|
|
|
<section>
|
|
|
|
<h2 class="h4 pt-5 pb-3 font-weight-bold">7. Done!</h2>
|
|
|
|
<p>
|
|
Now you can power up your Arduino again.
|
|
It starts with a green image like in the previous test.
|
|
Then you should see a live video streamed from the camera to the display.
|
|
</p>
|
|
|
|
<div class="row pb-5 pt-3">
|
|
<div class="col-12 col-sm-8 col-md-6">
|
|
<picture>
|
|
<source type="image/webp" srcset="/img/articles/7_arduino_OV7670_10fps/camera_full_test.webp?v=10">
|
|
<img alt="10fps live video from the OV7670 module to the 1.8 inch TFT display." style="width: 100%" src="/img/articles/7_arduino_OV7670_10fps/camera_full_test.jpg?v=10">
|
|
</picture>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
</section>
|
|
|
|
|
|
</article>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div style="height: 10rem"></div>
|
|
|
|
<footer class="site-footer">
|
|
<div class="container content-width-limit">
|
|
<div class="row pt-3">
|
|
<div class="col">
|
|
<div class="font-weight-light">
|
|
</div>
|
|
<br>
|
|
<br>
|
|
<br>
|
|
<div style="color: #555555">
|
|
<span>Version</span>: <span>9a4cd35</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
|
|
|
|
<script src="/scripts/lib/jquery/jquery.min.js?v=10"></script>
|
|
<script src="/scripts/lib/popper/popper.min.js?v=10"></script>
|
|
<script src="/scripts/lib/bootstrap/js/bootstrap.min.js?v=10"></script>
|
|
<script src="/scripts/lib/require/require.js?v=10"></script>
|
|
|
|
|
|
<script type="text/javascript">
|
|
// force javascript re-load if code changes.
|
|
var jsVersion = "9a4cd35";
|
|
var jsLibVersion = "10";
|
|
|
|
requirejs.config({
|
|
baseUrl: 'scripts',
|
|
urlArgs: function(id, url) {
|
|
var v = id.startsWith('app') ? jsVersion : jsLibVersion;
|
|
return (url.indexOf('?') === -1 ? '?' : '&') + 'v=' + v;
|
|
}
|
|
});
|
|
|
|
requirejs(["app/main"], function(MainPage) {
|
|
MainPage.initMainPage();
|
|
});
|
|
</script>
|
|
|
|
</body>
|
|
</html>
|