ProKit Flutter - Documentation

πŸ“²Flutter Configuration

πŸ•’ Estimated Reading Time: 2 minutes
πŸ“‚ Location: Configurations & Customization β†’ Flutter Configuration

– – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – –

πŸ“Œ What is this file for?

This document helps you configure the Flutter-based mobile application for your ProKit setup. These steps include changing app name, domain, colors, fonts, default language, notification icon, and Firebase settings.

– – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – –

🟩 1. Change App Name

To change your app’s name:

πŸ“ Path:
lib β†’ configs.dart

✏️ Update the following line:

const APP_NAME = 'YOUR APP NAME';

🟩 2. Reconfigure Server URL

πŸ“ Path:
lib β†’ configs.dart

✏️ Update:

const DOMAIN_URL = "ADD YOUR DOMAIN URL";

Replace this with your actual domain like:

https://yourdomain.com/

🟩 3. Change Default Language

πŸ“ Path:
lib β†’ configs.dart

✏️ Edit:

const DEFAULT_LANGUAGE = "LANGUAGE CODE";  // e.g., "en", "ar", "de", "pt", "es"

πŸ’‘ Tip: Use only supported language codes ("en""ar""de""pt""es"). For other languages, additional customization will be required.

  • Use only the language code, not the entire language name. You can find the language codes here.

🟩 4. Change App Font

πŸ“ Path:
lib β†’ app_theme.dart

✏️ Update both DarkTheme and LightTheme like this:

fontFamily: GoogleFonts.FONT_NAME().fontFamily,
textTheme: GoogleFonts.FONT_NAMETextTheme(),

πŸ“Œ Be sure to apply to both themes to ensure UI consistency.

🟩 5. Change Primary & Secondary Color

πŸ“ Path:
lib β†’ utils β†’ colors.dart

✏️ Edit color constants:

const appColorPrimary = Color(0xFF5670CC);
const appColorSecondary = Color(0xFFF67E7D);

πŸ’‘ Tip: Always use full 8-digit hex code (0xFFxxxxxx) to avoid color issues across devices.

🟩 6. Update Notification Icon

πŸ“ Path:
lib β†’ utils β†’ push_notification_service.dart

✏️ In the showNotification() method, update:

const AndroidInitializationSettings initializationSettingsAndroid = AndroidInitializationSettings('@drawable/YOUR NOTIFICATION ICON NAME');
var androidPlatformChannelSpecifics = AndroidNotificationDetails(
'notification',
'Notification',
importance: Importance.high,
visibility: NotificationVisibility.public,
autoCancel: true,
//color: primaryColor,
playSound: true,
priority: Priority.high,
icon: '@drawable/YOUR NOTIFICATION ICON NAME',
);

πŸ“Œ Replace YOUR NOTIFICATION ICON NAME with your actual icon file name in drawable folder.

🟩 7. Add FirebaseOptions

After completing Firebase setup, update theΒ Firebase configurationΒ as follows:

πŸ“ Path:
lib β†’ firebase_options.dart

✏️ Replace the values for both Android and iOS:

static const FirebaseOptions android = FirebaseOptions(
appId: "FIREBASE ANDROID APP ID",
apiKey: 'FIREBASE API KEY',

projectId: 'FIREBASE PROJECT ID',
messagingSenderId: 'FIREBASE SENDER ID',
storageBucket: 'FIREBASE STORAGE BUCKET',
);

static const FirebaseOptions ios = FirebaseOptions(
appId: "FIREBASE iOS APP ID",
apiKey: 'FIREBASE API KEY',

projectId: 'FIREBASE PROJECT ID',
messagingSenderId: 'FIREBASE SENDER ID',
storageBucket: 'FIREBASE STORAGE BUCKET',
iosBundleId: 'FIREBASE iOS',
);

πŸ“Œ How to get these values:

  • Open your Firebase Console.

For apiKey

KeyWhere to find
apiKeyprojectIdFirebase Console β†’ Project Settings β†’ General tab
  • Go to Project Settings and click on General tab you’ll find Web API Key and Project ID and paste it all blocks in dart file mentioned above.

For Android App ID and iOS App Id

KeyWhere to find
appIdFirebase Console β†’ General tab β†’ Your Apps section
iosBundleIdFirebase Console β†’ General tab β†’ Your iOS App section
  • Scroll Down and in Your Apps section you’ll find App Id in Android and iOS section. Copy respective App ID and paste it to appId.
    Copy Bundle ID and paste it to iosBundleId.

For messagingSenderId

KeyWhere to find
messagingSenderIdFirebase Console β†’ Cloud Messaging tab
  • Click on Cloud Messaging you will see Sender ID. Copy that paste it to messagingSenderId.

For storageBucket

KeyWhere to find
storageBucket
Navigate to android/app/google-services.json Under β€œproject_info” find β€œstorage_bucket” and copy value and paste it into storageBucket.

🟩 8. Assign Firebase Initialization

πŸ“ Path:
main.dart

✏️ Ensure this line exists in main() method:

verify DefaultFirebaseOptions is assigned to options.

 await Firebase.initializeApp(options: DefaultFirebaseOptions.currentPlatform);

– – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – –

βœ… After completing all these settings, your app will be properly customized when you run the project.