google_sign_in_all_platforms_mobile #

这是google_sign_in_all_platforms在移动平台上的实现。

示例代码

以下是使用google_sign_in_all_platforms_mobile插件的基本示例。该示例展示了如何在Flutter应用中实现谷歌账号登录。

import 'package:flutter/material.dart';
import 'package:google_sign_in_all_platforms/google_sign_in_all_platforms.dart'; // 引入插件

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

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

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

  final String title;

  [@override](/user/override)
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  GoogleSignInAccount? _currentUser; // 当前用户信息

  [@override](/user/override)
  void initState() {
    super.initState();
    GoogleSignIn().onCurrentUserChanged.listen((GoogleSignInAccount? account) {
      setState(() {
        _currentUser = account;
      });
    });
    GoogleSignIn().signInSilently(); // 静默登录
  }

  Future<void> _handleSignIn() async {
    try {
      await GoogleSignIn().signIn(); // 显示登录界面
    } catch (error) {
      print(error);
    }
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            if (_currentUser != null)
              Text('当前已登录用户: ${_currentUser?.displayName}')
            else
              Text('未登录'),
            ElevatedButton(
              onPressed: _handleSignIn,
              child: Text('登录'),
            ),
          ],
        ),
      ),
    );
  }
}

说明

引入插件:

import 'package:google_sign_in_all_platforms/google_sign_in_all_platforms.dart';

初始化: 在initState方法中，监听当前用户的变更，并尝试静默登录。

[@override](/user/override)
void initState() {
  super.initState();
  GoogleSignIn().onCurrentUserChanged.listen((GoogleSignInAccount? account) {
    setState(() {
      _currentUser = account;
    });
  });
  GoogleSignIn().signInSilently();
}

处理登录: _handleSignIn方法用于触发谷歌登录。

Future<void> _handleSignIn() async {
  try {
    await GoogleSignIn().signIn();
  } catch (error) {
    print(error);
  }
}

UI展示: 使用Text组件展示用户信息，使用ElevatedButton组件触发登录操作。

[@override](/user/override)
Widget build(BuildContext context) {
  return Scaffold(
    appBar: AppBar(
      title: Text(widget.title),
    ),
    body: Center(
      child: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: <Widget>[
          if (_currentUser != null)
            Text('当前已登录用户: ${_currentUser?.displayName}')
          else
            Text('未登录'),
          ElevatedButton(
            onPressed: _handleSignIn,
            child: Text('登录'),
          ),
        ],
      ),
    ),
  );
}

更多关于Flutter谷歌账号登录插件google_sign_in_all_platforms_mobile的使用的实战教程也可以访问 https://www.itying.com/category-92-b0.html

vueper 1楼

更多关于Flutter谷歌账号登录插件google_sign_in_all_platforms_mobile的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html

当然，下面是一个关于如何使用 google_sign_in_all_platforms_mobile 插件在 Flutter 应用中实现谷歌账号登录的示例代码。这个示例假定你已经有一个 Flutter 项目，并且已经配置好了 Android 和 iOS 的谷歌登录环境。

1. 添加依赖

首先，在你的 pubspec.yaml 文件中添加 google_sign_in_all_platforms_mobile 依赖：

dependencies:
  flutter:
    sdk: flutter
  google_sign_in_all_platforms_mobile: ^0.0.1+1  # 请检查最新版本号

然后运行 flutter pub get 来获取依赖。

2. 配置 Android 项目

确保你的 android/app/src/main/AndroidManifest.xml 文件中包含以下权限和配置：

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.example.yourapp">

    <uses-permission android:name="android.permission.INTERNET"/>
    <application
        ... >
        <meta-data
            android:name="com.google.android.gms.client.measurement.enabled"
            android:value="true"/>
        <activity
            android:name=".MainActivity"
            android:exported="true"
            android:launchMode="singleTop"
            android:theme="@style/LaunchTheme"
            android:configChanges="orientation|keyboardHidden|keyboard|screenSize|smallestScreenSize|screenLayout|density|uiMode"
            android:hardwareAccelerated="true"
            android:windowSoftInputMode="adjustResize">
            <intent-filter>
                <action android:name="android.intent.action.MAIN"/>
                <category android:name="android.intent.category.LAUNCHER"/>
            </intent-filter>
        </activity>
        <!-- Add the following line -->
        <meta-data
            android:name="com.google.android.gms.auth.api.signin.REVOKED"
            android:value="@string/default_web_client_id"/>
    </application>
</manifest>

在 android/app/src/main/res/values/strings.xml 文件中添加你的 default_web_client_id：

<resources>
    <string name="app_name">YourAppName</string>
    <string name="default_web_client_id">YOUR_CLIENT_ID.apps.googleusercontent.com</string>
</resources>

3. 配置 iOS 项目

确保你的 iOS 项目已经配置了 GoogleService-Info.plist 文件，并且已经在 Xcode 中正确设置了 URL Types 和 Google Sign-In 的配置。

4. 实现谷歌登录功能

在你的 Flutter 项目中，创建一个新的 Dart 文件（例如 google_sign_in_page.dart）来实现谷歌登录功能：

import 'package:flutter/material.dart';
import 'package:google_sign_in_all_platforms_mobile/google_sign_in_all_platforms_mobile.dart';

final GoogleSignIn _googleSignIn = GoogleSignIn(
  scopes: <String>[
    'email',
    'https://www.googleapis.com/auth/userinfo.profile',
  ],
);

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Google Sign In Demo',
      home: Scaffold(
        appBar: AppBar(
          title: Text('Google Sign In'),
        ),
        body: Center(
          child: GoogleSignInButton(
            onPressed: () async {
              // Trigger the sign-in flow
              final GoogleSignInAccount? googleUser = await _googleSignIn.signIn();

              if (googleUser == null) return;

              // Obtain the auth details from the request
              final GoogleSignInAuthentication googleAuth = await googleUser.authentication;

              // Create a new credential
              final AuthCredential credential = GoogleAuthProvider.credential(
                accessToken: googleAuth.accessToken,
                idToken: googleAuth.idToken,
              );

              // Once signed in, return the UserCredential
              print('User ID: ${googleUser.id}');
              print('Email: ${googleUser.email}');
              print('Access Token: ${googleAuth.accessToken}');
              print('ID Token: ${googleAuth.idToken}');
            },
          ),
        ),
      ),
    );
  }
}

5. 运行应用

确保你的开发环境已经正确配置了 Android 和 iOS 的模拟器或设备，然后运行你的 Flutter 应用。你应该能看到一个谷歌登录按钮，点击它可以触发谷歌登录流程。

这个示例展示了如何使用 google_sign_in_all_platforms_mobile 插件在 Flutter 应用中实现基本的谷歌账号登录功能。根据你的实际需求，你可能需要进一步处理用户信息和登录状态管理。