Create Sign-in-with-Google button in Flutter in accordance with the terms

There Is A Pretty Awesome Package Called flutter_signin_button on pub.dev.

You Can Use It It Has Sign In Buttons For

  • Email
  • Google
  • Facebook
  • GitHub
  • LinkedIn
  • Pinterest
  • Tumblr
  • Twitter
  • Apple

With Some Supporting Dark Mode Also With Mini Buttons!

First Add It To Your pubspec.yaml

dependencies:
  ...
  flutter_signin_button:

then import it into your file:

import 'package:flutter_signin_button/flutter_signin_button.dart';

and use the buttons like this:

SignInButton(
  Buttons.Google,
  onPressed: () {},
)

Here Is A Preview Of All The Buttons: enter image description here


I'm giving you a general idea, replace Android icon with your Google image using Image.asset(google_image)

InkWell(
  onTap: () {},
  child: Ink(
    color: Color(0xFF397AF3),
    child: Padding(
      padding: EdgeInsets.all(6),
      child: Wrap(
        crossAxisAlignment: WrapCrossAlignment.center,
        children: [
          Icon(Icons.android), // <-- Use 'Image.asset(...)' here
          SizedBox(width: 12),
          Text('Sign in with Google'),
        ],
      ),
    ),
  ),
)

enter image description here


you can use Padding property of raised button also use property of Row widget and mainAxisSize of button. Following code may help you to understand clearly.

 new Container(
      margin: EdgeInsets.fromLTRB(30.0, 5.0, 30.0, 5.0),
      child: new RaisedButton(
        padding: EdgeInsets.only(top: 3.0,bottom: 3.0,left: 3.0),
        color: const Color(0xFF4285F4),
        onPressed: () {},
        child: new Row(
          mainAxisSize: MainAxisSize.min,
          children: <Widget>[
            new Image.asset(
              'res/images/icons/google/btn_google_dark_normal_mdpi.9.png',
              height: 48.0,
            ),
            new Container(
              padding: EdgeInsets.only(left: 10.0,right: 10.0),
                child: new Text("Sign in with Google",style: TextStyle(color: Colors.white,fontWeight: FontWeight.bold),)
            ),
          ],
        )
      ),
    ),