Android Question Halo animation, how to proceed?

[wimpie3]

I want to add a halo animation to my B4X buttons. I've seen that Erel already developed something that comes close:
https://www.b4x.com/android/forum/threads/b4x-xui-simple-halo-animation.80267/

However, that animation is shown UNDERNEATH the button. I want the animation to be shown INSIDE the button, like in Android, starting from the point in the button where the finger went down (and not centered in the button).

This is simple to do with a panel, which can have an ImageView as a child, and by animating the child the animation can be played. However, buttons cannot have children. So I think the animation must be done by changing the background bitmap of the button. But that means the standard B4X animations cannot be used, which might have an impact on performance.

How can I attack this problem?

 

[teddybear]

I want to add a halo animation to my B4X buttons. I've seen that Erel already developed something that comes close:
https://www.b4x.com/android/forum/threads/b4x-xui-simple-halo-animation.80267/

However, that animation is shown UNDERNEATH the button. I want the animation to be shown INSIDE the button, like in Android, starting from the point in the button where the finger went down (and not centered in the button).

This is simple to do with a panel, which can have an ImageView as a child, and by animating the child the animation can be played. However, buttons cannot have children. So I think the animation must be done by changing the background bitmap of the button. But that means the standard B4X animations cannot be used, which might have an impact on performance.

How can I attack this problem?

You can use a label instead of button.

 

[Jeffrey Cameron]

Put your button, and the animation control in a panel together. Make sure your animation control has a higher elevation than the button.

 

[Chipbeard]

The question you asked is very good. I read it carefully but could not find anyone to help me understand it. Anyone can describe it correctly here https://www.b4x.com/android/forum/threads/halo-animation-how-10eloto-to-proceed.140066/

Thanks

 

[ilan]

do you mean ripple effect?

Ripple Effect library

This library wraps this open source project: https://github.com/patrickpissurno/RippleEffect License: https://github.com/patrickpissurno/RippleEffect/blob/master/LICENSE.txt You can use it to add ripple effects to views: (image taken from the open source documentation) It is simple to use...

www.b4x.com

 

[wimpie3]

Exactly that. But I need a B4X solution that works on B4X Buttons.

 

[mcqueccu]

Keeping ripple effect within rounded panel

I have been trying to use the ripple effect library inside a rounded panel, the ripple keeps going out out the corners. I also tried using Erels halo animation example but I still get the same effect. Is there any solution to this?

www.b4x.com

 

[wimpie3]

A panel is not a button...

 

[ilan]

Exactly that. But I need a B4X solution that works on B4X Buttons.

You can always create a custom view.
It should be very simple to create such a view for b4x but i am sure there are already some solutions in the forum

 

[TILogistic]

Exactly that. But I need a B4X solution that works on B4X Buttons.

if you want a button with ripple.

see:

RippleButton Class

Hi All, This custom view class will act as a button with ripple effect when clicked, it also has water effect if you swipe/move the pointer onto the view. This class was inspired by SwiftButton (Part of XUI Views) and also advice from this post to make the code more customizable properties...

www.b4x.com

 

[wimpie3]

Yes I know, but those are new views. I'd like to apply the ripple effect to a standard button, like the ones used in the XUI dialogs for instance.

 

[LucaMs]

I just got a glimpse of Erel's code (Simple Halo Animation).
It creates a Panel on which it performs the animation; a modification will suffice to make this Panel overlap your View and be of the same size.

 

[wimpie3]

Overlapping isn't a solution cause there might be text on the button.

 

[LucaMs]

Overlapping isn't a solution cause there might be text on the button.

 

[LucaMs]

I just got a glimpse of Erel's code (Simple Halo Animation).
It creates a Panel on which it performs the animation; a modification will suffice to make this Panel overlap your View and be of the same size.

Overlapping isn't a solution cause there might be text on the button.

Overlap even a label!

 

[wimpie3]

Yes of course you could overlap a label - but the label text will still be shown UNDERNEATH the animation. The only reason you see the text is because the circle is half transparent. If your animation has 0 transparency, your trick won't work anymore.