Amazon.co.uk Widgets

This is the fifteenth part of a journey to build and publish a Flutter™ based app. Now we have an authenticated connected to Google Firebase and its Cloud Firestore database, lets extend our app to allow sign in with Apple too.

pub.dev

Pub.Dev website banner and search screen

Sign in with Apple is not a package from the Flutter team. It is however on Flutters Pub.Dev community which is managed by google for third partes to be able to share packages.

Packages are scored so you can understand a level of quality although this is under development. Some packages also have some other indicators that can help determine f you might want to try to use them in your project. The blue Verified Publisher shield lets you know that a package was published by someone whose identity has been verified by the pub.dev site. The number by the thumbs-up is an indicator of peoples satisfaction witht he package. But most importantly the logo on the far right marks the package as a Flutter Favourite, which Flutter say you should consider first. I'd look for a package from Google first, but this should mean the next best thing. The Flutter team don't need to reinvent the wheel, and cannot accomplish everything, so an active package publishing comminity is welcome. and the Flutter Favourite mark is a good way to try to avoid wasting time on peoples first project submission to pub.dev.

You can read about the rationale behind this here on the Flutter log on Medium - Package Publishers, Ratings and Favorites and theres more about the Flutter Favorite program.


Flutter Favourite Badge
Flutter Favourite designation for Sign in with Apple

Not only is it of high quality and broad applicability, but it fills an important gap in the Flutter feature set. Apple has announced that apps that use other third-party authentication, such as Google Sign In, must also enable Apple Sign In by June 30, 2020 to be accepted in the App Store. Obviously this was crucial functionality to provide for any Flutter developer targeting iOS, but instead of the Flutter team at Google building its own plugin to fill this gap, we leaned on our community. Reaching out to Timm Preetz and Henri Beck, the authors of sign_in_with_apple, we found them to be very responsive and quickly brought the plugin up to the required bar in record time.

Chris Sells in Flutter Package Ecosystem Update

Sign in with Apple

So it seems you can use 'Sign in with Apple' with confidence to allow users to set up an account and sign in to your app with their Apple ID. It has had an engineering code review a flutter framework contributor and is endorsed with the flutter favourite program mark.

Pub.Dev website banner and search screen

Enable Sign In with Apple capabilities for your app in Xcode

Sign In with Apple allows users to set up an account and sign in to your app with their Apple ID.

  1. You can enable Sign In with Apple in Xcode.
    
    cd nameofyourproject/
    $ open ios/Runner.xcodeproj/
    
    
  2. In the project editor, add the Sign In with Apple capability to your target by opening the capability library and double clicking 'Sign In with Apple'. Open the Signing and Capabilities pane and review your Team ID, Bundle Identifier, and Signing certificate are correct.  Xcode Signing and Capabilities pane

Install the plugin

Follow the installation instructions on pub.dev which are :

  1. Add the dependency to your package's pubspec.yaml file:
    
    dependencies:
      sign_in_with_apple: ^2.5.1
    
    
  2. In Android Studio choose 'Pub Get' from the Flutter Toolbar or run $ flutter pub get in the terminal in the project.
  3. Import it into your code
    
    import 'package:sign_in_with_apple/sign_in_with_apple.dart';
    
    

Integrate Sign in with Apple in your code

The code runs, and it brings up the Sign in with Apple dialog on iOS 13, but it is fugly on Android and it needs to be better. It looks very much like we need to learn about asynchronous programming in order to proceed any further. so we will return to Sigin in with Apple after exploring futures and the async and await Dart keywords. Fortunately theres a codelab for that. Dart: Asynchronous programming: futures, async, await which is next.