Home > Mobile >  Flutter GestureDetector, how to implement onTap Function?
Flutter GestureDetector, how to implement onTap Function?

Time:03-29

I want to implement the OnTap in the Gesture Detector, i just cant figure out how... Originally i had the OnTap in the Inkwell, but it didnt work, since it didnt "entered" to that function according to Debugger, so i wanted to try out if a Gesture Detector could help...

Widget _buildCardDeck() {
    return Container(
      child: Row(
        children: <Widget>[
          InkWell(
            child: cardDeckClosed.isNotEmpty
                ? Padding(
              padding: const EdgeInsets.all(2.0),
              child: TransformedCard(
                playingCard: cardDeckClosed.last, attachedCards: [], columnIndex: 0,
              ),
            )
                : Opacity(
                 opacity: 1.0,
                  child: Center(
                    widthFactor: 5.0,
                    heightFactor: 7.0,
                    child: GestureDetector(
                      child: Container(
                      padding: const EdgeInsets.all(5.0),
                      color: Colors.white,
                      width: 70.5,
                      height: 100.0,
                      ),
                    ),
                  ),
                  ),
            onTap: () {
              setState(() {
                if (cardDeckClosed.isEmpty) {
                  cardDeckClosed.addAll(cardDeckOpened.map((card) {
                    return card
                      ..opened = false
                      ..faceUp = false;
                  }));
                  cardDeckOpened.clear();
                } else {
                  cardDeckOpened.add(
                    cardDeckClosed.removeLast()
                      ..faceUp = true
                      ..opened = true,
                  );
                }
              });
            },
          ),

CodePudding user response:

it's a pretty straight forward widget, this is a starter code that might help you:

GestureDetector(
          onTap: (){
            // this will fire when you tap
          },
          child: yourChildWidget(),
        )

CodePudding user response:

Try below code, In your above code you write your onTap:(){} function inside InkWell

Using GestureDetector

GestureDetector(
      onTap: () {
        print('Container Pressed');
      },
      child: Container(
        alignment: Alignment.center,
        color: Colors.blue,
        height: 50,
        width: 150,
        child: Text('Ontap Using GestureDetector'),
      ),
    ),

Using InkWell

InkWell(
      onTap: () {
        print('Container Pressed');
      },
      child: Container(
        alignment: Alignment.center,
        color: Colors.blue,
        height: 50,
        width: 150,
        child: Text('Ontap Using InkWell'),
      ),
    ),
  • Related