GestureDetector in my flutter code doesn't work

0

I am playing around with the flip_card package (This package creates a card and when you tap on, it flips the card and shows front or behind the card). What I am trying to do is, to show different image each time I tap on the card, and the card flips to front side.

To do so I modified the flip_card example to a stateful widget and used GestureDetector to detect the taps:

_renderContent(context) {
    return Card(
      elevation: 0.0,
      margin: EdgeInsets.only(left: 32.0, right: 32.0, top: 10.0, bottom: 0.0),
      color: Color(0x00000000),
      child: FlipCard(
        direction: FlipDirection.HORIZONTAL,
        front: GestureDetector(
          behavior: HitTestBehavior.opaque,
          onTap: _tapHandler,
          child: Container(
            decoration: BoxDecoration(
                color: Color(0xFF006666),
                borderRadius: BorderRadius.all(Radius.circular(8.0)),
                boxShadow: [BoxShadow(blurRadius: 15.0, spreadRadius: 0.8)],
                image: DecorationImage(
                  image: AssetImage(_cards[_cardInd]),
                  fit: BoxFit.cover,
                )),
            child: Column(
              mainAxisAlignment: MainAxisAlignment.center,
              children: <Widget>[
                Text('Back', style: Theme.of(context).textTheme.headline),
                Text('Click here to flip front',
                    style: Theme.of(context).textTheme.body1),
              ],
            ),
          ),
        ),
        back: Container(
          decoration: BoxDecoration(
              color: Color(0xFF006666),
              borderRadius: BorderRadius.all(Radius.circular(8.0)),
              boxShadow: [BoxShadow(blurRadius: 15.0, spreadRadius: 0.8)],
              image: DecorationImage(
                image: AssetImage(_cards[0]),
                fit: BoxFit.cover,
              )),
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              Text('Back', style: Theme.of(context).textTheme.headline),
              Text('Click here to flip front',
                  style: Theme.of(context).textTheme.body1),
            ],
          ),
        ),
      ),
    );
  }

and the tapHandler function is:

void _tapHandler() {
    setState(() {
      _cardInd = x.nextInt(_cards.length); 
    });
    print("_cardInd $_cardInd"); 
  }

_cardInd is an index to the List of image assets, _cards. However, the GestureDetector doesn't work. Neither image changes nor the print("_cardInd $_cardInd"); gets printed on the screen.

Could someone help me so that when I tap on the card the image changes?

dart
flutter
asked on Stack Overflow Nov 7, 2018 by Corey

0 Answers

Nobody has answered this question yet.


User contributions licensed under CC BY-SA 3.0