How to Change the Name of Your Flutter Application

Flutter Jun 25, 2023

Changing the name of your Flutter application is an essential step in launching or rebranding your application. When making this modification, it is important to ensure consistency across all platforms. In this post, we will go through the process of changing the name of your Flutter application, covering Android, iOS, and the web.

Step 1: Update pubspec.yaml

  1. Open the pubspec.yaml file in your Flutter project.
  2. Locate the name field and update it with the new desired name.
The name should be all lowercase, with underscores to separate words, just_like_this. Use only basic Latin letters and Arabic digits: [a-z0-9_]. Also, make sure the name is a valid Dart identifier—that it does not start with digits and is not a reserved word.
flutter_changing_application_name_in_pubspec

Step 2: Modify the Dart Code

  1. Open the main file (usually main.dart) in the lib directory.
  2. Update the MaterialApp title property with the new name, this name is going to be displayed so you do not have to follow any conventions.
The title is typically displayed in the title bar of the app window or as the app name in the app switcher or task manager of the operating system. On the web, it is used as the page title, which shows up in the browser's list of open tabs.
flutter_changing_application_title_in_material_app

Step 3: Update Android-specific Changes

  1. Open the AndroidManifest.xml file in the android/app/src/main/ directory.
  2. Update the android:label attribute in the <application> tag to reflect the new name.
flutter_changing_application_title_in_android_manifest

Step 4: Adjust iOS-specific Changes

  1. Open the Info.plist file in the ios/Runner/ directory.
  2. Update the values of the <key>CFBundleName</key> and <key>CFBundleDisplayName</key> keys to the new name.
flutter_changing_application_title_in_info_plist

Step 5: Update Web-specific Changes

  1. Open the index.html file in the web/ directory.
  2. Update the content of the <title> tag to the new name.
flutter_changing_application_title_in_index_html

Step 6: Consider Additional Updates

  1. Review other project files (e.g., README, documentation) and update any references to the old name.
  2. Update the launcher icon if needed, check out my post if you need help:
How to change the Launcher Icon in Flutter
Are you about to push your application to Google Play or the App Store, and you want to change the launcher icon of your application? Or are you still developing your application and you just want to have a nice launcher icon?

Conclusion

By following these steps, you can successfully change the name of your Flutter application across various platforms, including Android, iOS, and the web. Make sure to update the pubspec.yaml file, modify your Dart code and make platform-specific changes. This will make sure that the new name is consistent across your application.

Tags