Tag Archives: cv2.putText()

Creating a Bouncing Ball Screensaver using OpenCV-Python

A screensaver is a computer program that fills the screen with anything you wish when the computer is left idle for some time. Most of you might have used a screensaver on your laptops, TV etc. In the good old days, they used to fascinate most of us. In this blog, we will be creating a bouncing ball screensaver using OpenCV-Python.

Task:

Create a Window that we can write text on. If we don’t write for 10 seconds screensaver will start.

For this we need to do two things:

First, we need to check whether a key is pressed in the specified time. Here, I have used 10 sec.
Second, create a bouncing ball screensaver and display it only if no key is pressed in the specified time, otherwise, display the original screen.

The first part can be done using the OpenCV cv2.waitKey() function which waits for a specific time for a key press (See here for more details).

For the second part, we first need to create a bouncing ball screensaver. The main idea is to change the sign of increment (dx and dy in the code below) on collision with the boundaries. This can be done using the following code

def screensaver():
    img = np.zeros((480,640,3),dtype='uint8')
    dx,dy =1,1
    x,y = 100,100
    while True:
        # Display the image
        cv2.imshow('a',img)
        k = cv2.waitKey(10)
        img = np.zeros((480,640,3),dtype='uint8') 
        # Increment the position
        x = x+dx
        y = y+dy
        cv2.circle(img,(x,y),20,(255,0,0),-1)
        if k != -1:
            break
        # Change the sign of increment on collision with the boundary
        if y >=480:
            dy *= -1
        elif y<=0:
            dy *= -1
        if x >=640:
            dx *= -1
        elif x<=0:
            dx *= -1
    cv2.destroyAllWindows()

def screensaver():

img = np.zeros((480,640,3),dtype='uint8')

dx,dy =1,1

x,y = 100,100

while True:

# Display the image

cv2.imshow('a',img)

k = cv2.waitKey(10)

img = np.zeros((480,640,3),dtype='uint8')

# Increment the position

x = x+dx

y = y+dy

cv2.circle(img,(x,y),20,(255,0,0),-1)

if k != -1:

break

# Change the sign of increment on collision with the boundary

if y >=480:

dy *= -1

elif y<=0:

dy *= -1

if x >=640:

dx *= -1

elif x<=0:

dx *= -1

cv2.destroyAllWindows()

The snapshot of the screensaver looks like this

Now, we need to integrate this screensaver function with the cv2.waitKey() function as shown in the code below

import cv2
import numpy as np
# Background Image
img1 = cv2.imread('D:/downloads/original_image.png')
# Initialize these for text placement
i = 0 
a,b = 30,30
while True:
    cv2.imshow('a',img1)
    k = cv2.waitKey(10000)
    # If no key is pressed, display the screensaver
    if k == -1:
        screensaver()
    # Press Escape to exit
    elif k == 27:
        break
    # Otherwise write real time text on the image.
    # This is used for visualization only
    # You can use anything here.
    else:
        font = cv2.FONT_HERSHEY_SIMPLEX
        cv2.putText(img1,chr(k),(a+i,b), font, 0.5,(255,255,255),2,cv2.LINE_AA)
        if a+i >= img1.shape[1]:
            b = b+15
            i = 0
        i +=10
        
cv2.destroyAllWindows()

import cv2

import numpy as np

# Background Image

img1 = cv2.imread('D:/downloads/original_image.png')

# Initialize these for text placement

i = 0

a,b = 30,30

while True:

cv2.imshow('a',img1)

k = cv2.waitKey(10000)

# If no key is pressed, display the screensaver

if k == -1:

screensaver()

# Press Escape to exit

elif k == 27:

break

# Otherwise write real time text on the image.

# This is used for visualization only

# You can use anything here.

else:

font = cv2.FONT_HERSHEY_SIMPLEX

cv2.putText(img1,chr(k),(a+i,b), font, 0.5,(255,255,255),2,cv2.LINE_AA)

if a+i >= img1.shape[1]:

b = b+15

i = 0

i +=10

cv2.destroyAllWindows()

You need to set the size of the screensaver and background image to be the same. The output looks like this

Hope you enjoy reading.

If you have any doubt/suggestion please feel free to ask and I will do my best to help or improve myself. Good-bye until next time.

Add image to a live camera feed using OpenCV-Python

5 Replies

In this blog, we will learn how to add an image to a live camera feed using OpenCV-Python. Also known as Image Blending. In this we take the weighted sum of two images. These weights give a feeling of blending or transparency.

Images are added as per the equation below:

Since an image is a matrix so for the above equation to satisfy, both img1 and img2 must be of equal size.

OpenCV has a built-in function that does the exact same thing as shown below

output = cv2.addWeighted(img1, weight_img1, img2, weight_img2, gamma)
# gamma is the scalar added to each sum

1 2	output = cv2.addWeighted(img1, weight_img1, img2, weight_img2, gamma) # gamma is the scalar added to each sum

The idea is that first, we will select which image we want to overlay (another image will serve as the background). Then we need to select the region in the background image where we want to put the overlay image. Add this selected region with the overlay image using the above equation. At last change the region in the background image with the result obtained in the previous line.

I hope you understand the idea. Now, let’s get started

Task:

Overlay a white square image on the live webcam feed according to different weights. Instead of manually giving weights, set two keys which on pressing increase or decrease the weights.

Steps:

Take an image which you want to overlay. Here, I have used a small white square created using numpy. You can use any.
Open the camera using cv2.VideoCapture()
Initialize the weights (alpha).
Until the camera is opened
- Read the frame using cap.read()
- Select the region in the frame where we want to add the image and add the images using cv2.addWeighted()
- Change the region in the frame with the result obtained
- Display the current value of weights using cv2.putText()
- Display the image using cv2.imshow()
- On pressing ‘a’ increase the value of alpha by 0.1 and decrease by the same amount on pressing ‘d’
- Press ‘q’ to break

Code:

import cv2
import numpy as np
 
# create an overlay image. You can use any image
foreground = np.ones((100,100,3),dtype='uint8')*255
# Open the camera
cap = cv2.VideoCapture(0)
# Set initial value of weights
alpha = 0.4
while True:
    # read the background
    ret, background = cap.read()
    background = cv2.flip(background,1)
    # Select the region in the background where we want to add the image and add the images using cv2.addWeighted()
    added_image = cv2.addWeighted(background[150:250,150:250,:],alpha,foreground[0:100,0:100,:],1-alpha,0)
    # Change the region with the result
    background[150:250,150:250] = added_image
    # For displaying current value of alpha(weights)
    font = cv2.FONT_HERSHEY_SIMPLEX
    cv2.putText(background,'alpha:{}'.format(alpha),(10,30), font, 1,(255,255,255),2,cv2.LINE_AA)
    cv2.imshow('a',background)
    k = cv2.waitKey(10)
    # Press q to break
    if k == ord('q'):
        break
    # press a to increase alpha by 0.1
    if k == ord('a'):
        alpha +=0.1
        if alpha >=1.0:
            alpha = 1.0
    # press d to decrease alpha by 0.1
    elif k== ord('d'):
        alpha -= 0.1
        if alpha <=0.0:
            alpha = 0.0
# Release the camera and destroy all windows         
cap.release()
cv2.destroyAllWindows()

import cv2

import numpy as np

# create an overlay image. You can use any image

foreground = np.ones((100,100,3),dtype='uint8')*255

# Open the camera

cap = cv2.VideoCapture(0)

# Set initial value of weights

alpha = 0.4

while True:

# read the background

ret, background = cap.read()

background = cv2.flip(background,1)

# Select the region in the background where we want to add the image and add the images using cv2.addWeighted()

added_image = cv2.addWeighted(background[150:250,150:250,:],alpha,foreground[0:100,0:100,:],1-alpha,0)

# Change the region with the result

background[150:250,150:250] = added_image

# For displaying current value of alpha(weights)

font = cv2.FONT_HERSHEY_SIMPLEX

cv2.putText(background,'alpha:{}'.format(alpha),(10,30), font, 1,(255,255,255),2,cv2.LINE_AA)

cv2.imshow('a',background)

k = cv2.waitKey(10)

# Press q to break

if k == ord('q'):

break

# press a to increase alpha by 0.1

if k == ord('a'):

alpha +=0.1

if alpha >=1.0:

alpha = 1.0

# press d to decrease alpha by 0.1

elif k== ord('d'):

alpha -= 0.1

if alpha <=0.0:

alpha = 0.0

# Release the camera and destroy all windows

cap.release()

cv2.destroyAllWindows()

See the change in transparency by pressing keys ‘a’ and ‘d’. The output looks like this

You might encounter wrong values of alpha being displayed. This is because of Python’s floating point limitations.

Hope you enjoy reading. In the next blog, we will learn how to do the same for the non-rectangular region of interest.

If you have any doubt/suggestion please feel free to ask and I will do my best to help or improve myself. Good-bye until next time.

Set Camera Timer using OpenCV-Python

Leave a reply

Most of you must have clicked the photograph with a Timer. This feature sets a countdown before clicking a photograph. In this tutorial, we will be doing the same i.e. creating our own camera timer using OpenCV-Python. Sounds interesting, so let’s get started.

The main idea is that whenever a particular key is pressed (Here, I have used ‘q’), the countdown will begin and a photo will be clicked and saved at the desired location. Otherwise the video will continue streaming.

Here, we will be using cv2.putText() function for drawing the countdown on the video. This function has the following arguments

cv2.putText(img, text, position, font, fontScale, color, thickness, lineType, bottomLeftOrigin)

1	cv2.putText(img, text, position, font, fontScale, color, thickness, lineType, bottomLeftOrigin)

This function draws the text on the input image at the specified position. If the specified font is unable to render any character, it is replaced by a question mark.

Now let’s see how to do this

Steps:

Open the camera using cv2.VideoCapture()
Until the camera is open
- Read the frame and display it using cv2.imshow()
- Set the countdown. Here, I have taken this as 30 and I am displaying it after 10 frames so that it is easily visible. Otherwise, it will be too fast. You can set it to anything as you wish
- Set a key for the countdown to begin
- If the key is pressed, show the countdown on the video using cv2.putText(). As the countdown finishes, save the frame at the desired location.
- Otherwise, the video will continue streaming
On pressing ‘Esc’ the video will stop streaming.

Code:

import cv2
import time

# Open the camera
cap = cv2.VideoCapture(0)

while True:
    # Read and display each frame
    ret, img = cap.read()
    cv2.imshow('a',img)
    k = cv2.waitKey(125)
    # Specify the countdown
    j = 30
    # set the key for the countdown to begin
    if k == ord('q'):
        while j>=10:
            ret, img = cap.read()
            # Display the countdown after 10 frames so that it is easily visible otherwise,
            # it will be fast. You can set it to anything or remove this condition and put 
            # countdown on each frame
            if j%10 == 0:
                # specify the font and draw the countdown using puttext
                font = cv2.FONT_HERSHEY_SIMPLEX
                cv2.putText(img,str(j//10),(250,250), font, 7,(255,255,255),10,cv2.LINE_AA)
            cv2.imshow('a',img)
            cv2.waitKey(125)
            j = j-1
        else:
            ret, img = cap.read()
            # Display the clicked frame for 1 sec.
            # You can increase time in waitKey also
            cv2.imshow('a',img)
            cv2.waitKey(1000)
            # Save the frame
            cv2.imwrite('D:/downloads/camera.jpg',img)
    # Press Esc to exit
    elif k == 27:
        break
cap.release()
cv2.destroyAllWindows()

import cv2

import time

# Open the camera

cap = cv2.VideoCapture(0)

while True:

# Read and display each frame

ret, img = cap.read()

cv2.imshow('a',img)

k = cv2.waitKey(125)

# Specify the countdown

j = 30

# set the key for the countdown to begin

if k == ord('q'):

while j>=10:

ret, img = cap.read()

# Display the countdown after 10 frames so that it is easily visible otherwise,

# it will be fast. You can set it to anything or remove this condition and put

# countdown on each frame

if j%10 == 0:

# specify the font and draw the countdown using puttext

font = cv2.FONT_HERSHEY_SIMPLEX

cv2.putText(img,str(j//10),(250,250), font, 7,(255,255,255),10,cv2.LINE_AA)

cv2.imshow('a',img)

cv2.waitKey(125)

j = j-1

else:

ret, img = cap.read()

# Display the clicked frame for 1 sec.

# You can increase time in waitKey also

cv2.imshow('a',img)

cv2.waitKey(1000)

# Save the frame

cv2.imwrite('D:/downloads/camera.jpg',img)

# Press Esc to exit

elif k == 27:

break

cap.release()

cv2.destroyAllWindows()

The output looks like this

Hope you enjoy reading.

If you have any doubt/suggestion please feel free to ask and I will do my best to help or improve myself. Good-bye until next time.

Show current DateTime on live video using OpenCV-Python

1 Reply

Have you seen the security cameras output where DateTime continuously keeps updating? In this blog, we will be doing the same using OpenCV-Python i.e. we will put current DateTime on the live webcam feed. So, let’s get started.

For fetching current DateTime, we will be using Python’s DateTime module. The following code shows how to get the current DateTime

# get current DateTime
from datetime import datetime
print(datetime.now())

# get current DateTime

from datetime import datetime

print(datetime.now())

To put the DateTime on the live video, we will be using cv2.putText() on each frame as shown below

# Put current DateTime on each frame
cv2.putText(img,str(datetime.now()),(140,250), font, .5,(255,255,255),2,cv2.LINE_AA)

1 2	# Put current DateTime on each frame cv2.putText(img,str(datetime.now()),(140,250), font, .5,(255,255,255),2,cv2.LINE_AA)

To know more about cv2.putText(), refer to this blog.

Above are the two things, that we will be needing for this task. I hope you understand these. Now, let’s get started

Steps:

Open the camera using cv2.VideoCapture()
Until the camera is open
- Grab each frame using cap.read()
- Put the current DateTime on each frame using cv2.putText() as discussed above
- Display each frame using cv2.imshow()
On termination, release the webcam and destroy all windows using cap.release() and cv2.destroyAllWindows() respectively.

Code:

import cv2
from datetime import datetime
# Open the Camera
cap = cv2.VideoCapture(0)
while True:
    ret, img = cap.read()
    # Put current DateTime on each frame
    font = cv2.FONT_HERSHEY_SIMPLEX
    cv2.putText(img,str(datetime.now()),(10,30), font, 1,(255,255,255),2,cv2.LINE_AA)
    # Display the image
    cv2.imshow('a',img)
    # wait for keypress
    k = cv2.waitKey(10)
    if k == ord('q'):
        break
cap.release()
cv2.destroyAllWindows()

import cv2

from datetime import datetime

# Open the Camera

cap = cv2.VideoCapture(0)

while True:

ret, img = cap.read()

# Put current DateTime on each frame

font = cv2.FONT_HERSHEY_SIMPLEX

cv2.putText(img,str(datetime.now()),(10,30), font, 1,(255,255,255),2,cv2.LINE_AA)

# Display the image

cv2.imshow('a',img)

# wait for keypress

k = cv2.waitKey(10)

if k == ord('q'):

break

cap.release()

cv2.destroyAllWindows()

The snapshot of the output looks like this

Hope you enjoy reading.

If you have any doubt/suggestion please feel free to ask and I will do my best to help or improve myself. Good-bye until next time.

Write Text on images in real-time using OpenCV-Python

Leave a reply

In this blog, we will learn how to use OpenCV cv2.putText() function for writing text on images in real-time. Most of you might have used cv2.putText(), if not this is how it looks like.

cv2.putText(img, text, position, font, fontScale, color, thickness, lineType, bottomLeftOrigin)

The above function draws the text on the input image at the specified position. If the specified font is unable to render any character, it is replaced by a question mark.

Another important thing that we will be using is OpenCV cv2.waitKey() function. This returns -1 when no key is pressed otherwise returns the ASCII value of the key pressed or a 32-bit integer value depending upon the platform or keyboard modifier(Num lock etc.). You can find this by printing the key as shown below.

import cv2
import numpy as np
img = np.zeros((500,500,3),dtype = 'uint8') # Create a dummy image
while True:
    cv2.imshow('a',img)
    k = cv2.waitKey(0)
    print(k)
    if k == ord('q'):
        break
cv2.destroyAllWindows()

import cv2

import numpy as np

img = np.zeros((500,500,3),dtype = 'uint8') # Create a dummy image

while True:

cv2.imshow('a',img)

k = cv2.waitKey(0)

print(k)

if k == ord('q'):

break

cv2.destroyAllWindows()

If it returns a 32-bit integer, then use cv2.waitKey() & 0xFF which leaves only the last 8 bits of the original 32 bit.

ord(‘q’) converts the character to an int while chr(113) does exactly the opposite as shown in the code below.

>>> ord('q')
113
>>> chr(113)
'q'

>>> ord('q')

113

>>> chr(113)

'q'

I hope you understand all this, now let’s get started

Steps:

Read the image and initialize the counter that will be used for changing the position of the text.
Inside an infinite while loop,
- display the image and use cv2.waitKey() for a keypress.
- Convert this key into character using chr() and draw it on the image using cv2.putText().
- Increase the counter.
- Provide the termination condition
On exit, destroy all windows.

Below is the code for this

import cv2
# Read the image
img = cv2.imread('D:/downloads/original_image.png')
# initialize counter
i = 0
while True:
    # Display the image
    cv2.imshow('a',img)
    # wait for keypress
    k = cv2.waitKey(0)
    # specify the font and draw the key using puttext
    font = cv2.FONT_HERSHEY_SIMPLEX
    cv2.putText(img,chr(k),(140+i,250), font, .5,(255,255,255),2,cv2.LINE_AA)
    i+=10
    if k == ord('q'):
        break
cv2.destroyAllWindows()

import cv2

# Read the image

img = cv2.imread('D:/downloads/original_image.png')

# initialize counter

i = 0

while True:

# Display the image

cv2.imshow('a',img)

# wait for keypress

k = cv2.waitKey(0)

# specify the font and draw the key using puttext

font = cv2.FONT_HERSHEY_SIMPLEX

cv2.putText(img,chr(k),(140+i,250), font, .5,(255,255,255),2,cv2.LINE_AA)

i+=10

if k == ord('q'):

break

cv2.destroyAllWindows()

The output looks like this

Hope you enjoy reading. In the next blog, we will learn how to write text on images at mouse click position.

If you have any doubt/suggestion please feel free to ask and I will do my best to help or improve myself. Good-bye until next time.

Write Text on images at mouse click position using OpenCV-Python

Leave a reply

In the previous blog, we discussed how to write text on images in real-time. In that, we manually specified the position for text placement. This is quite tedious if we were to write text at multiple positions.

So, what if we automate this process. That is we automatically get the coordinates of the image where we click and then put text at that position using cv2.putText() function as we did in the previous blog.

This is what we will do in this blog i.e. write text on images at mouse click position. To do this, we will create a mouse callback function and then bind this function to the image window.

Mouse callback function is executed whenever a mouse event takes place. Mouse event refers to anything we do with the mouse like double click, left click etc. All available events can be found using the following code

import cv2
events = [i for i in dir(cv2) if 'EVENT' in i]
print events

import cv2

events = [i for i in dir(cv2) if 'EVENT' in i]

print events

Below is an example of a simple mouse callback function that draws a circle where we double click.

# mouse callback function
def draw_circle(event,x,y,flags,param):
    if event == cv2.EVENT_LBUTTONDBLCLK:
        cv2.circle(img,(x,y),100,(255,0,0),-1)

# mouse callback function

def draw_circle(event,x,y,flags,param):

if event == cv2.EVENT_LBUTTONDBLCLK:

cv2.circle(img,(x,y),100,(255,0,0),-1)

We then need to bind this callback function to the image window. This is done using
cv2.setMouseCallback(window_name, mouse_callback_function) as shown below

cv2.setMouseCallback('img',draw_circle)

1	cv2.setMouseCallback('img',draw_circle)

I hope you understood mouse callback function, now let’s get started

Steps:

Create a mouse callback function where on every left double click position we put text on the image.
Create or read an image.
Create an image window using cv2.namedWindow()
Bind the mouse callback function to the image window using cv2.setMouseCallback()
Display the new image using an infinite while loop

Code:

import cv2
import numpy as np

font = cv2.FONT_HERSHEY_SIMPLEX
# mouse callback function
def draw_circle(event,x,y,flags,param):
    if event == cv2.EVENT_LBUTTONDBLCLK:
        i = 0
        while True:
            cv2.imshow('image',img) # to display the characters
            k = cv2.waitKey(0)
            cv2.putText(img, chr(k) , (x+i,y), font, 0.5, (0, 255, 0), 2, cv2.LINE_AA)
            i+=10
            # Press q to stop writing
            if k == ord('q'):
                break

    

# Create a black image, a window and bind the function to window
img = np.zeros((512,512,3), np.uint8)
cv2.namedWindow('image')
cv2.setMouseCallback('image',draw_circle)

while True:
    cv2.imshow('image',img)
    if cv2.waitKey(20) == 27:
        break
cv2.destroyAllWindows()

import cv2

import numpy as np

font = cv2.FONT_HERSHEY_SIMPLEX

# mouse callback function

def draw_circle(event,x,y,flags,param):

if event == cv2.EVENT_LBUTTONDBLCLK:

i = 0

while True:

cv2.imshow('image',img) # to display the characters

k = cv2.waitKey(0)

cv2.putText(img, chr(k) , (x+i,y), font, 0.5, (0, 255, 0), 2, cv2.LINE_AA)

i+=10

# Press q to stop writing

if k == ord('q'):

break

# Create a black image, a window and bind the function to window

img = np.zeros((512,512,3), np.uint8)

cv2.namedWindow('image')

cv2.setMouseCallback('image',draw_circle)

while True:

cv2.imshow('image',img)

if cv2.waitKey(20) == 27:

break

cv2.destroyAllWindows()

In the above code, press ‘q’ to stop writing and left double click anywhere to again start writing.

You can play with mouse callback function using other mouse events. Hope you enjoy reading.

If you have any doubt/suggestion please feel free to ask and I will do my best to help or improve myself. Good-bye until next time.

TheAILearner

Mastering Artificial Intelligence

Tag Archives: cv2.putText()

Creating a Bouncing Ball Screensaver using OpenCV-Python

Task:

Add image to a live camera feed using OpenCV-Python

Task:

Steps:

Code:

Set Camera Timer using OpenCV-Python

Steps:

Code:

Show current DateTime on live video using OpenCV-Python

Steps:

Code:

Write Text on images in real-time using OpenCV-Python

Steps:

Write Text on images at mouse click position using OpenCV-Python

Steps:

Code: