Enable transparency

[parodco]

Hi, I'm using this library on my project. I've a GPUImage with GPUImagePixelationFilter and the CENTER_INSIDE ScaleType and I put a .png (with transparency) as an image source. The problem is that the background of the GLSurfaceView is black and I need to set it transparent because I want to show the background of my Layout.

I've been looking on google but have not found any proper solution. Is there any option to get this effect?

Thanks in advance.

[pboos]

I have not yet found a way to allow transparency. Even making background transparent the GLSurfaceView still shows up black. I do not yet know why. If anyone finds out, please send a pull request :).

[parodco]

Thanks for your response, I also tried to set transparent background to the GLSurfaceView. I don't know whats the solution but I think it's related with the Renderer used on the GLSurfaceView (GPUImageRenderer), look at line 100 on GPUImage.java. Maybe is the renderer who has to manage the transparent pixels.

Thanks in advance.

[pboos]

I forgot to mention, that I tried it as well by adding GLES20.glClearColor(0, 0, 0, 0); in GPUImageRenderer. It seemed to have no effect :(. And in GPUImage.java I have:

mGlSurfaceView.setZOrderOnTop(true);
mGlSurfaceView.setEGLConfigChooser(8, 8, 8, 8, 16, 0);
mGlSurfaceView.getHolder().setFormat(PixelFormat.RGBA_8888);
mGlSurfaceView.setRenderer(mRenderer);
mGlSurfaceView.setRenderMode(GLSurfaceView.RENDERMODE_WHEN_DIRTY);

But no luck with this yet. Any other ideas?

[parodco]

Hi pboos, thanks again for your response. I also was trying with the same solution as you (maybe we have read the same post on stackoverflow), but as you said it doesn't works. I haven't more ideas, sorry. For the moment I've changed my layout design and I'll use the black background, but it would be nice if in the future is possible to set it transparent. Anyway this library is wonderful!!!

Thanks!

[jplorandi]

I haven't tried yet on GPUImage (pity it seems it's not being developed), but you need to use the discard directive in the pixel shader for it to be transparent, if I recall correctly.

[mplackowski]

Hi, Black background was big issue for me too. I checked few solutions for this problem and finally I was able to get transparent background after small modification of GPUImageView init method. It looks like this now:

    private void init() {
        setEGLConfigChooser(8, 8, 8, 8, 16, 0);
        getHolder().setFormat(PixelFormat.TRANSLUCENT);
        setZOrderOnTop(true); 

        mGPUImage = new GPUImage(getContext());
        mGPUImage.setGLSurfaceView(this);
    }

[TroyRay]

I have facing same problem. Is anyone have solution for this?

[AssassinWayne]

@mplackowski I try your solution, but it doesn't work for me. I found this code below of the class GPUImageRenderer, and the 4th param of glClearColor means alpha value, I changed it to 0, but something wrong happened. `

@Override
public void onSurfaceCreated(final GL10 unused, final EGLConfig config) {
    GLES20.glClearColor(mBackgroundRed, mBackgroundGreen, mBackgroundBlue, 1);
    GLES20.glDisable(GLES20.GL_DEPTH_TEST);
    mFilter.init();
}

`

The area of the GPUImageView is transparent when the page transactions, but when the bitmap display on the screen, the extra space of the position became black again.

[imrananeuronsolutions]

Facing the same problem . Didn't get the answer yet . Any suggestion ?

[AssassinWayne]

@imrananeuronsolutions I use Bitmap on ImageView instead of using GPUImageView

public Bitmap getBitmapWithFilterApplied(Context context, Bitmap bitmap, Filter filter) {
        if (mImage == null) {
            mImage = new GPUImage(context.getApplicationContext());
        }
        mImage.setFilter(filter.getFilter());
        return mImage.getBitmapWithFilterApplied(bitmap);
    }
`

[imrananeuronsolutions]

@AssassinWayne Thanks for Replying... Also i am facing the problem With GLsurfaceview . I am not able to set actual bitmap on Glsurfaceview.. As i set the Bitmap on GLsurfaceview then i get the black margin arround my bitmap image with the Glsurface. Is there any solution available for resolve this issue ?

[AssassinWayne]

@imrananeuronsolutions Sorry, I haven't tried to use this on GlSurfaceView.

[thinhdt]

I am facing with this issue . Could anyone help me to fix one? Thank you

[NiaNingXue]

same issue, please help

[maddytictic]

Hi, I'm using this library on my project. I've a GPUImage with GPUImagePixelationFilter and the CENTER_INSIDE ScaleType and I put a .png (with transparency) as an image source. The problem is that the background of the GLSurfaceView is black and I need to set it transparent because I want to show the background of my Layout.

I've been looking on google but have not found any proper solution. Is there any option to get this effect?

Thanks in advance.

Yes.....

I make a LinearLayout with 4dp padding value. Inside it, I have used another LineraLayout with vertical orientation and put a GPUImageview and a filtername below it. Now, whatever BG you are usig either black or transparent etc doesn't matter. Now do one this.. You need to set gpuImage background instead of setting its setImage( ) method. And also set your outer layout background color as it will give it a selected effect. Hope it will work.

[pkMinhas]

Inherit from your filter of choice and call the following lines in onInitialized():

runOnDraw(new Runnable() {
            @Override
            public void run() {
                GLES20.glEnable(GLES20.GL_BLEND);
                GLES20.glBlendFunc(GLES20.GL_SRC_ALPHA, GLES20.GL_SRC_ALPHA);
            }
        });

Reasoning: You need to enable the blending, then the src has to use src alpha & since the GPUImage renderer's clearColor alpha is 1, it should be using your source's alpha.