App customization guide

Reference for the files delivered in Main_File. Documentation updated 22 September 2026. Examples use fictional IDs and balances; replace them with values from your installation.

Before you customize

Work inside Main_File/flutter_app, the buyer application. Paths below are relative to that directory. Back up your source and choose your public app name, a unique reverse-domain identifier (for example com.example.mychat), brand colors and artwork before registering Firebase and store applications. These examples are placeholders, not production identifiers.

The Dart package name app_chat in pubspec.yaml is separate from the Android application ID and iOS bundle identifier. Keep it unchanged unless you also update every Dart package import. The APPCHAT_* configuration keys are defined in lib/config/appchat_config.dart and must match your build commands.

1. Change the app name

  1. Android: edit android/app/src/main/AndroidManifest.xml. Change the existing android:label="AppChat" on the application element to your display name, for example android:label="My Chat". This package uses a literal label; there is no app_name resource you must find first.
  2. iOS: edit ios/Runner/Info.plist. Set CFBundleDisplayName and CFBundleName to your app name. Leave CFBundleIdentifier as $(PRODUCT_BUNDLE_IDENTIFIER).
  3. Flutter: change title: "AppChat" in lib/main.dart. Search the app's visible text and localization files for AppChat; update public-facing text without blindly renaming imports, API keys or class names.
  4. Rebuild and install the app. Check the home-screen label, recent-apps screen, login page, share text and translated screens. Store listing names are set separately in the buyer's store consoles.

2. Change the Android application ID and iOS bundle identifier

Android

  1. In android/app/build.gradle.kts, set both namespace and defaultConfig.applicationId to your identifier:
android {
    namespace = "com.example.mychat"
    // Keep the remaining existing Android settings.
    defaultConfig {
        applicationId = "com.example.mychat"
        // Keep the existing SDK and version settings.
    }
}
  1. The activity is android/app/src/main/kotlin/com/appchat/live/MainActivity.kt, whose declaration is package com.appchat.live. Change that declaration to your namespace and move the file to the matching directory, for example com/example/mychat/MainActivity.kt. Keep the manifest activity name .MainActivity.
  2. Create/register a Firebase Android app using the new ID and replace android/app/google-services.json. Register the signing fingerprints for debug testing and your production signing setup. Check Google Sign-In with the newly built app.
  3. Set PHP GOOGLE_PLAY_PACKAGE_NAME to the same Android application ID. Use matching Play Console products and configure release signing with android/key.properties. The supplied Gradle file can fall back to debug signing when this file is missing; verify production signing before uploading.
  4. Replace your-domain.com in the manifest's app-link hosts and configure the corresponding domain association for your ID/signing certificate. Review the optional custom URL scheme for your brand.

iOS (requires macOS and Xcode)

  1. Open ios/Runner.xcworkspace. In Runner → Signing & Capabilities, select your Apple team and change the Bundle Identifier. Apply the ID to Debug, Profile and Release configurations.
  2. Verify all Runner PRODUCT_BUNDLE_IDENTIFIER entries in ios/Runner.xcodeproj/project.pbxproj; update RunnerTests to a distinct identifier such as com.example.mychat.RunnerTests.
  3. Register the matching App ID, provisioning and App Store Connect app. Register the matching Firebase iOS app, add its GoogleService-Info.plist to Runner, and update Google Sign-In URL schemes and Firebase options as described in the iOS release guide.
  4. Test Google Sign-In, push notifications, app links and a sandbox purchase again after changing identifiers. Published store apps must retain their established IDs for updates; a new ID creates a separate app.

3. Change colors and themes

  1. Edit lib/core/theme/color.dart, especially AppColors.primary, primaryDark, secondary and the gradient lists. Flutter colors use 0xAARRGGBB; FF is fully opaque.
// Example replacement values inside the existing AppColors class:
static const Color primary = Color(0xFF2563EB);
static const Color primaryDark = Color(0xFF60A5FA);
static const Color secondary = Color(0xFF14B8A6);
  1. Review lib/core/theme/theme.dart. It contains light/dark ThemeData plus additional literal colors, including navigation and selection colors. Adjust these and screen-specific gradients where required; changing one constant does not recolor every asset or widget.
  2. Test buttons, selected tabs, forms, disabled controls, room overlays and text contrast in both light and dark mode and Arabic/English layouts.

5. Regenerate the launcher icon

The project already includes flutter_launcher_icons. In pubspec.yaml, review the existing flutter_launcher_icons block: image_path and adaptive_icon_foreground both point to assets/brand_lion_1024.png. Set adaptive_icon_background and background_color_ios to your brand background; keep remove_alpha_ios: true. Keep the mark inside the adaptive icon safe area and inspect several Android icon shapes.

flutter pub get
dart run flutter_launcher_icons

Run from flutter_app. The tool updates Android mipmap/adaptive icon resources and ios/Runner/Assets.xcassets/AppIcon.appiconset; the existing configuration also generates Windows icons. Rebuild and check the installed home-screen icon on both platforms. A launcher can cache the old artwork; verify on a fresh test installation if necessary.

6. Customize the splash screen

There are two stages: the native launch screen before Flutter starts, then the Flutter startup view. This package has no flutter_native_splash dependency or generator configuration. Use the native files below; the launcher icon command does not generate a splash screen.

Android before Android 12

  1. Add your splash artwork as android/app/src/main/res/drawable/splash_logo.png, or supply matching density variants. Use a suitably sized transparent mark rather than a full-screen screenshot.
  2. In both res/drawable/launch_background.xml and res/drawable-v21/launch_background.xml, replace the layer-list with your background and centered logo, for example:
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@android:color/white" />
    <item>
        <bitmap android:gravity="center" android:src="@drawable/splash_logo" />
    </item>
</layer-list>

For a brand background, define splash_background in res/values/colors.xml and use @color/splash_background. Review res/values/styles.xml and res/values-night/styles.xml; their LaunchTheme windowBackground should reference launch_background.

Android 12 and later

Create res/values-v31/styles.xml and res/values-night-v31/styles.xml with a LaunchTheme override. The system splash uses an icon and background; it does not display an arbitrary full-screen legacy launch image. Use these native attributes, retaining other theme settings your app needs:

<resources>
    <style name="LaunchTheme" parent="@android:style/Theme.Light.NoTitleBar">
        <item name="android:windowSplashScreenBackground">@android:color/white</item>
        <item name="android:windowSplashScreenAnimatedIcon">@drawable/splash_logo</item>
        <item name="android:windowBackground">@drawable/launch_background</item>
    </style>
</resources>

Choose a dark-compatible background in the night override. Follow the Android splash-screen guide for system sizing/masking and test on Android 12+ as well as an older device.

iOS

  1. In Xcode, replace the LaunchImage asset's 1x, 2x and 3x images in ios/Runner/Assets.xcassets/LaunchImage.imageset. Existing filenames are LaunchImage.png, LaunchImage@2x.png and LaunchImage@3x.png; keep Contents.json in sync if you rename them.
  2. Open ios/Runner/Base.lproj/LaunchScreen.storyboard. Change the background color and inspect the centered LaunchImage, its size and constraints in Interface Builder. Keep a static layout suitable for supported screen sizes.
  3. Cold-start a physical iPhone and inspect both native launch artwork and the following Flutter logo view. Hot reload does not update native launch resources.

7. Rebuild and verify

flutter clean
flutter pub get
dart run flutter_launcher_icons
flutter build appbundle --release --dart-define=APPCHAT_API_BASE_URL=https://api.example.com/ --dart-define=APPCHAT_API_KEY=YOUR_API_KEY

Replace placeholders and supply your signing/Firebase files first. On macOS follow iOS signing and release for the iOS build. Check the name, identifier, colors, in-app logo, launcher icon and both splash stages on installed builds, then retest login, notifications, voice and purchases. Keep private signing and service-account files out of the buyer distribution.