플러터(Flutter) - 유저 프로파일 보여주기

유저 프로파일 사용하기

Firebase를 이용해 구글 로그인을 하게 되면, Firebase 유저 정보를 이용해 로그인한 구글 계정의 유저 프로파일을 보여줄 수 있게 됩니다. 이전에는 dummy 텍스트와 이미지를 계정 정보로 사용했는데, 이번에는 구글 계정에서 사용 중인 계정 이미지와 이메일 주소, 계정 이름을 불러오도록 변경해보았습니다.

 

이때 핵심은 로그인 버튼 클릭 후 구글 계정으로 로그인 후 얻게 되는 User 클래스 변수의 정보를 활용하는 데 있습니다. 이 변수는  User? user = await Authentication.signInWithGoogle(context: context);  앞선 Authentication 클래스의 signInWithGoogle 메서드 실행을 통해 얻게 됩니다. 

 

Firebase에서 제공하는 이 User 클래스 변수를 통해,

구글 로그인 계정의 이름을 표시할 때는 Text(user.displayName!),

이메일 주소를 표시할 때는 Text(user.email!),

계정 이미지를 표시할 때는 NetworkImage(user.photoURL!)

와 같이 사용하게 됩니다.

 

참고로 displayName!, email!, photoURL!과 같이 !가 붙는 이유는, User 클래스에서 이 메서드들이 모두 nullable 타입인 String?을 리턴하기 때문입니다. 예를 들어 displayName 메서드는 String? get displayName { return _delegate.displayName; }과 같은 형식을 취하고 있습니다. 

 

유저 프로파일을 다른 페이지로 넘겨주고 싶을 땐?

유저 프로파일을 얻은 페이지가 아니라 다른 페이지로 이 정보를 넘겨주고 싶을 때는, 유저 프로파일을 넘겨받을 페이지 파일에서 firebase_auth 라이브러리를 import 한 다음, 페이지 위젯의 생성자에 타입이 User인 변수를 넘겨받아 내부 속성으로 사용하도록 설정하면 됩니다. 위 예제에서는 내부 속성 _user에 저장하고 있습니다. 만약 PageName 위젯에서 선언한 _user 속성을 _PageNameState 클래스와 같이 State 클래스에서 사용하고 싶다면, widget._user와 같이 사용하면 됩니다. widget이 PageName이라는 위젯 타입 클래스를 가리키게 됩니다.