Onpress On Image Using Gesturedetector Inkwell In Flutter

admin_img Posted By Bajarangi soft , Posted On 09-10-2020

GestureDetector widget and InkWell widget. The both widgets has their own separate functionality with some minor differences. We would use both of them in our current tutorial to see you the difference between them. The both supports onTap() click event

Onpress On Image Using Gesturedetector Inkwell In Flutter

Onpress On Image Using Gesturedetector Inkwell

Complete Code Onpress On Image Using Gesturedetector Inkwell FOr In Flutter
Main.dart

import 'package:flutter/material.dart';
void main() => runApp(MyApp());
void tmpFunction() {
  print('Function Called.');
}
class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
        home: Scaffold(
          appBar: AppBar(
            backgroundColor: Colors.green,
            title: Text('GestureDetector InkWell onPress on Image'),
          ),
            body: SafeArea(
                child: Center(
                    child: Column(children: [
                      GestureDetector(
                        onTap: tmpFunction,
                        child: Image.network(
                          'https://flutter-examples.com/wp-content/uploads/2019/09/image_button.png',
                          width: 200,
                          fit: BoxFit.cover,
                        ),
                      ),
                      InkWell(
                        onTap: tmpFunction,
                        child: Image.network(
                          'https://flutter-examples.com/wp-content/uploads/2019/09/image_button.png',
                          width: 200,
                          fit: BoxFit.cover,
                        ),
                      )
                    ])
                )
            )
        )
    );
  }
}

Related Post