Your First Flutter App: Polishing the App
You’re almost done with the app. The app is missing two critical pieces - an app icon and a display name. You’ll need to do so separately for iOS and Android. That will entail going into the android and iOS part of the Flutter project.
Each project contains a section for both iOS and Android. These are naturally labeled iOS and Android. In iOS, you can actually open the Xcode project. You simply open up the Runner.xcworkspace file. There you can make any needed adjustments such as dealing with signing certificates. You can open the Android folder in Android Studio but you’ll run into a whole bunch of gradle sync issues.
Okay, lets get started.
To get started, open the project in progress or download the starter project for this episode. First, we’re going to add our icon to our android version of the app. Open up the Android folder and navigate down from app, src, and main. Then open AndroidManifest.xml.
This is your xml configuration file. You’ll see a field called label. Change it to `Bullseye’. Okay, that’s the app name. Now for the icons.
Now android stores icons for different screen resolutions. We put these icons in the folders marked as mipmap followed by the different resolution densities. Copy the image files from the resources and drop them in the corresponding directories.
Once those are in place, build and run on the emulator. Now, exit out of the app and check out your app directory. You’ll see our new icon and app title. Okay that was Android. Now let’s do iOS
Open up the iOS folder and select the Runner.workspace file. Right click to reveal in finder then double click to open in Xcode. In Xcode, select the project and in the project, select the Runner target. In the display name, type Bullseye.
Now for the images. Open the Assets file and then select AppIcon. You’ll see we have lots of different icons for different resolutions. All of them have the flutter logo. Select them all then delete them. Now, using the icons from the app resource file, copy them to the appropriate place.
Now save. Start up an iOS simulator. Then close Xcode. Now, start the app on iOS. Exit out and you’ll see our new icon name and new display name.