web-dev-qa-db-ja.com

規約に従ってFlutterで[Googleでサインイン]ボタンを作成します

Flutterアプリに「Googleでログイン」ボタンを追加したいのですが。このボタンは、Googleの terms に準拠している必要があります。

私の問題は、私が作成したボタンが本当にひどく見えることです。

Googleがウェブサイトで提供している画像を使用しましたが、ボタンのコードを正しく処理しているかどうかわかりません。

  Widget _createLoginButtonGoogle() {
    return new Expanded(
      child: new Container(
        margin: EdgeInsets.fromLTRB(30.0, 5.0, 30.0, 5.0),
        child: new RaisedButton(
          color: const Color(0xFF4285F4),
          shape: _createButtonBorder(),
          onPressed: () {},
          child: new Row(
            children: <Widget>[
              new Image.asset(
                'res/images/icons/google/btn_google_dark_normal_mdpi.9.png',
                height: 48.0,
              ),
              new Expanded(
                child: _createButtonText('Sign in with Google', Colors.white),
              ),
            ],
          ),
        ),
      ),
    );
  }

私が欲しいのは、私のボタンが元のGoogleボタンのように見えることです

original google button

そして私のバージョンとは違う

my version of the google button

元のGoogleボタンの作成方法を誰かに教えてもらえますか? RaisedButtonを作成するよりも良い方法はありますか?

5
Mani76

白い背景のGoogleロゴ画像と青い背景の浮き出しボタンの場合:

Container(
          margin: EdgeInsets.fromLTRB(30.0, 5.0, 30.0, 5.0),
          child: new RaisedButton(
              padding: EdgeInsets.all(1.0),
              color: const Color(0xff4285F4),
              onPressed: () async {
                _signInWithGoogle();
              },
              child: new Row(
                mainAxisSize: MainAxisSize.min,
                children: <Widget>[
                  Container(
                    padding: EdgeInsets.all(8.0),
                    decoration: BoxDecoration(
                      color: Colors.white,
                    ),
                    child: Image.asset(
                      Images.googleLogo,
                      height: 18.0,
                    ),
                  ),
                  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),
                      )),
                ],
              )),
        ),
0
Ian Pinto