Draw Transparent shape, and Text with background Opencv python

 Draw text with background, and shapes with transparency OpenCV-python, it really simples, let's have a walkthrough of each function and its uses case it, every function is built upon the top of OpenCV function just I have added few extra functionalities, in case you need a source code then here is GitHub repository utlis, just clone and import. 





These functions will allow drawing, text in OpenCV in an elegant way, have you notice that when you write text on a webcam, it's tough to maintain the readability of text cause the background continuously change, the simple solution one comes up the is simply to put a background behind text, for that you to write some piece of code, to address this issue I have written these function so you can control the transparency of background, so you can add the feel of background as well, in your the project, it will surely enhance the representation of you OpenCV projects, in addition to that you have the transparent shapes, like fillPoly(), which simple OpenCV function, allow drawing custom shapes, with colour, but here you will be able to control the transparency to that shapes, as it true for rectangle, in that way you can highlight any portions image, just by draw shape on upon that, I will show you the examples as well.



Colour background Text

Draw text with the colour background using function textWithBackgroudn it is similar to OpenCV putText function, having additional functionalities. so can choose fonts, the colour, fonts, font scale, position in addition to this function calculates the with and height of background, on the basis of the text, that you input, you have extra options to customize the background, like, colour, padding, and the transparency of background as well. 

def textWithBackground(img, text, font, fontScale, textPos, textThickness=1,textColor=(0,255,0), bgColor=(0,0,0), pad_x=3, pad_y=3, bgOpacity=0.5):
    
    (t_w, t_h), _= cv.getTextSize(text, font, fontScale, textThickness) # getting the text size
    
    x, y = textPos
    
    overlay = img.copy() # coping the image
    
    cv.rectangle(overlay, (x-pad_x, y+ pad_y), (x+t_w+pad_x, y-t_h-pad_y), bgColor,-1) # draw rectangle 
    
    new_img = cv.addWeighted(overlay, bgOpacity, img, 1 - bgOpacity, 0) # overlaying the rectangle on the image.
    
    cv.putText(new_img,text, textPos,font, fontScale, textColor,textThickness ) # draw in text
    
    img = new_img

    return img

Our textWithBackground function accepts arguments

img it is images to want to draw text upon
text it input text, as string
fontScale the size of fonts, 
texPos it is position text in image tuples(x,y)
textThickness thickness of text, 
textColor It is text color, tuple(blue,green,red)
bgColor It is background color, tuple(blue,green,red)
pad_x, pad_y it is adding of background, in pixels
bgOpacity it transparency of background, 0.0 to 1.0

Blur Background Text

This function is similar to the text background function, instead of colour you can create blurred background for the text, you have the option to control blur by changing the kernel size, it must be odd, number, since the kernel does not accepts even number as size.

def textBlurBackground(img, text, font, fontScale, textPos, textThickness=1,textColor=(0,255,0),kneral=(33,33) , pad_x=3, pad_y=3):
 
    
    (t_w, t_h), _= cv.getTextSize(text, font, fontScale, textThickness) # getting the text size
    
    x, y = textPos
    
    blur_roi = img[y-pad_y-t_h: y+pad_y, x-pad_x:x+t_w+pad_x] # croping Text Background
    
    img[y-pad_y-t_h: y+pad_y, x-pad_x:x+t_w+pad_x]=cv.blur(blur_roi, kneral)  # merging the blured background to img
    
    cv.putText(img,text, textPos,font, fontScale, textColor,textThickness )

    return img  

Our textBlurBackground function accepts arguments

img it images to want to draw text upon
text it input text, as a string
fontScale the size of fonts, 
texPos it is position text in image tuples(x,y)
textThickness the thickness of text, 
textColor It is text color, tuple(blue,green,red)
kernal I it will cont the amount of blur background, it must odd number, kernal(33,33)
pad_x, pad_y it is adding of background, in pixels

Draw Custom Shape with transparency

This function allows drawing custom, with giving multiple (x,y) points, it similar to OpenCV's fillPoly function just you the extra option, of controlling the opacity of the colour, you want to choose, the only difference here is that fillPolyTran Function takes points as a list of tuples, on the others hand OpenCV's fillPoly takes as NumPy array. 

def fillPolyTrans(img, points, color, opacity):

    list_to_np_array = np.array(points, dtype=np.int32)
    
    overlay = img.copy()  # coping the image
    
    cv.fillPoly(overlay,[list_to_np_array], color )
    
    new_img = cv.addWeighted(overlay, opacity, img, 1 - opacity, 0)
        
    img = new_img

    return img

Our fillPolyTran function accepts arguments

img it image to want to draw text upon
points are the (x,y) points on image, required list of tuples like  [(x,y),(x1,y1), (x2,y2)]
color It is color of shape, tuple(blue,green,red)
opacity it transparency of shape, 0.0 to 1.0

Draw Transparent Rectangle 

The function is similar to the OpenCV rectangle function, just one different here you have an option to control the opacity of the colour, you have chosen.

def rectTrans(img, pt1, pt2, color, thickness, opacity):

    overlay = img.copy()

	cv.rectangle(overlay, pt1, pt2, color, thickness)
    
    new_img = cv.addWeighted(overlay, opacity, img, 1 - opacity, 0) # overlaying the rectangle on the image.
    
    img = new_img

    return img
  

Our rectTrans function accepts arguments

img it is an image to want to draw rectangle upon
pt1 it is starting position rectangle tuple(x,y)
pt2 t it is with and height of rectangle tuple(w, h)
thickness the thickness of the rectangle line, if you pass -1 then the rectangle will be filled. 
color It is color rectangle , tuple(blue,green,red)
opacity it transparency of rectangle, 0.0 to 1.0



if you can ask anything about this then let me know in the comments, it's my first ever post here, so it looks crapy apologies for that, thank you so much for being with me.

Comments

Popular posts from this blog

Eyes Tracking Mediapipe, part1