Why do not work the onTap in gesturedetector?

Question

`

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

  @override
  Widget build(BuildContext context) {
    return DefaultLayout(
      child: SafeArea(
        child: Padding(
          padding: const EdgeInsets.symmetric(horizontal: 16.0),
            child: Column(
                children: [
                  const SizedBox(height: 200.0,),
                  InkWell(
                    child: IgnorePointer(
                      child: MainSearchTextFormField(),
                    ),
                    onTap: () {
                      print("call");
                    },
                  ),
                ]
            )
        ),
      ),
    );
  }
}

`

I don't know why the MainSearchTextFormField is not working when I click the MainSearchTextFormField. I hope the SearchOffScreen switches the SearchOnScreen when I click the MainSearchTextFormField.

Please help me.

I hope the SearchOffScreen will be switched the SearchOnScreen when I clicked the MainSearchTextFormField. Bit it didn't.

// this is search_on_screen
class SearchOnScreen extends StatelessWidget {
  const SearchOnScreen ({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return DefaultLayout(
      child: SafeArea(
        top: true,
        bottom: false,
        child: Padding(
          padding: const EdgeInsets.symmetric(horizontal: 0.0),
          child: Column(
            children: [
              CupertinoSearchTextField(
                suffixInsets: EdgeInsets.only(right: 16),ts.only(left: 16),
                padding: EdgeInsets.only(left: 15,top: 15, bottom: 15),
                decoration: BoxDecoration(
                  border: Border(bottom: BorderSide(width: 0.5, color: Color(0xff868686)))
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }
}

// This is search_off_screen
class SearchOffScreen extends StatelessWidget {
  const SearchOffScreen({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return DefaultLayout(
      child: SafeArea(
        child: Padding(
          padding: const EdgeInsets.symmetric(horizontal: 16.0),
          child: GestureDetector(
            onTap: (){
              Navigator.of(context).push(
                MaterialPageRoute(
                    builder: (BuildContext context){
                      return SearchOnScreen();
                    }
                ),
              );
            },
            child: Container(// <-- add this
              child: Column(
                children: [
                  const SizedBox(height: 200.0,),
                  IgnorePointer( // <-- add this
                    child: MainSearchTextFormField(),
                  )
                ], //children
              ),
            ),
          )
        ),
      ),
    );
  }
}

// This is dart.main
void main() {
  runApp(
    _App(),
  );
}

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData(
        fontFamily: 'NotoSans',
      ),
      debugShowCheckedModeBanner: false,
      home: SearchOffScreen(),
    );
  }
}

Answer 1

Because the textfield has pointer to its self you need to disable that in order GestureDetector tap work, so wrap your MainSearchTextFormField with IgnorePointer and then replace GestureDetector with InkWell:

child: Column( 
  children: [
     const SizedBox(height: 200.0,),
     InkWell(
       child: IgnorePointer(
          child: MainSearchTextFormField(),
       ),
       onTap: (){
          Navigator.of(context).push(
            MaterialPageRoute(
                builder: (BuildContext context){
                  return SearchOnScreen();
                }
            ),
          );
        },
     ),
  ]
)