CODEWITHSUNDEEP
flutterdart
Ardeshir ojan
Ardeshir ojan

Reputation: 2459

Multiple touch in list view in flutter

I have a List of inkwell in my app this inkwells each pushes a new page.if i press two of those items in my app it opens two new page. i want to avoid this. i want to disable onTap in my inkwells for sometime. how can i achieve that.

ListView.builder(
                          itemCount:
                              controller.supplierRequestDetails.length,
                          itemBuilder: (context, int index) {
                            return InkWell(
                               onTap:(){
                                 Navigator.pushNamed(context, 'hello_page'); 
                  }
                        )
                          });

Upvotes: 0

Views: 529

Answers (4)

Anandh Krishnan
Anandh Krishnan

Reputation: 6022

You can use AbsorbPointer or you can just add condition

AbsorbPointer(
      absorbing: true, // by default is true
      child: RaisedButton(
        onPressed: (){
          print('pending to implement onPressed function');
        },
        child: Text("Button Click!!!"),
      ),
    ),

or you can easily manage with conditions

     ListView.builder(
                              itemCount:
                                  controller.supplierRequestDetails.length,
                              itemBuilder: (context, int index) {
                                return InkWell(
                                   onTap:(){
                                  if(yourConditon == true){
                                     Navigator.pushNamed(context,'hello_page'); 
                               }
                              }
                             )
                            });

Upvotes: 0

Manpreet Singh Pandher
Manpreet Singh Pandher

Reputation: 257

Handle onTap like below:

 

   bool isTap=false;

    ListView.builder(
              itemCount: controller.supplierRequestDetails.length,
              itemBuilder: (context, int index) {
                return InkWell(onTap: () async{
                    if(!isTap){
                        isTap = true;
                        
                        await Navigator. pushNamed(context,'hello_page');
                        
                        isTap = false;
                      }
                    },
                 );
   )

Upvotes: 1

Jawad Fadel
Jawad Fadel

Reputation: 828

You Need to add child in inkwell to be clickable

    ListView.builder(
                                  itemCount:
                                      controller.supplierRequestDetails.length,
                                  itemBuilder: (context, int index) {
                                    return InkWell(
   /**-----> */    child:Text("$index"),
                                       onTap:(){
                                         Navigator.pushNamed(context, 'hello_page'); 
                          }
                                )
                                  });

Upvotes: -1

Sheetal Savani
Sheetal Savani

Reputation: 1428

Wrap your Inkwell with IgnorePointer

In your case, if you are using any state management method you can ignore setState and use relatable.

bool isClicked = false;  //Default false


IgnorePointer(
  ignoring: isClicked,
  child: InkWell(
      onTap: () {
        isClicked = true;
        Future.delayed(const Duration(seconds: 2), () {
          isClicked = false;
          setState(() {});
        });
        print("CLICKED 123123123");
        setState(() {});
      },
      child: Container(height :150, width: 150,color: Colors.amber)
    ),
  ),

Upvotes: 1

Related Questions