简体   繁体   English

Flutter Firebase Auth:如何在Flutter抽屉中显示用户电子邮件和名称

[英]Flutter Firebase Auth: How to display the user email and name in the Flutter Drawer

I have successfully retrieved the user email and name from Firebase Auth. 我已经从Firebase Auth中成功检索了用户电子邮件和名称。 But i want to display this in the Flutter Drawer 但是我想在Flutter Drawer中显示它

Name and Email retrieval: 姓名和电子邮件检索:

    Future<FirebaseUser> _handleSignIn() async {
  final GoogleSignInAccount googleUser = await _googleSignIn.signIn();
  final GoogleSignInAuthentication googleAuth = await googleUser.authentication;

  final AuthCredential credential = GoogleAuthProvider.getCredential(
    accessToken: googleAuth.accessToken,
    idToken: googleAuth.idToken,
  );

  final FirebaseUser user = await _auth.signInWithCredential(credential);
  print("signed in " + user.displayName);
  print("signed in " + user.email);
  return user;
}

Flutter Drawer: 颤振抽屉:

drawer: new Drawer(
    elevation: 10.0,
    child: new ListView(
      children: <Widget>[
        new UserAccountsDrawerHeader(
          accountName: new Text("Name"), //I want to display user NAME here
          accountEmail: new Text("Email"), //display user EMAIL here 
          decoration: new BoxDecoration(
              image: new DecorationImage(
                  fit: BoxFit.fill,
                  image: new NetworkImage(
                      "https://img00.deviantart.net/35f0/i/2015/018/2/6/low_poly_landscape__the_river_cut_by_bv_designs-d8eib00.jpg"))),
        ),

just call current user and then you will have the currentUser data, use it in your drawer 只需调用当前用户,然后您将拥有currentUser数据,可在抽屉中使用它

// call this in initState for example
final FirebaseUser user = await _auth.currentUser();

// reset of code
drawer: Drawer(
  elevation: 10.0,
  child: ListView(
    children: <Widget>[
      UserAccountsDrawerHeader(
        accountName: Text("${user.displayName}"),
        accountEmail: Text("${user.email}"),
        decoration: BoxDecoration(
          image: DecorationImage(
            fit: BoxFit.fill,
            image: NetworkImage("${user.photoUrl}"),
          ),
        ),
      ),
    ],
  ),
),

Full Page Example 整页示例

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

class ExamplePage extends StatefulWidget {
  @override
  _ExamplePageState createState() => _ExamplePageState();
}

class _ExamplePageState extends State<ExamplePage> {
  final FirebaseAuth _auth = FirebaseAuth.instance;
  FirebaseUser user;

  @override
  void initState() {
    super.initState();
    initUser();
  }

  initUser() async {
    user = await _auth.currentUser();
    setState(() {});
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("this is an appbar yaay!"),
      ),
      drawer: Drawer(
        elevation: 10.0,
        child: ListView(
          children: <Widget>[
            UserAccountsDrawerHeader(
              accountName: Text("${user?.displayName}"),
              accountEmail: Text("${user?.email}"),
              decoration: BoxDecoration(
                image: DecorationImage(
                  fit: BoxFit.fill,
                  image: NetworkImage("${user?.photoUrl}"),
                ),
              ),
            ),
          ],
        ),
      ),
      body: Center(
        child: Container(),
      ),
    );
  }
}

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM