Add Social Sharing
In the previous post we displayed achievements.
Now let’s add a social sharing feature for achievements
To do so we need to
- add a web share service that calls the web share API of the browser to open the native sharing options of the operating system
- add a bottom sheet that contains a share button
- add a share picture
- add a share pitcure generator so that they do not need to be designed manually for each achievement
- differentiate between a small preview and a larger share picture
After clicking on an achievement badge we display a bottom sheet that contains a preview of the share picture and a share button. Clicking the share button opens the native sharing options of the operating system.

In the next post we will display yearly achievements of a user.