timerevent in html5 canvas

Question

Good day,

I am trying to do dynamic text. When I press button, it will start to increase or decrease, or implement function according to value?

I used to do this AS3 but I can not do it in html5 canvas document.

How can I use a timer event in html5 canvas document?

Is there a list of all these functions in html5 canvas?

some example in AS3, I need in html5 canvas

import fl.motion.MotionEvent;

var sayacTimer:Timer=new Timer(100);
sayacTimer.addEventListener(TimerEvent.TIMER,colsayac);

var sayac:Number=4;
function colsayac(evt:TimerEvent):void {
sayac-=.08;
sayac=(Math.round(sayac*100))/100;
sayac_txt.text=String(sayac);
if(sayac==-30)
{
sayacTimer.stop();
}
}

play_btn.addEventListener(MouseEvent.CLICK,startTimer);
stop_btn.addEventListener(MouseEvent.CLICK,stopTimer);

function startTimer(evt:MouseEvent):void {
sayacTimer.start();
}

function stopTimer(evt:MouseEvent):void {
sayacTimer.stop();
}

ClayUUID · Accepted Answer

I tried to use setTimeout and setinterval but "addEventListener(TimerEvent. in Action script 3.0" is additionally check value of timer and implement function according to its value like in the example.

setinterval() and setTimeout() does not do that.

Important part for me is not timer, it is "listening its value and implementing other functions according to its value."

I think right answer will be with tweenCount and tween get. I'll try.

Nothing in the code you posted checks the value of the timer. You're just checking and modifying a local variable. This canvas code is functionally identical to what you posted:

var sayacTimer = 0;
var sayac = 4;
var _this = this;

function colsayac() {
	sayac -= .08;
	_this.sayac_txt.text = Math.round(sayac * 100) / 100;
	if (sayac <= -30) {
		clearInterval(sayacTimer);
		sayacTimer = 0;
	}
}

this.play_btn.addEventListener("click", startTimer);
this.stop_btn.addEventListener("click", stopTimer);

function startTimer() {
	if (!sayacTimer) {
		sayacTimer = setInterval(colsayac, 100);
	}
}

function stopTimer() {
	clearInterval(sayacTimer);
	sayacTimer = 0;
}

Using tweens for timer functionality would be nuts.

berkay1587 · Answer

https://community.adobe.com/t5/animate/countdown-timer-with-canvas/m-p/9994653?page=1#M183701There is a sample countdown here but I can't set different functions of different values of this timer.

Sign up

To post, reply, or follow discussions, please sign in with your Adobe ID.

Sign in to Adobe Community

To post, reply, or follow discussions, please sign in with your Adobe ID.

Scanning file for viruses.

This file cannot be downloaded