Flutter : how to make an entire row clickable

  child: GestureDetector(
      behavior: HitTestBehavior.translucent,
      onTap: () {
      ///
      },

row: mainAxisAlignment: MainAxisAlignment.spaceBetween

For space between, the first and the last object will stick to the edge of the container, while leaving the empty unused space in between (if there is other objects, it will distributed it evenly), like shown in the screenshot below:

Hence to solve this, you just have to make sure that there is no empty space between.

One way is to use mainAxisSize: MainAxisSize.max and MainAxisAlignment.start in the Row where you put your icon and text.

replace GestureDetector with InkWell works great

full code

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  int _counter = 0;

  void _incrementCounter() {
    setState(() {
      _counter++;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            InkWell(
              onTap: () {
                print("click");
              },
              child: buildItem(
                  Image.network("https://picsum.photos/250?image=9",),
                  "logout"
              ),
            ),
            Text(
              'You have pushed the button this many times:',
            ),
            Text(
              '$_counter',
              style: Theme.of(context).textTheme.display1,
            ),
          ],
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: _incrementCounter,
        tooltip: 'Increment',
        child: Icon(Icons.add),
      ),
    );
  }
}

Widget buildItem(Widget icon, String title) {
  return Padding(
      padding: const EdgeInsets.only(left: 20, right: 15),
      child: Row(
          crossAxisAlignment: CrossAxisAlignment.start,
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          children: <Widget>[
            Container(
                child: Row(
                  children: <Widget>[
                    icon,
                    SizedBox(width: 20.0),
                    Text(
                      title,
                      style: TextStyle(
                        fontSize: 16.0,
                      ),
                    ),
                  ],
                )),
            Icon(
              Icons.arrow_forward_ios,
              size: 20.0,
            ),
          ],
      ),
  );
}