Flutter – How to center an icon to a trailing Container within a list tile?

The IconButton class has a padding parameter which defaults to 8.0 if not explicitly defined. This padding affects the Icon widget of the IconButton class, hence the reason why it looks shifted. IconButton’s padding property

The padding around the button’s icon. The entire padded icon will react to input gestures.
This property can be null. If null, it defaults to 8.0 padding on all sides.

To resolve the issue, you can set padding to 0.0 in the IconButton class.

Widget build(BuildContext context) {
    return Container(
      child: ListTile(
        onTap: () {},
        shape: RoundedRectangleBorder(
          borderRadius: BorderRadius.circular(20),
        ),
        contentPadding: EdgeInsets.symmetric(horizontal: 20, vertical: 20),
        tileColor: Colors.white,
        leading: Icon(Icons.check_box, color: tdBlue),
        title: Text(
          'Check Mail',
          style: TextStyle(
              fontSize: 16,
              color: tdblack,
              decoration: TextDecoration.lineThrough),
        ),
        trailing: Container(
          padding: EdgeInsets.all(0),
          margin: EdgeInsets.symmetric(vertical: 12),
          width: 25,
          height: 25,
          decoration: BoxDecoration(
            color: tdRed,
            borderRadius: BorderRadius.circular(5),
          ),
          child: IconButton(
            alignment: Alignment.center,
            padding: const EdgeInsets.all(0.0),
            color: Colors.white,
            iconSize: 18,
            icon: Icon(Icons.delete),
            onPressed: () {},
          ),
        ),
      ),
    );
  }
}