skip to Main Content

I have a TextField as the child of a GestureDetector. When I tap on the TextField, it gains focus and shows the keyboard on the screen which is normal. But I also want to call the onTap function of the GestureDetector, but it does not work. Other functions, such as onPanDown and onDoubleTap of the GestureDetector works fine but onTap doesn’t work.
Here’s my code:

@override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('Test Page')),
      body: GestureDetector(
        onTap: () {   // <------- Doesn't work
          print('onTap called!');
        },
        onPanDown: (details) {   // <------- Works fine
          print('onPanDown called!');
        },
        onDoubleTap: () {   // <------- Works fine
          print('onDoubleTap called!');
        },
        child: const TextField(
          decoration: InputDecoration(hintText: 'Write something...'),
          minLines: 15,
          maxLines: 15,
        ),
      ),
    );
  }

How to solve this problem and also call the onTap function of the GestureDetector? Thanks in advance.

Note: I want exactly the onTap to be called! For example, the onPanDown almost works for me, but when the TextField is filled with text and when I scroll the TextField, the onPanDown is also called, which is not something I want.

2

Answers


  1. My thoughts are the onTap: could be misinterpreted with all those activities involved in opening the Keyboard, typing and e.t.c. If possible try using the onTap: inside the TextField like so:

    ...
    const TextField(
              decoration: InputDecoration(hintText: 'Write something...'),
              minLines: 15,
              onTap:(){},//<==Try this
              maxLines: 15,
            ),
    
    Login or Signup to reply.
  2. Try this:

    class HomeScreen extends StatefulWidget {
      const HomeScreen({super.key});
    
      @override
      State<HomeScreen> createState() => _HomeScreenState();
    }
    
    class _HomeScreenState extends State<HomeScreen> {
      @override
      Widget build(BuildContext context) {
        return Scaffold(
          body: SafeArea(
            child: Stack(
              children: <Widget>[
                GestureDetector(
                  onTap: () => log("Outer On onTap"),
                ),
                TextField(
                  onTap: () => log("Inner On onTap"),
                  decoration: const InputDecoration(hintText: "Write something..."),
                  minLines: 15,
                  maxLines: 15,
                ),
              ],
            ),
          ),
        );
      }
    }
    
    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search