Flutter GestureDetector is not working on functions

class GridDashboard extends StatefulWidget {
  final Function onTap;

  const GridDashboard({Key key, this.onTap}) : super(key: key);
  @override
  _GridDashboardState createState() => _GridDashboardState();
}

class _GridDashboardState extends State<GridDashboard> {
  Items item1 = new Items(
      title: 'Books',
      img: 'assets/images/open-book.png',
      onTap: () {
        Books();
      });
  Items item2 = new Items(
      title: 'Audio',
      img: 'assets/images/headphones.png',
      onTap: () => print('Audio'));   // it works when I just print smth 
  Items item3 = new Items(
      title: 'Videos',
      img: 'assets/images/play-button.png',
      onTap: () {
        Videos();
      });

  @override
  Widget build(BuildContext context) {
    List<Items> myList = [item1, item2, item3];
    return Flexible(
      child: GridView.count(
        childAspectRatio: 1.0,
        padding: EdgeInsets.only(left: 30, right: 20, top: 220),
        crossAxisCount: 2,
        crossAxisSpacing: 20,
        mainAxisSpacing: 20,
        children: myList.map((data) {
          return GestureDetector(
            onTap: data.onTap,   // this line is not working 
            child: Container(
              decoration: BoxDecoration(
                color: Color(0xFFFFFFFF),
                borderRadius: BorderRadius.circular(35),
                boxShadow: [
                  BoxShadow(
                    color: Color(0xFF373234),
                    blurRadius: 6.0,
                    offset: Offset(0, 2),
                  ),
                ],
              ),
              child: Column(
                mainAxisAlignment: MainAxisAlignment.center,
                children: <Widget>[
                  Image.asset(data.img, width: 45),
                  SizedBox(height: 15),
                  Text(
                    data.title,
                    style: GoogleFonts.openSans(
                      textStyle: TextStyle(
                        color: Colors.black,
                        fontSize: 16,
                        fontWeight: FontWeight.w600,
                      ),
                    ),
                  ),
                ],
              ),
            ),
          );
        }).toList(),
      ),
    );
  }
}

class Items {
  String title;
  String img;
  Function onTap;

  Items({this.img, this.title, this.onTap});
}

Hi people. I am building an android app. The above code is for a dashboard (menu) section of my code. The GestureDetector onTap function is not working when I want it to go to another screen. But it works if I just want to print out smth. If you know how to solve this issue can you please help here ?

Thank you.

You can use named routes.

For Example : Add the routes to you MaterialApp

void main() {
  runApp(MaterialApp(
    initialRoute: '/',
    routes: {
      '/': (context) => FirstScreen(),
      '/books': (context) => Books(),
      '/videos': (context) => Videos(),
    },
  ));
}

Change onTap to go to the specific page

 onTap: () {
        Navigator.pushNamed(context, '/books');
      });

Make changes to the widgets accordingly.