GLImageProcessing ROI (Region of Interest)

Question

I am currently trying to blur a part of an image. I use apple's example code here

The example code itself can blur whole image and draw it to the EAGLView, what I want to do is blur only part of the image by supplying an ROI.

I do not know how to supply an ROI to the function.

Here is the code which draws image to the view;

void drawGL(int wide, int high, float val, int mode)
{
static int prevmode = -1;
typedef void (*procfunc)(V2fT2f *, float);

typedef struct {
    procfunc func;
    procfunc degen;
} Filter;

const Filter filter[] = {
    { brightness             },
    { contrast               },
    { extrapolate, greyscale },
    { hue                    },
    { extrapolate, blur      }, // The blur could be exaggerated by downsampling to half size
};
#define NUM_FILTERS (sizeof(filter)/sizeof(filter[0]))
rt_assert(mode < NUM_FILTERS);

glMatrixMode(GL_PROJECTION);
glLoadIdentity();
glOrthof(0, wide, 0, high, -1, 1);
glMatrixMode(GL_MODELVIEW);
glLoadIdentity();
glScalef(wide, high, 1);

glBindTexture(GL_TEXTURE_2D, Input.texID);

if (prevmode != mode)
{
    prevmode = mode;
    if (filter[mode].degen)
    {
        // Cache degenerate image, potentially a different size than the system framebuffer
        glBindFramebufferOES(GL_FRAMEBUFFER_OES, DegenFBO);
        glViewport(0, 0, Degen.wide*Degen.s, Degen.high*Degen.t);
        // The entire framebuffer won't be written to if the image was padded to POT.
        // In this case, clearing is a performance win on TBDR systems.
        glClear(GL_COLOR_BUFFER_BIT);
        glDisable(GL_BLEND);
        filter[mode].degen(fullquad, 1.0);
        glBindFramebufferOES(GL_FRAMEBUFFER_OES, SystemFBO);
    }
}

// Render filtered image to system framebuffer
glViewport(0, 0, wide, high);
filter[mode].func(flipquad, val);
glCheckError();
}

And this is the function which blurs the image;

static void blur(V2fT2f *quad, float t) // t = 1
{
GLint tex;
V2fT2f tmpquad[4];
float offw = t / Input.wide;
float offh = t / Input.high;
int i;

glGetIntegerv(GL_TEXTURE_BINDING_2D, &tex);

// Three pass small blur, using rotated pattern to sample 17 texels:
//
// .\/.. 
// ./\\/ 
// \/X/\   rotated samples filter across texel corners
// /\\/. 
// ../\. 

// Pass one: center nearest sample
glVertexPointer  (2, GL_FLOAT, sizeof(V2fT2f), &quad[0].x);
glTexCoordPointer(2, GL_FLOAT, sizeof(V2fT2f), &quad[0].s);
glTexEnvi(GL_TEXTURE_ENV, GL_TEXTURE_ENV_MODE, GL_MODULATE);
glColor4f(1.0/5, 1.0/5, 1.0/5, 1.0);
validateTexEnv();
glDrawArrays(GL_TRIANGLE_STRIP, 0, 4);

// Pass two: accumulate two rotated linear samples
glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_LINEAR);
glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_LINEAR);
glEnable(GL_BLEND);
glBlendFunc(GL_SRC_ALPHA, GL_ONE);
for (i = 0; i < 4; i++)
{
    tmpquad[i].x = quad[i].s + 1.5 * offw;
    tmpquad[i].y = quad[i].t + 0.5 * offh;
    tmpquad[i].s = quad[i].s - 1.5 * offw;
    tmpquad[i].t = quad[i].t - 0.5 * offh;
}
glTexCoordPointer(2, GL_FLOAT, sizeof(V2fT2f), &tmpquad[0].x);
glTexEnvi(GL_TEXTURE_ENV, GL_TEXTURE_ENV_MODE, GL_REPLACE);
glActiveTexture(GL_TEXTURE1);
glEnable(GL_TEXTURE_2D);
glClientActiveTexture(GL_TEXTURE1);
glTexCoordPointer(2, GL_FLOAT, sizeof(V2fT2f), &tmpquad[0].s);
glEnableClientState(GL_TEXTURE_COORD_ARRAY);
glBindTexture(GL_TEXTURE_2D, tex);
glTexEnvi(GL_TEXTURE_ENV, GL_TEXTURE_ENV_MODE, GL_COMBINE);
glTexEnvi(GL_TEXTURE_ENV, GL_COMBINE_RGB,      GL_INTERPOLATE);
glTexEnvi(GL_TEXTURE_ENV, GL_SRC0_RGB,         GL_TEXTURE);
glTexEnvi(GL_TEXTURE_ENV, GL_SRC1_RGB,         GL_PREVIOUS);
glTexEnvi(GL_TEXTURE_ENV, GL_SRC2_RGB,         GL_PRIMARY_COLOR);
glTexEnvi(GL_TEXTURE_ENV, GL_OPERAND2_RGB,     GL_SRC_COLOR);
glTexEnvi(GL_TEXTURE_ENV, GL_COMBINE_ALPHA,    GL_REPLACE);
glTexEnvi(GL_TEXTURE_ENV, GL_SRC0_ALPHA,       GL_PRIMARY_COLOR);

glColor4f(0.5, 0.5, 0.5, 2.0/5);
validateTexEnv();
glDrawArrays(GL_TRIANGLE_STRIP, 0, 4);

// Pass three: accumulate two rotated linear samples
for (i = 0; i < 4; i++)
{
    tmpquad[i].x = quad[i].s - 0.5 * offw;
    tmpquad[i].y = quad[i].t + 1.5 * offh;
    tmpquad[i].s = quad[i].s + 0.5 * offw;
    tmpquad[i].t = quad[i].t - 1.5 * offh;
}
glDrawArrays(GL_TRIANGLE_STRIP, 0, 4);

// Restore state
glDisableClientState(GL_TEXTURE_COORD_ARRAY);
glClientActiveTexture(GL_TEXTURE0);
glBindTexture(GL_TEXTURE_2D, Half.texID);
glDisable(GL_TEXTURE_2D);
glTexEnvi(GL_TEXTURE_ENV, GL_OPERAND2_RGB,     GL_SRC_ALPHA);
glActiveTexture(GL_TEXTURE0);
glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_NEAREST);
glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_NEAREST);
glDisable(GL_BLEND);
}

Where should I supply an ROI or if any other way is possible to blur a part of an image without ROI, I would like to know as well.

Thanks.

Answer 1

Im not a big OpenGL ES knower, but this code operate with whole (not ROI) textures on surface. I using this example too.

I think, you should:

• cut ROI of your image
• create new texture with this image
• blur whole new texture
• set new texture over your original texture

Also few links: How to implement a box or gaussian blur on iPhone, Blur Effect (Wet in Wet effect) in Paint Application Using OpenGL-ES, how to sharp/blur an uiimage in iphone?

Answer 2

Have you tried glScissor() yet?

from the GLES1.1 spec:

glScissor defines a rectangle, called the scissor box, in window coordinates. The first two arguments, x and y, specify the lower left corner of the box. width and height specify the width and height of the box.

To enable and disable the scissor test, call glEnable and glDisable with argument GL_SCISSOR_TEST. The scissor test is initially disabled. While scissor test is enabled, only pixels that lie within the scissor box can be modified by drawing commands. Window coordinates have integer values at the shared corners of frame buffer pixels. glScissor(0, 0, 1, 1) allows modification of only the lower left pixel in the window,and glScissor(0, 0, 0, 0) doesn't allow modification of any pixels in the window.

You might have to do 2 draw passes; first the unfiltered image; the second is the filtered image but drawn with the scissor test.