Android Question Apply Blur effect to a panel

[Mike1970]

Hi, I don't know if this is a possible thing.
I would like to put a Background image, and on the top of it a transparent panel, that has a blur effect on it, so everything behind it's blurred.

Something like this

 

[William Lancee]

Based on the Erel's very educational example (there are all kinds of tricks I didn't know about):

https://www.b4x.com/android/forum/threads/b4x-bitmapcreator-effects.93608/

1. Have two copies of the image
2. Blur the second one
3. Create mask image with shape to blur through - make color of shape transparent
4. Draw original image outside mask (see how Erel does it or use his code)
5. Draw blurred image inside mask

P.S. I don't know why the spelling checker of this reply doesn't like "Erel"

 

[DonManfred]

P.S. I don't know why the spelling checker of this reply doesn't like "Erel"

If you want to mention someone you should write the username prefixed by a @
Type @ + Erel -> @Erel

 

[LucaMs]

3. Create mask image with shape to blur through - make color of shape transparent
4. Draw original image outside mask (see how Erel does it or use his code)
5. Draw blurred image inside mask

I still have to understand these and also masks (after about 40 year of programming... only ?)

P.S. I don't know why the spelling checker of this reply doesn't like "Erel"

I don't know what you mean here but, of course, even Xenforo does not like Erel, as all of us ? (I really like lying )

 

[LucaMs]

Based on the Erel's very educational example (there are all kinds of tricks I didn't know about):

https://www.b4x.com/android/forum/threads/b4x-bitmapcreator-effects.93608/

1. Have two copies of the image
2. Blur the second one
3. Create mask image with shape to blur through - make color of shape transparent
4. Draw original image outside mask (see how Erel does it or use his code)
5. Draw blurred image inside mask

P.S. I don't know why the spelling checker of this reply doesn't like "Erel"

I forgot... this "thing" (what was asked) should work swiping the overlapping panel.

 

[William Lancee]

Thanks @DonManfed @DonManfred I learned something new.

 

[LucaMs]

Thanks @DonManfed, I learned something new.

I knew it but, I don't know if even with this new version, it does... nothing (as far I know)

 

[William Lancee]

@LucaMs

As the panel is swiped, recreate the rectangular mask (larger each time based on gesture coordinates) and redraw the masked image.

 

[LucaMs]

Thanks @DonManfed, I learned something new.

@William Lancee

@DonManfed

the "r" is missing; you should type @ + some letters and then select

 

[LucaMs]

@LucasMs

As the panel is swiped, recreate the rectangular mask (larger each time based on gesture coordinates) and redraw the masked image.

Yes, it is necessary, unless there is a way to do exactly what was asked, that is, a kind of brush that goes to modify (blurring) what is underneath.

 

[William Lancee]

Sorry @DonManfred, I will correct.

 

[LucaMs]

Sorry @DonManfred, I will correct.

I meant that you can use the "suggestions", the list of names, instead of type the full name.

 

[William Lancee]

@LucaMs

I got your name wrong too!

What I am thinking is this:

When the user touches the panel, a brush shape like a circle appears with the contents blurred.
As the user moves the finger the shape follows it.
When the finger is lifted the shape disappears.

 

[Sagenut]

@LucasMs

As the panel is swiped, recreate the rectangular mask (larger each time based on gesture coordinates) and redraw the masked image.

The difficult task, for me, is to be able to follow the movement of the panel.
If it was needed to blur the new area just after the movement then the code is already done.
It will be really interesting to see solution to this.
I think that the solution will come from Reflection of JavaObject.

 

[Sagenut]

@LucaMs

I got your name wrong too!

What I am thinking is this:

When the user touches the panel, a brush shape like a circle appears with the contents blurred.
As the user moves the finger the shape follows it.
When the finger is lifted the shape disappears.

Moving the panel with finger could maybe apply with my solution/code.
But if the panel is moved from code.....here come my difficulties......following the movement smoothly.

 

[LucaMs]

I still have to understand these and also masks (after about 40 year of programming... only ?)

Here I exaggerated a great deal; I know the masks (I use them with painting SWs).
Maybe I can't make the most of them.

And anyway I have a bad disease, a lack of self-esteem, sometimes (often ?)

 

[LucaMs]

@LucaMs

I got your name wrong too!

Yes, this is right, since... my name is Mario ? (I wrote it on my old avatar but now it is roundend I had to remove the texts )

 

[LucaMs]

@LucaMs

I got your name wrong too!

What I am thinking is this:

When the user touches the panel, a brush shape like a circle appears with the contents blurred.
As the user moves the finger the shape follows it.
When the finger is lifted the shape disappears.

Have to go, now, but when I come back... I will try to understand this post and also try.

If in the meantime you try... it is better, however

 

[sorex]

I don't think you need to constantly redraw.

Just snapshot > blur > reposition should be enough as panels are kind of masked displays already.

when overlay panel is at 0,0 the blurred image is at 0,0 aswell.

if you move the overlay to 10,10 you move the inner blur image to -10,-10 and it will be at the same visual position inside the mask as before.

 

[Sagenut]

I don't think you need to constantly redraw.

Just snapshot > blur > reposition should be enough as panels are kind of masked displays already.

when overlay panel is at 0,0 the blurred image is at 0,0 aswell.

if you move the overlay to 10,10 you move the inner blur image to -10,-10 and it will be at the same visual position inside the mask as before.

Moving from A to B in one shot work without problems.
Trying with SetLayoutAnimated it looks like the panel get immediately the new coordinates, and the movement is an independent animation.
But this is a my limitation.
I am pretty sure someone have the solution in the pocket.

 

[sorex]

you need to create your own tweening routine then you have control over anything you want