Time to Publish my First Flutter App on the Store!
Tags: flutter, googleplaystore, mobiledev
Published: 2020-05-20 19:31:15

---
title: Time to Publish my First Flutter App on the Store!
published: true
description: Time to publish my little flutter app on google store
tags: Flutter, GooglePlayStore, MobileDev
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/iv40aj4z1yjfmpha0k0b.png
series: Wrapping my head around Flutter
---

If you didn't read my previous articles, I’m building a **Flutter** app for a children's book[^1]. If you want to check it out: [Hector the little dinosaur](https://hector.aureliemercier.com). The cover image is also part of the book and is not related to _Deno_ at all, I think must have copied from Hector 😂. Last time I did any mobile development before was more than 2 years ago with **React Native**.

## The day to publish the app came 👊
Well at least that's what I thought 😭. Finally, my partner and I finished recording all the pages read by my 4 years old son. These are not perfect but for as first iteration they would suffice, and that was the hardest part of the whole process! So I decided to publish the app for an _Internal test track_ and... 
![Google play console telling me to wait](https://dev-to-uploads.s3.amazonaws.com/i/k0rf3xks9syfb8atyw77.png)
Look at that! I guess I will need to wait for someone to look into my app before I can try a released version from the store.

Anyway I think it's worth sharing the journey.

## Icons and Splash screen
Even before you can submit to the store you want to have a nice launcher icon and a splash screen. 
![Hector Icon](https://dev-to-uploads.s3.amazonaws.com/i/kfbtpkojyralkc02seqh.png)
For the icon part **Flutter** got your back, with this [plugin](https://pub.dev/packages/flutter_launcher_icons) it's very easy to generate all the possible icons with the right formats, no need to waste your time. 

The splash screen however was a little bit more complex and required some manual processes. For the iOS version you must use XCode for this. All you need to do is modify the `LaunchScreen.storyboard` file that you find in the iOS folder inside the project. 
![iOS splash screen in Xcode](https://dev-to-uploads.s3.amazonaws.com/i/ouzshdvh07lav713lksm.png)
I didn't get how to scale the picture but it'll be fine. You need to play a little with settings, but it's quite intuitive even if you don't have much experience with it. I didn't want to mess around too much I just added a picture in the middle and that's it. 

For Android I had to modify `launch_background.xml` and I needed to play a little with it to have something ready.
```xml
<item>
    <shape android:shape="rectangle">
        <solid android:color="@android:color/white" />
    </shape>
</item>
<item>
    <bitmap
        android:gravity="center"
        android:src="@mipmap/launch_image" />
</item>
```
The code above is how you can have a centered image with a white background, default colour would have been black otherwise.
![Android drawable folder structure](https://dev-to-uploads.s3.amazonaws.com/i/rvjr1twsxn1r96btmryq.png)
This is my folder structure so basically I have icons in all sorts of resolutions (generated by the plugin) and splash screen images in various resolutions randomly scaled by me, since I didn't know exactly which resolution goes to which folder, once again, the images are probably too big but it will be ok until I will dig more into the possible settings.

## Build the app for release 💣
Flutter documentation covers this section very well so I won't go into too much details. I just got confused at some point when Goole required me to enroll into `app signing by Google Play` and following the steps it looked like they just made me sign the app again with Android Studio instead of the command line. I probably accepted some terms and condition in the process but anyway, somehow I managed to have my bundle ready to upload!

## Sign up for a developer account 💸
Google charges you "just" $25 to let you publish the app on their store, while Apple charges you £79 for the same thing!

I subscribed and the journey began!
Lost in the Google Play Console! Loads of options and way too many forms to fill, I tried to publish this internal test version but I had to give up since the final button is just disabled and I believe it's because someone need to check the content of my app.

Also, since my app is targeting kids I needed to add a mandatory privacy policy that I generated on a random [website](https://app-privacy-policy-generator.firebaseapp.com/) 😂 and uploaded on the [Hector](https://aureliemercier.com/) site

## Conclusion 🍕
Nothing is lost, the app is good looking I will need to deal with some bureaucracy but soon I will be able to publish my first ever app on the store! And I'm super excited by this.

Also, I don't want to spoil too much, but my previous articles created a snow ball effect! Someone is building Hector in **React Native**! Stay tuned but soon we might be able to make a very good comparison![^2]


[^1]: [Hector the little dinosaur](https://aureliemercier.com/) written and illustrated by [Aurelie Mercier](https://www.instagram.com/aurelie_mercier/). Cover image is also part of the book.
[^2]: As usual thanks to [Peter](https://petervaro.com) for the english corrections here and there ❤️.