Nowadays with millions of games on app stores, it’s hard to compete with all of them and any small change or feature you add to your game will push it more and make the player come back to your game again and again.

This is why we integrate the game services like Game Center and Google Games Services so we can make the players compete with each other to be the number one on our leader board, or to trigger the fire inside the user to unlock all the achievements and discover all the hidden ones.

Games services, what are they?

They are a group of APIs from Apple and Google to simplify some games basic features like leaderboards, achievements, and online matches.

In this tutorial, I’m going to show you how to integrate GameKit and Google Play Games Services with your game, So you can add achievements and make a leaderboard to show the top players.

Let’s start!

Before starting we need to do some work on our Android and iOS projects also we need to enable these features and add achievements and leader board into Google play and Game center.

iOS Configurations

First, you need to open the iOS project, you can do that by navigating to ios file then right-click on Runner.xcworkspace

Now click on reveal in finder

You will see the items as in the image below:

Double click on the Runner.xcworkspace then select the project from the top

Now from the right menu click on Runner target then select Signing & Capabilities, click on add capability button

Search for Game Center

Select it.

Now you can close Xcode.

Now go to the iTunes Connect, Then select your app, select features, then Game Center, now from here you can add an achievement or a leaderboard it’s a very simple process.

For adding a new leader board click on the add icon, then select Single Leaderboard, now enter the name, id, and the score format type, for the Score Submission Type it’s to decide which score should the leaderboard keep, the latest one or the highest one. One last thing, you need to add a language, go to Leaderboard Localization and click on add language, a new dialog will open select the language and enter the name, score format, and score suffix.

Like this, we have added our first leaderboard.

Now for the achievements, it’s almost the same thing click on add achievement icon, enter the name, id, and points and don’t forget to add a language from the Achievement Localization section.

Now like this we finished all the configurations for our game on iOS.

Android Configurations

First, we need to add two new meta-data to our app, you can do that by navigating to the android project manifest.xml

First metadata will have your app id, we will get this id later in this tutorial and you will come back here to replace your id, the second metadata you will copy-paste it as it’s.

Make sure to add the metadata inside your app application tag.

1
2
3
4
5
6
7

<meta-data
    android:name="com.google.android.gms.games.APP_ID"
    android:value="app_id" />

<meta-data
    android:name="com.google.android.gms.version"
    android:value="@integer/google_play_services_version" />

Now you need to go to the Google play console, Then select your game, from the left side navigation drawer, Navigate to Play Games Services, Setup and management, then Configuration.

Now select No, my game doesn't use Google APIs.

And then select Create.

Take the app id and use it inside the android project manifest.xml (Search in the page for Project ID).

Next, click on Edit properties and enter the description of the game, the icon and feature graphics.

Now, In the Credentials section click on Configure.

Then click on Google Cloud Platform.

Select External.

Now fill ALL the App information, Click Save And Continue.
From the next screen click on Add or remove scopes add these two scopes: games, games_lite and drive.appdata.

Click on Update, then Save And Continue.

Return to Play Console to confirm configuration.

Now, the Credentials view will change, and Add credential button will be enabled. Click on it.

Next, scroll down to Authorization section. Select Create OAuth client.

Now click on Create OAuth Client ID.

Select the Application type as Android, the name as DEBUG, enter your Package name, enter the SHA-1, then click Create. To get the SHA-1 for your debug key follow the steps below.

You can get the SHA1 by executing the following command line .

This command for macOS, You can search how to do the same on Windows.

1

keytool -list -v -keystore ~/.android/debug.keystore -alias androiddebugkey -storepass android -keypass android

This SHA1 is the debug SHA1, when you publish your app on google play you need to get the production SHA1 to know more about it check the last section.

Now go back to the Google play console, click on Done, select the OAuth client we just created from the drop down list. And then click on Save changes.

Now we need to add a new leaderboard by going to the leaderboards then click on add leaderboard, enter the name of the leader board and add an icon then save.

And to add achievements go to achievements and add new achievement, enter the name of the achievement, the description, and the icon then click save.

Now, you need to go to publishing and click on Publish.

One last important thing!

You do need to enable the OAuth APIs that you want, using the Google Cloud Platform API manager. You’ll need also to enable the Google People API.
Make sure you’ve filled out all required fields in the console for OAuth consent screen. Otherwise, you may encounter APIException errors.

Like this, we finished all the configurations for our game on Android!.

I know! right now you feel tired doing all these configurations and you are hungry to code, I totally understand you but wait for one last thing!

Games Services

games_services is a flutter plugin I made to support game center and google play games services. so you can easily sign in the user, submit a score, unlock achievements, show the leader board screen, and the achievements screen.

To add the plugin to your project navigate to pubspec.yaml and then add the games_services to the app dependencies.

1

games_services: any

Now press on Packages get, or run flutter pub get.

The code!

First thing you need to do is to sign in the user before doing anything, you can sign in the user by calling

1

GameAuth.signIn();

Don’t forget to import the plugin.

1

import 'package:games_services/games_services.dart';

You can call the sign-in function in the initState method.

1
2
3
4
5

@override
void initState() {
  super.initState();
  GameAuth.signIn();
}

Leaderboards Screen

To show the leaderboards screen you can simply call the showLeaderboards function

1

 Leaderboards.showLeaderboards(iOSLeaderboardID: 'ios_leaderboard_id', androidLeaderboardID: 'android_leaderboard_id');

You can get the iOSLeaderboardID from the iTunes connect, (if you remember we created a new leader board for iOS you can take that leader board id and put it here).

Result:

Achievements Screen

To show the achievements screen you need to call the showAchievements function

1

Achievements.showAchievements();

When you call it a new screen will open with the list of achievements.

Result:

Submit a score

To submit a Score to a specific leader board, you need to create a Score object and send it using submitScore function.

-The Score class takes three parameters:
-androidLeaderboardID: the leader board id that you want to send the score to in the case of android.
-iOSLeaderboardID the leader board id that you want to send the score for in case of iOS.
-value the score.

1

Leaderboards.submitScore(score: Score(androidLeaderboardID: 'android_leaderboard_id', iOSLeaderboardID: 'ios_leaderboard_id', value: 5));

Unlock achievement

To unlock an Achievement, you need to send an AchievementObject to the unlock function.

The Achievement takes three parameters:
-androidID the achievement id for android.
-iOSID the achievement id for iOS.
-percentComplete the completion percent of the achievement, this parameter is optional in case of iOS.

1

Achievements.unlock(achievement: Achievement(androidID: 'android_id', iOSID: 'ios_id', percentComplete: 100, steps: 2)); 

More!

The games_services has plenty of features that you can discover yourself like:

• Save game, to save a game progress.
• Support for macOS.
• Get player info.

To know more check the documentation.

SHA-1

When you publish your game don’t forget to add the SHA-1 of the release build. In the google play console, go to your app then Release -> Setup -> App integrity -> App Signing -> SHA-1 certificate fingerprint

Get that SHA1 and add it to your Play Games Services Configuration Credentials.

Support my game!

I tried this plugin in my own game and it’s working perfectly. To check my game here android or iOS

Ready to go!

Your game now is ready to go, you can publish the new update to your players with the leader board and achievements and let them enjoy theses new features!.

-❤️~.
If you have any questions you can send me a message on Twitter or facebook. Also you can check my Github page or my Apps.