Home > Enterprise >  how to navigate to new page when click on the image flutter
how to navigate to new page when click on the image flutter

Time:01-30

i am trying to navigate to a new screen when the client click on the image using on tap or on press but i don't know to use them here is my code

body: SafeArea(
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: [
          Column(
            children: [
              Expanded(
                child: Container(
                  color: Colors.yellowAccent[700],
                  child: ClipRRect(
                    borderRadius: BorderRadius.circular(20), // Image border
                    child: SizedBox.fromSize(
                      size: Size.fromRadius(size),
                      // Image radius
                      child: Image.network(
                          'https://picsum.photos/250?image=9',
                          fit: BoxFit.cover),
                    ),
                  ),
                  margin: EdgeInsets.all(margin),
                ),
              ),

i have the page that i want to navigate but i don't know to navigate when the client click on the image

CodePudding user response:

You could wrap your ClipRRect widget into a GestureDetector to have a onTap event on your image.

CodePudding user response:

try this, hope this helps:

body: SafeArea(
        child: Row(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          children: [
            Column(
              children: [
                Expanded(
                  child: Container(
                    color: Colors.yellowAccent[700],
                    child: ClipRRect(
                      borderRadius: BorderRadius.circular(20), // Image border
                      child: SizedBox.fromSize(
                        size: Size.fromRadius(size),
                        // Image radius
                        child: GestureDetector(
                            onTap: () {
                              Navigator.push(context, MaterialPageRoute(builder: (BuildContext context) => NewScreen()));
                            },
                            child: Image.network('https://picsum.photos/250?image=9', fit: BoxFit.cover)),
                      ),
                    ),
                    margin: EdgeInsets.all(margin),
                  ),
                ),
              ],
            )
          ],
        ),
      ),
  •  Tags:  
  • Related