Hector4888
Hector4888

Reputation: 569

How to use running countdown timer in listview flutter

I am using following code for this and i want my timer array to show remaining running time(real time)

@override
  Widget build(BuildContext context) {

    return WillPopScope(
      onWillPop:_onWillPop,
      child: Scaffold(
        appBar: AppBar(
        backgroundColor: Colors.lightBlueAccent,
        title: Text("Timer App" , textAlign: TextAlign.center , style: TextStyle(fontSize: 25 ), ), centerTitle: true, // this is all you need
        ),
        body: ListView.builder(itemBuilder: (context, index) {
          return Card(
            elevation: 3,               
            margin: EdgeInsets.only(left :15 ,top: 10 , right:15 , bottom:0),
            child: Padding(
              padding: const EdgeInsets.only(left :0 ,top: 10 , right:0 , bottom:10),
              child: ListTile(
                title: Text(controller.employee.value[index].title! , style: TextStyle(fontWeight: FontWeight.w400 ,
                    fontSize: 30),),
                subtitle: Text(controller.employee.value[index].desc!, style: TextStyle(fontWeight: FontWeight.w400 ,
                    fontSize: 15),),
                trailing: Text(controller.employee.value[index].timer!.substring(0, controller.employee.value[index].timer!.length-2), style: TextStyle(fontWeight: FontWeight.w800 ,
                    fontSize: 15),),
              ),
            ),
          );
        },
            itemCount: controller.itemCount.value
        ),

      ),
    );
  }

Upvotes: 0

Views: 277

Answers (1)

w461
w461

Reputation: 2698

If I understand you correctly, you are asking how to update the page every second or minute and display the updated clock. Since it appears to be some corporate app, I would suggest to use a proper state framework. You could for example use a Cubit from BlocLibrary. There you even find a tutorial for a timer which you could more or less copy.

Upvotes: 1

Related Questions