cancel
Showing results for 
Search instead for 
Did you mean: 
Reply
CMHants
Level: Powered On

Configurable countdown timer with progress bar

Hi Guys,

 

My brick wall is gone so I've turned to the forums for help !! 

 

My aim is to create a configurable countdown timer with a progress bar that fills as the timer gets nearer to zero. so far I've managed to reverse the standard timer control to countdown and add inputs to specify the desired amount of time.

 

the one thing i cant seem to get my head round is how to set up the progress bar. i think i should use a slider control with the handle shrunk, but how do i connect it to the timer, should i collect the timer text value live, if sso, how?

 

help:-)

 

many thanks powerapps friends 

1 ACCEPTED SOLUTION

Accepted Solutions
Community Support Team
Community Support Team

Re: Configurable countdown timer with progress bar

Hi @CMHants,

 

I have made a test on my side, please take a try with the following workaround:1.JPG

 

 

Add a Timer control and a Slider control within my screen. 

 

Set the Duration property of the Timer control (Timer1) to following formula:

30000

Set the Text property of the Timer control to following formula:

Text(Time(0, 0,(Timer1.Duration-Timer1.Value)/1000), "hh:mm:ss")

Set the OnTimerEnd property of the Timer control to following formula:

UpdateContext({IsReset:false});UpdateContext({IsReset:true})

Set the Reset property of the Timer control to following formula:

IsReset

 

Set the Default property of the Slider control (Slider1) to following formula:

(Timer1.Duration-Timer1.Value)/1000

Set Max property of the Slider control to following formula:

30

The GIF image as below:Test1.gif

 

 

Best regards,

Kris

Community Support Team _ Kris Dai
If this post helps, then please consider Accept it as the solution to help the other members find it more quickly.

View solution in original post

3 REPLIES 3
Community Support Team
Community Support Team

Re: Configurable countdown timer with progress bar

Hi @CMHants,

 

I have made a test on my side, please take a try with the following workaround:1.JPG

 

 

Add a Timer control and a Slider control within my screen. 

 

Set the Duration property of the Timer control (Timer1) to following formula:

30000

Set the Text property of the Timer control to following formula:

Text(Time(0, 0,(Timer1.Duration-Timer1.Value)/1000), "hh:mm:ss")

Set the OnTimerEnd property of the Timer control to following formula:

UpdateContext({IsReset:false});UpdateContext({IsReset:true})

Set the Reset property of the Timer control to following formula:

IsReset

 

Set the Default property of the Slider control (Slider1) to following formula:

(Timer1.Duration-Timer1.Value)/1000

Set Max property of the Slider control to following formula:

30

The GIF image as below:Test1.gif

 

 

Best regards,

Kris

Community Support Team _ Kris Dai
If this post helps, then please consider Accept it as the solution to help the other members find it more quickly.

View solution in original post

Highlighted
Super User
Super User

Re: Configurable countdown timer with progress bar

In this video, I show you how to do Flyout menus for PowerApps which is the same concept as Kris wrote up. You use the timer control and some math to slowly move a control. 

Shane - Microsoft MVP, YouTube, and PowerApps Consulting for when you are in a bind to get this fixed quickly. And finally we now have PowerApps Training
CMHants
Level: Powered On

Re: Configurable countdown timer with progress bar

guys this works great - many thanks for help 

Helpful resources

Announcements
firstImage

Microsoft Business Applications Virtual Launch Event

Join us for an in-depth look at the new innovations across Dynamics 365 and the Microsoft Power Platform.

firstImage

Watch Sessions On Demand!

Continue your learning in our online communities.

Power Platform 2019 release wave 2 plan

Power Platform 2019 release wave 2 plan

Features releasing from October 2019 through March 2020

FirstImage

Power Platform World Tour

Coming to a city near you

thirdimage

PowerApps Community User Group Member Badge

Fill out a quick form to claim your user group badge now!

FourthImage

Join PowerApps User Group!!

Connect, share, and learn with your peers year-round

Top Kudoed Authors
Users Online
Currently online: 412 members 2,879 guests
Please welcome our newest community members: