IOS OpenGL ES GPUImage image xyderivativeedge detection GPUImageXYDerivativeFilter

catalogue

1, Introduction
2, Effect demonstration
3, Source code download
4, Guess you like it

Zero foundation OpenGL (ES) learning route recommendation: OpenGL (ES) learning directory >> OpenGL ES Basics

Zero foundation OpenGL (ES) learning route recommendation: OpenGL (ES) learning directory >> OpenGL ES transition

Zero foundation OpenGL (ES) learning route recommendation: OpenGL (ES) learning directory >> OpenGL ES special effects

Zero foundation OpenGL (ES) learning route recommendation: OpenGL (ES) learning directory >> OpenGL ES functions

Zero foundation OpenGL (ES) learning route recommendation: OpenGL (ES) learning directory >> OpenGL ES GPUImage use

Zero foundation OpenGL (ES) learning route recommendation: OpenGL (ES) learning directory >> OpenGL ES GLSL programming

1, Introduction

GPUImage There are 125 filters in total, which are divided into four categories

1. Color adjustments: 31 filters, color processing related
2. Image processing: 40 filters, image processing related
3. Blending modes: 29 filters, mixed mode correlation
4. Visual effects: 25 filters, visual effects related

GPUImageXYDerivativeFilter It is related to the visual effect of GPUImage images and is used for XYDerivative edge detection of images. The source code of shader is as follows:

/******************************************************************************************/
//@Author: apes say programming
//@Blog (personal blog address): www.codersrc.com
//@File:IOS – OpenGL ES GPUImage GPUImageXYDerivativeFilter
//@Time:2022/07/02 06:30
//@Motto: no small steps, no small streams, no rivers and seas. The brilliance of program life needs to be accumulated unremittingly!
/******************************************************************************************/

#if TARGET_IPHONE_SIMULATOR || TARGET_OS_IPHONE
NSString *const kGPUImageGradientFragmentShaderString = SHADER_STRING
(
 precision highp float;

 varying vec2 textureCoordinate;
 varying vec2 leftTextureCoordinate;
 varying vec2 rightTextureCoordinate;

 varying vec2 topTextureCoordinate;
 varying vec2 topLeftTextureCoordinate;
 varying vec2 topRightTextureCoordinate;

 varying vec2 bottomTextureCoordinate;
 varying vec2 bottomLeftTextureCoordinate;
 varying vec2 bottomRightTextureCoordinate;

 uniform sampler2D inputImageTexture;

 uniform float edgeStrength;

 void main()
 {
     float topIntensity = texture2D(inputImageTexture, topTextureCoordinate).r;
     float topRightIntensity = texture2D(inputImageTexture, topRightTextureCoordinate).r;
     float topLeftIntensity = texture2D(inputImageTexture, topLeftTextureCoordinate).r;
     float bottomIntensity = texture2D(inputImageTexture, bottomTextureCoordinate).r;
     float bottomLeftIntensity = texture2D(inputImageTexture, bottomLeftTextureCoordinate).r;
     float bottomRightIntensity = texture2D(inputImageTexture, bottomRightTextureCoordinate).r;
     float leftIntensity = texture2D(inputImageTexture, leftTextureCoordinate).r;
     float rightIntensity = texture2D(inputImageTexture, rightTextureCoordinate).r;

     float verticalDerivative = -topLeftIntensity - topIntensity - topRightIntensity + bottomLeftIntensity + bottomIntensity + bottomRightIntensity;
     float horizontalDerivative = -bottomLeftIntensity - leftIntensity - topLeftIntensity + bottomRightIntensity + rightIntensity + topRightIntensity;
     verticalDerivative = verticalDerivative * edgeStrength;
     horizontalDerivative = horizontalDerivative * edgeStrength;

     // Scaling the X * Y operation so that negative numbers are not clipped in the 0..1 range. This will be expanded in the corner detection filter
     gl_FragColor = vec4(horizontalDerivative * horizontalDerivative, verticalDerivative * verticalDerivative, ((verticalDerivative * horizontalDerivative) + 1.0) / 2.0, 1.0);
 }
);
#else
NSString *const kGPUImageGradientFragmentShaderString = SHADER_STRING
(
 varying vec2 textureCoordinate;
 varying vec2 leftTextureCoordinate;
 varying vec2 rightTextureCoordinate;

 varying vec2 topTextureCoordinate;
 varying vec2 topLeftTextureCoordinate;
 varying vec2 topRightTextureCoordinate;

 varying vec2 bottomTextureCoordinate;
 varying vec2 bottomLeftTextureCoordinate;
 varying vec2 bottomRightTextureCoordinate;

 uniform sampler2D inputImageTexture;

 uniform float edgeStrength;

 void main()
 {
     float topIntensity = texture2D(inputImageTexture, topTextureCoordinate).r;
     float topRightIntensity = texture2D(inputImageTexture, topRightTextureCoordinate).r;
     float topLeftIntensity = texture2D(inputImageTexture, topLeftTextureCoordinate).r;
     float bottomIntensity = texture2D(inputImageTexture, bottomTextureCoordinate).r;
     float bottomLeftIntensity = texture2D(inputImageTexture, bottomLeftTextureCoordinate).r;
     float bottomRightIntensity = texture2D(inputImageTexture, bottomRightTextureCoordinate).r;
     float leftIntensity = texture2D(inputImageTexture, leftTextureCoordinate).r;
     float rightIntensity = texture2D(inputImageTexture, rightTextureCoordinate).r;

     float verticalDerivative = -topLeftIntensity - topIntensity - topRightIntensity + bottomLeftIntensity + bottomIntensity + bottomRightIntensity;
     float horizontalDerivative = -bottomLeftIntensity - leftIntensity - topLeftIntensity + bottomRightIntensity + rightIntensity + topRightIntensity;
     verticalDerivative = verticalDerivative * edgeStrength;
     horizontalDerivative = horizontalDerivative * edgeStrength;

     // Scaling the X * Y operation so that negative numbers are not clipped in the 0..1 range. This will be expanded in the corner detection filter
     gl_FragColor = vec4(horizontalDerivative * horizontalDerivative, verticalDerivative * verticalDerivative, ((verticalDerivative * horizontalDerivative) + 1.0) / 2.0, 1.0);
 }
);
#endif