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
- Android: edit
android/app/src/main/AndroidManifest.xml. Change the existingandroid:label="AppChat"on the application element to your display name, for exampleandroid:label="My Chat". This package uses a literal label; there is no app_name resource you must find first. - iOS: edit
ios/Runner/Info.plist. SetCFBundleDisplayNameandCFBundleNameto your app name. LeaveCFBundleIdentifieras$(PRODUCT_BUNDLE_IDENTIFIER). - Flutter: change
title: "AppChat"inlib/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. - 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
- In
android/app/build.gradle.kts, set bothnamespaceanddefaultConfig.applicationIdto 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.
}
}
- The activity is
android/app/src/main/kotlin/com/appchat/live/MainActivity.kt, whose declaration ispackage com.appchat.live. Change that declaration to your namespace and move the file to the matching directory, for examplecom/example/mychat/MainActivity.kt. Keep the manifest activity name.MainActivity. - 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. - Set PHP
GOOGLE_PLAY_PACKAGE_NAMEto the same Android application ID. Use matching Play Console products and configure release signing withandroid/key.properties. The supplied Gradle file can fall back to debug signing when this file is missing; verify production signing before uploading. - Replace
your-domain.comin 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)
- 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. - Verify all Runner
PRODUCT_BUNDLE_IDENTIFIERentries inios/Runner.xcodeproj/project.pbxproj; update RunnerTests to a distinct identifier such ascom.example.mychat.RunnerTests. - Register the matching App ID, provisioning and App Store Connect app. Register the matching Firebase
iOS app, add its
GoogleService-Info.plistto Runner, and update Google Sign-In URL schemes and Firebase options as described in the iOS release guide. - 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
- Edit
lib/core/theme/color.dart, especiallyAppColors.primary,primaryDark,secondaryand the gradient lists. Flutter colors use0xAARRGGBB; 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);
- 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. - Test buttons, selected tabs, forms, disabled controls, room overlays and text contrast in both light and dark mode and Arabic/English layouts.
4. Replace the in-app logo
The included brand uses the approved lion mark. Preserve the supplied pixel dimensions when replacing files: assets/app_logo.png is 440 × 440, assets/images/logo.png and assets/brand_lion_1024.png are 1024 × 1024, and assets/brand_mark_80.png is 80 × 80. The 1024 px master drives native launcher generation; the smaller files retain their existing in-app and documentation roles.
- Replace
assets/app_logo.pngwith your own square PNG artwork. Keep the filename for the simplest replacement. A 1024 × 1024 source gives the icon generator enough resolution. - The shared logo widget is
lib/core/widgets/logo.dart; the Flutter startup view inlib/main.dartuses it. Adjust its size/layout if the new mark needs different spacing. - If you choose a different filename, update the widget, other asset references and the launcher
configuration. Ensure the asset remains declared under
flutter.assetsin pubspec.yaml. - Restart the rebuilt application and check logo appearance on the startup/login screens. Replacing this PNG alone does not regenerate native launcher icons or iOS launch artwork.
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
- 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. - In both
res/drawable/launch_background.xmlandres/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
- In Xcode, replace the LaunchImage asset's 1x, 2x and 3x images in
ios/Runner/Assets.xcassets/LaunchImage.imageset. Existing filenames areLaunchImage.png,LaunchImage@2x.pngandLaunchImage@3x.png; keep Contents.json in sync if you rename them. - 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. - 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.