OpenGL glBlendFuncSeparate - objective-c

I need some help with OpenGL textures masking. I have it working but need to find some other blending function parameters to work in other way.
Now I have:
//Background
...code...
glBlendFunc(GL_ONE, GL_ZERO);
...code
//Mask
...code...
glBlendFuncSeparate(GL_ZERO, GL_ONE, GL_DST_COLOR, GL_ZERO);
...code...
//Foreground
...code
glBlendFunc(GL_DST_ALPHA, GL_ONE_MINUS_DST_ALPHA);
...code
Now it sets foreground's opacity to 0 (fills with background texture) where mask is transparent. I need it to react to mask's colors. I mean something like setting foregrounds opacity depending on mask's color. For example if mask is black (0.0,0.0,0.0) then the opacity of that place in foreground is 0 (is filled with background), and if mask is white (1.0,1.0,1.0) then the opacity of foreground is 1 (not filled with background). It can be in reverse consequence (white = opacity 0, black = opacity 1). I just need it to work depending on color.
My current result's visualization bellow.
Background:
Mask (circle is transparent):
Foreground:
Result:
And I want it to work like this:
Background:
Mask (circle is white, background is black):
Foreground:
Result:
So that later it could be used like this:
Background:
Mask (circle is white, background is black):
Foreground:
Result:
Attempt with #Gigi solution:

Perhaps this is what you want:
1) Clear the destination image:
glClearColor(0.0, 0.0, 0.0, 0.0);
glClear(GL_COLOR_BUFFER_BIT);
2) Draw the background, masking out the alpha channel:
glColorMask(GL_TRUE, GL_TRUE, GL_TRUE, GL_FALSE);
3) Draw the "masking overlay", masking out the color channels:
glColorMask(GL_FALSE, GL_FALSE, GL_FALSE, GL_TRUE);
4) Draw the foreground, enabling blending:
glEnable(GL_BLEND);
glBlendEquationSeparate(GL_FUNC_ADD, GL_FUNC_ADD);
glBlendFuncSeparate(GL_ONE_MINUS_SRC_ALPHA, GL_SRC_ALPHA, GL_ONE, GL_ZERO);
Note: The overlay image must have the alpha channel specified.

Related

Jssor slider: How to make slider container's width and height to be fixed ratio?

As the screenshot shows, the width and height value can only be px values. How can I make them to be fixed ratio such as 16:9 or 4:3?

Rectangular gradient in Compose

I need to do a rectangular gradient border over an image, the edges should be of dark background color and closer to the center it should fade away to transparent. I was thinking about using radial gradient as I can make it transparent in the center.
val gradientBrush = Brush.radialGradient(
colors = listOf(Color.Transparent, MaterialTheme.colors.background)
)
Image(
painter = ...,
contentScale = ContentScale.Inside,
modifier = Modifier
.clip(RoundedCornerShape(48.dp))
.border(
180.dp,
gradientBrush ,
RoundedCornerShape(48.dp)
)
.wrapContentHeight()
.fillMaxWidth()
)
But this gives me a gradient in the form of a circle. I guess that with scaling I could make it oval. But I wonder is there any way I can make it rectangular? I was thinking along the lines of placing four gradients around the image, but they would overlap.
You can use linear gradient with stops, so middle part of your image will be transparent.
val gradientBrush = Brush.linearGradient(
0f to MaterialTheme.colors.background,
0.4f to Color.Transparent,
0.6f to Color.Transparent,
1f to MaterialTheme.colors.background,
)
By default it's horizontal, but you can use verticalGradient instead, or specify start/end parameters for custom direction.

Python OpenCV Duplicate a transparent shape in the same image

I have an image of a circle, refer to the image attached below. I already retrieved the transparent circle and want to paste that circle back to the image to make some overlapped circles.
Below is my code but it led to the problem A, it's like a (transparent) hole in the image. I need to have circles on normal white background.
height, width, channels = circle.shape
original_image[60:60+height, 40:40+width] = circle
I used cv2.addWeighted but got blending issue, I need clear circles
circle = cv2.addWeighted(original_image[60:60+height, 40:40+width],0.5,circle,0.5,0)
original_image[60:60+rows, 40:40+cols] = circle
If you already have a transparent black circle, then in Python/OpenCV here is one way to do that.
- Read the transparent image unchanged
- Extract the bgr channels and the alpha channel
- Create a colored image of the background color and size desired
- Create similar sized white and black images
- Initialize a copy of the background color image for the output
- Define a list offset coordinates in the larger image
- Loop for over the list of offsets and do the following
- Insert the bgr image into a copy of the white image as the base image
- Insert the alpha channel into a copy of the black image for a mask
- composite the initialized output and base images using the mask image
- When finished with the loop, save the result
Input (transparent):
import cv2
import numpy as np
# load image with transparency
img = cv2.imread('black_circle_transp.png', cv2.IMREAD_UNCHANGED)
height, width = img.shape[:2]
print(img.shape)
# extract the bgr channels and the alpha channel
bgr = img[:,:,0:3]
aa = img[:,:,3]
aa = cv2.merge([aa,aa,aa])
# create whatever color background you want, in this case white
background=np.full((500,500,3), (255,255,255), dtype=np.float64)
# create white image of the size you want
white=np.full((500,500,3), (255,255,255), dtype=np.float64)
# create black image of the size you want
black=np.zeros((500,500,3), dtype=np.float64)
# initialize output
result = background.copy()
# define top left corner x,y locations for circle offsets
xy_offsets = [(100,100), (150,150), (200,200)]
# insert bgr and alpha into white and black images respectively of desired output size and composite
for offset in xy_offsets:
xoff = offset[0]
yoff = offset[1]
base = white.copy()
base[yoff:height+yoff, xoff:width+xoff] = bgr
mask = black.copy()
mask[yoff:height+yoff, xoff:width+xoff] = aa
result = (result * (255-mask) + base * mask)/255
result = result.clip(0,255).astype(np.uint8)
# save resulting masked image
cv2.imwrite('black_circle_composite.png', result)
# display result, though it won't show transparency
cv2.imshow("image", img)
cv2.imshow("aa", aa)
cv2.imshow("bgr", bgr)
cv2.imshow("result", result)
cv2.waitKey(0)
cv2.destroyAllWindows()
Result:

Remove the border of a sf polygon when plotted with ggplot2 using geom_sf

I'm working with a shapefile converted from a raster with lots of little holes in it, therefore, the borders create big splodges in the shape when plotted.
I'm currently adding the polygon to the main plot with the below code. Despite setting the alpha value to 1 the colours are different even when both set to "red" which makes no sense to me.
geom_sf(data = filter(db, band == 9), aes(fill = "red"), colour = "red", alpha = 1)
Can I either:
Set the borders to the same colour as the fill?
Or remove the border entirely?
Or set the border colour to none?

Draw a RoundRect in easeljs

How to draw a rectangle in easeljs with only two rounded corners. I am doing this to get rounded corners in the bottom:
layout.graphics.beginStroke("black").drawRoundRect(100,100,100,100,0,0,5,5);
This is not drawing any rounded corners. Only this seems to be working:
layout.graphics.beginStroke("black").drawRoundRect(100,100,100,100,5);
Look into the drawRoundRectComplex method, instead of drawRoundRect: http://createjs.com/docs/easeljs/classes/Graphics.html#method_drawRoundRectComplex
drawRoundRectComplex(x, y, w, h, radiusTL, radiusTR, radiusBR, radiusBL);
Hope that helps.