Unanswered

Animating smoothly with timer

(0) Share

Report

Posted on by romankorchak1

Hi All

I got an HTMl element with linear-gradient css which I am trying to animate smoothly with timer, so I go a following code

"<div style=""
border-radius: 75px, 25px, 25px, 25px;
background: linear-gradient(90deg, rgba(160,45,253,1), rgba(253,45,204,"& If(GoingUpOrDown,Timer1.Value/2000, 1-(Timer1.Value/2000) ) &")); 
width:100%; height:" & Self.Height - 1 &"px;""></div>"

 
And I got following code OnTimerEnd
 
UpdateContext({ GoingUpOrDown:!GoingUpOrDown});

And timer Repeat and Reset is true

Which works, except at the end of the timer colour jerks for a split second

Any ideas why its happening?

Thanks

Categories:

Power Apps Pro Dev & ISV

I have the same question (0)

All responses (2)

Answers (0)

Sort by

WarrenBelz 155,287 Most Valuable Professional on at

Like (0)

Report
Copy link

Link copied!

Hi romankorchak1

If you mean like this

I suspect it will be the timers resetting and momentarily not supplying any value. What you are doing is fairly adventurous.

Please click Does this answer your question if my post helped you solve your issue. This will help others find it more readily. It also closes the item. If the content was useful in other ways, please consider giving it a Like.
MVP (Business Applications) Visit my blog Practical Power Apps Buy me a coffee

Was this reply helpful? Yes No
realwillwright 772 Moderator on at

Like (1)

Report
Copy link

Link copied!

Have you tried looking at SVGs. This blog from Kristine should help, I'm not sure if it will be smoother than the HTML version, but might be worth a go. It is the second method.

PowerHack🔮 #3 Two ways of implementing a gradient background in Canvas Apps — Kristine Kolodziejski

Was this reply helpful? Yes No