GestureDetector on tap is not triggring on alll the screen-CodePudding

i am learning flutter and i just created an app that will update a counter variable when the user clicks on any part of the screen except the AppBar. However, the GestureDetector does not detect any clicks on the4 screen except for those on the text itself

import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: const Text("i am a title"),
          backgroundColor: Colors.teal,
          leading: const Icon(
            Icons.home,
            color: Colors.white,
          ),
        ),
        body: SafeArea(
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.stretch,
            children: const [
              Expanded(
                child: Clicks(),
              ),
            ],
          ),
        ),
      ),
    );
  }
}

class Clicks extends StatefulWidget {
  const Clicks({super.key});

  @override
  State<Clicks> createState() => _ClicksState();
}

class _ClicksState extends State<Clicks> {
  int count = 0;
  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: () => setState(
        () {
          count  ;
        },
      ),
      child: Center(
        child: Text("total number of clicking on scren is $count "),
      ),
    );
  }
}

CodePudding user response：

The GestureDetector will detect any gestures for it's child - in this case the Text widget.

If you want to detect everything, wrap the entrie Scaffold with a GestureDector.

In this case, you'll have to refactor your code:

import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Clicks();
  }
}

class Clicks extends StatefulWidget {
  const Clicks({super.key});

  @override
  State<Clicks> createState() => _ClicksState();
}

class _ClicksState extends State<Clicks> {
  int count = 0;
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: const Text("i am a title"),
          backgroundColor: Colors.teal,
          leading: const Icon(
            Icons.home,
            color: Colors.white,
          ),
        ),
        body: GestureDetector(
          onTap: () {
            setState(() {
              count  ;
            });
          },
          child: SafeArea(
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.stretch,
              children: [
                Expanded(
                  child: Text("clicked a total of $count times"),
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }
}

CodePudding user response：

Try with below changes :

GestureDetector(
  behavior: HitTestBehavior.translucent,
  onTap: () => setState(
    () {
      count  ;
    },
  ),
  child: Center(
    child: Text("total number of clicking on scren is $count "),
  ),
);