Complete Guide to Changing App Display Name in Flutter Across Platforms

Overview of Changing App Display Name in Flutter

Modifying the display name of a Flutter application is a common requirement during development. Unlike native app development, Flutter, as a cross-platform framework, requires separate configuration for the app name on each target platform. This article details the methods for changing the app display name on Android, iOS, Windows, and Linux platforms, based on Flutter official documentation and practical development experience.

Android Platform Configuration

For the Android platform, the app display name is modified through the AndroidManifest.xml file, located in the android/app/src/main/ directory of the project. In AndroidManifest.xml, locate the <application> tag and change the value of the android:label attribute. For example, to change the app name from "testapp" to "My Trips Tracker", use the following code:

<application
    android:label="My Trips Tracker"
    ...>

After making changes, rebuild and run the application for the modifications to take effect. Note that the android:label attribute affects not only the name displayed on the home screen but also in system settings and other locations.

iOS Platform Configuration

Configuration for the iOS platform is more complex and involves modifying settings in the Xcode project. First, open the Runner.xcworkspace file in the ios directory of the Flutter project. In Xcode, select the Runner project in the project navigator, then choose the Runner target in the main view sidebar. Switch to the General tab and modify the Display Name field.

Alternatively, you can directly edit the Info.plist file located in the ios/Runner/ directory. Update the value for the CFBundleDisplayName key:

<key>CFBundleDisplayName</key>
<string>My Trips Tracker</string>

According to Issue #43877 in the reference article, in some Flutter versions, the iOS app name might be influenced by the name field in the pubspec.yaml file. If the name does not change after the above modifications, check the Flutter version and consider upgrading to the latest stable release.

Windows Platform Configuration

For the Windows platform, modify the app display name in the windows/runner/main.cpp file. Around line 30 (the exact line may vary by Flutter version), find the window creation code and change the window title parameter:

if (!window.Create(L"My Trips Tracker", origin, size)) {
    return EXIT_FAILURE;
}

The string parameter here represents the window title displayed in the Windows system.

Linux Platform Configuration

Configuration for the Linux platform involves modifying relevant code in two files. First, in the linux/my_application.cc file, update the title-setting code:

gtk_header_bar_set_title(header_bar, "My Trips Tracker");
gtk_window_set_title(window, "My Trips Tracker");

The first line sets the title bar title, and the second sets the window title. Together, these determine the app's display name in the Linux desktop environment.

Important Considerations and Best Practices

After modifying configurations on any platform, you must stop the currently running application and restart it for the changes to take effect. For the iOS platform, it is recommended to run the flutter clean command to clear the build cache and then rebuild the project.

Cross-platform consistency is a key principle in Flutter development. When changing the app display name, ensure it is consistent across all platforms to provide a unified user experience. Additionally, record these configuration changes in version control to facilitate team collaboration and future maintenance.

If the name does not update after modification, first verify the file path and syntax, then confirm that the application has been rebuilt. For iOS, try deleting the app and reinstalling it to avoid issues caused by caching.