Android Question UX - How can I achieve similar animations with B4X?

[Mashiane]

Hi there

Calling all UX wizards outthere.

What can we recommend for this kind of animated UX experience in B4X?

Landing Experiments. Sources sorted by complexity

Landing Experiments. Sources sorted by complexity designed by Yaro Zubko. Connect with them on Dribbble; the global community for designers and creative professionals.

dribbble.com

Thanks

 

[Star-Dust]

It is achievable in XUI. I cannot tell you more.

But I only like the first one, the rest seem too spectacular to me

 

[Mashiane]

I only like the first one

Yes, I am also talking about this one exactly!!

So creating the animations one needs to use a timer and some good math logic and some z-indexing skills? Phew!

 

[Star-Dust]

Yes, I am also talking about this one exactly!!

View attachment 101842

It is the simplest to make and to me it seems the most elegant.

 

[LucaMs]

I wouldn't do it at all, it would avoid the users headaches

 

[Mashiane]

It is the simplest to make and to me it seems the most elegant.

I dont know about the simplicity on the animations side (personally) and yes its very elegant!

 

[Unobtainius]

I like the first one too.
If I was getting paid to just muck about I'd love to make it.
But it seems like a lot of work for something most people just want to get rid of so that hey can get on with things

 

[ilan]

i like 1 and 3 and it is indeed possible with b4x. from what i see it should not be too complicated to do that.

 

[AnandGupta]

Looks similar to Alexander Stolte's

[B4X] [XUI] AS Swipe Card - a tinder like swipeable card view [Payware]

Hello Community, This library is not free, because, it cost a lot of time and gray hair to create such views. https://payhip.com/b/ma7bR Thanks for your understanding. :) This library is compatible and tested with B4A,B4I and B4J! If you have bugs or a wish then tell me it in the comments...

www.b4x.com

May be we can use it to get the 1st one near like.

Regards,

Anand

 

[Alexander Stolte]

SetLayoutAnimated + SetRotationAnimated do the job.

 

[TILogistic]

Tips:

View Utils

Subject: Set and get the 'padding' of a view. Sub: setPadding Description: Sets the padding'of a view. 'Sets the padding of a view 'v = view 'Left, Top, Right, Bottom padding values in pixels Sub setPadding(v As View, Left As Int, Top As Int, Right As Int, Bottom As Int) Dim jo = v As...

www.b4x.com

and Others

Search Forum

 

[Mashiane]

Thanks @oparra. Funny enough, Searching for "animation" does not bring up the Android Code Snippet - View Utils. Thanks anyway, now I know.

 

[LucaMs]

Tips:

View Utils

Subject: Set and get the 'padding' of a view. Sub: setPadding Description: Sets the padding'of a view. 'Sets the padding of a view 'v = view 'Left, Top, Right, Bottom padding values in pixels Sub setPadding(v As View, Left As Int, Top As Int, Right As Int, Bottom As Int) Dim jo = v As...

www.b4x.com

and Others

Search Forum

Note that those are for B4A only. All these, instead:

work on B4XViews.

 

[LucaMs]

This is an animation that I like and I don't know if I could do it:


[From this post: https://www.b4x.com/android/forum/threads/the-100-000-downloads-club.49346/post-639042]

 

[TILogistic]

b4j:

JavaFX - Transformations

JavaFX - Transformations - Transformation means changing some graphics into something else by applying rules. We can have various types of transformations such as Translation, Scaling Up or Down, Rotation, Shearing, etc.

www.tutorialspoint.com

Sample:

Rotate Application 90 Degress

For ease of coding, I've laid out the App 1080 wide by 1920 tall. (Portrait) All my references are based on those positions. Now I need to run the App on a 1920*1080 display so I need to rotate everything to fit the screen, can anyone point me in the right direction? Thanks

www.b4x.com

 

[Unobtainius]

Here's my quick attempt
its a bit brute force because that's all I know
and apologies for the reliance on BR_B4XFloatTextField

 

[LucaMs]

and apologies for the reliance on BR_B4XFloatTextField

... and for IME2 too (I didn't have it).

To export the B4XPages project, ctrl + mouse click on this line (or we cannot run it):

(change Project.zip to LogInSignUp.zip, before).

 

[TILogistic]

very nice:

 

[LucaMs]

very nice:

You commented out the line copying from the shared folder.

You should have explained it to me

 

[TILogistic]

... and for IME2 too (I didn't have it).

Is IME

Comment:

'#CustomBuildAction: folders ready, %WINDIR%\System32\Robocopy.exe,"..\..\Shared Files" "..\Files"