Scribd
Upload
87 views20 pages

Delivery Boy

Uploaded by

Rucki Deen
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
87 views20 pages

Delivery Boy

Uploaded by

Rucki Deen
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 20

Documentation

Name:Active Ecommerce Delivery App


Author : Active IT zone
Software Framework : Flutter
Addon For: Active eCommerce CMS
Provided by : codecanyon
2020 © All Rights Reserved @ ACTIVE IT ZONE
Documentation

1. What are the prerequisites?


2. How to run Flutter Application in Android Studio?
3. How to configure the App according to your setup?
4. How to change the package name?
5. How to build the App for testing (build and apk) ?
6. How to generate play store uploadable files for release?
7. How to generate app store uploadable files?
8. How to Update for Android?
9. How to configure the default language for mobile apps?
10. How to configure google maps?
1. What are the prerequisites?

This Flutter app can be hosted into Google Play Store + Apple Appstore as your branded
eCommerce CMS app. The app will communicate with your hosted eCommerce CMS
web application through APIs. That means the prerequisite to publish the eCommerce
Mobile application is to have the eCommerce CMS Web application in the latest version
always.

a. Flutter version must be : Flutter 3.10.04 • channel stable

b. Android Studio Flamingo | 2022.2.1 Patch 1

https://developer.android.com/studio/archive

c. Java version OpenJDK Runtime Environment (build

17.0.6+0-b2043.56-9586694)

d. Make sure your flutter and dart versions are correct. Follow the flutter
documentation from https://flutter.dev/docs/get-started/install to install the given

version of flutter in your pc/mac.

2. How to run Android Application in Android Studio?

- Install Android Studio from https://developer.android.com/studio


- Extract the scource_code.zip. You will find this inside the flutter.zip.
- Open the folder in your android studio.
- Even if you are building an app for ios, use android studio for the build.
- Then in your android studio terminal run:
flutter pub get ** You need this to get all 3rd party packages from pub.dev
3. How to configure the App according to your setup?
1. App Config:
This helps you connect your app to your server.
Open lib/app_config.dart
You can change the copyright_text, app_name, HTTPS,DOMAIN_PATH variable.
Do not change the other variables.
If your site does not have https or your are using a local machine as server (localhost)
the make HTTPS = false;
Your DOMAIN_PATH is your site url without any protocol. (see screenshot below)
If you are using localhost , DOMAIN_PATH should be “your_ip_address/your_project”;
** “localhost/your_project” will not not work **
Normally you do not have to change the BASE_PATH. Keep it as given.
But if you are using s3 for image uploading your BASE_PATH should be :
BASE_PATH = "https://[[bucketname]].s3.[[regeion]].amazonaws.com/";
2. Theme Config:
This helps you change your app’s colors according to your theme/branding
Open lib/my_theme.dart
You can change the accent_color, soft_accent_color, splash_screen_color variable.
Flutter by default does not support hex color. Do not change the other variables.
Use https://www.rapidtables.com/convert/color/hex-to-rgb.html To get the RGB value if
you do not already know your theme’s RGB color.
You should keep the Opacity value 1 (Opacity can be 0, 0.1, 0.2, …….. ,0.9 ,1)
See the screenshot below.

3. Configure the launcher icon:


This helps you change your app’s launcher icon.
Change the app_logo.png in assets folder with your own
logo.Your file name should also be app_logo.png and it
should be a 512x512 png image and the image format
should be the same.
After replacing the file , uninstall your app from your emulator.Otherwise the logo will not
be changed.

Then in your android studio terminal run:


flutter pub get
Then run :
flutter pub run flutter_launcher_icons:main
Then run your app (shift +10). The app will be installed again with your given launcher
icon.

**The logo used in various screens inside the app is delivery_app_long.png you can
change it with your own logo or keep as it is.Remember the file name, dimension and
image format should be the same

4. How to change the package name ?

This is very important. Your app cannot have the same package name as other app. If it does,
the playstore will not accept it as an unique application. So rename your app according to your
business/brand name.Try to write an unique package name.
Naming convention : https://docs.oracle.com/javase/tutorial/java/package/namingpkgs.html

For example
Let’s say your package is : com.onatcipli.networkUpp
And your app name is "Network Upp"
Then ,
Run this command inside your flutter project root.
Run the command in android studio terminal :

flutter pub run rename --bundleId com.onatcipli.networkUpp


flutter pub run rename --appname "Network Upp"
Try uninstalling the app from the emulator , then run the commands and then restart the app.
If it does not work, first uninstall, then restart the app then run the commands.

**In case the above do not work:

In Android
for package name just change in build build.gradle only (anddroid/app/build.gradle)

defaultConfig {
applicationId "bundleId com.onatcipli.networkUpp"
………….
}

For iOS

Change the bundle identifier from your Info.plist file inside your ios/Runner directory.

<key>CFBundleIdentifier</key>
<string>bundleId com.onatcipli.networkUpp</string>

If you face issues consult a flutter developer.

5. How to Build the app for testing (build an apk) ?


https://flutter.dev/docs/deployment/android see the doc for reference
In terminal run : flutter build apk
It will build an apk and show the folder. You can then install it in your phone to test, or share to
multiple users for testing .

6. How to generate play store uploadable files for release?


https://flutter.dev/docs/deployment/android see the doc for reference

Signing the app:


To publish on the Play Store, you need to give your app a digital signature. Use the following
instructions to sign your app.

Go through the screenshots below carefully to understand how to generate key and and use it
for the released signed app:
Find binary path

Then generate and store the key (image on next page)


Then copy the key.jks from the root folder and paste it in the android/app folder
** If you lose the jks file , you will not be able to release a new update your app in
playstore**

Create new file key.properties in android folder . Enter the information


Read this
in app/build.gradle do necessary changes

Note: You may need to run flutter clean after changing the gradle file. This prevents cached
builds from affecting the signing process.

Now you are almost done


In your terminal run : flutter build appbundle

The release bundle for your app is created at <your app


dir>/build/app/outputs/bundle/release/app.aab.
Upload this app.aab file to your google play console
7. How to generate app store uploadable files?
Archive and upload your app using Xcode
● Before you can submit your app for review through App Store Connect, you
need to upload the build through Xcode.
● In Xcode, select Generic iOS Device as the deployment target.
● Choose Product from the top menu and click on Archive.
● The Xcode Organizer will launch, displaying any archives you’ve created.
● Make sure the current build is selected and click on Upload to App Store in the
right-hand panel.
● Select your credentials and click Choose.
● In the next window that appears, click on Upload in the bottom right-hand
corner.

A success message will appear when the upload has been completed. Click Done.

8. How to update for android? **Read all the points carefully before doing anything
- This section will help you if you are here for the update and have already generated the
signed release apk/appbundle the last time and already have the keytool and the
manifest file ready in your old project folder.
- If you are installing and building the release file for the first time this section is not for
you.

- Extract the scource_code.zip. You will find this inside the main zip.
- Open the folder in your android studio.
- **Remember to open this in a separate folder than your old project.
- Even if you are building an app for ios, use android studio for the build.
- Then in your android studio terminal run:
flutter pub get
- This will fetch all the necessary packages
- If you are updating, you must have build the key.jks previously
- Copy the key.jks , key.properties, and the manifest file from your old project and paste in
the correct locations
- See the previous screenshots for the file locations
- If you are missing your old project, you have to configure key.properties, and the
manifest file like described in the installation.
- As our source code is made ready for the fresh installation , you will have to do all your
configuration (like domain path, app color, package name etc ) shown in the previous
steps.
- But do not create a new key.jks, you have to update your app with the existing key
- If you have somehow lost your previous key , you have to release a totally new app to the
play store.You will not be able to release an update.

- In your terminal run : flutter build appbundle


- The release bundle for your app is created at <your app
dir>/build/app/outputs/bundle/release/app.aab.
- Upload this app.aab file to your google play console

9. How to configure google map? (Read the whole thing before implementing)

Go to your flutter project->lib->app_config.dart


static String default_language ="en";

static String mobile_app_code ="en";


static bool app_language_rtl =false;
This value you can find in your admin panel. Go to your admin panel->setup &
configurations->languages.

10. How to configure google maps? (Read the whole thing before implementing)

1. Go to https://console.developers.google.com/ and generate api keys separately for ios and


android. No restrictions are needed
1. In lib/other_config.dart make, use google map = true

2. In main AndroidManifest.xml put the map api key


3.For ios follow this
https://blog.logrocket.com/adding-google-maps-to-a-flutter-app/#addinggooglemapstoflutterio
s
4. Enable android and ios api. These are free.
5. If you need to style the map then go to here https://mapstyle.withgoogle.com/
Generate style according to your needs.

Copy the generated json and replace the copied code in assets/map_style.json
In console run:
flutter clean
flutter pub get

You might also like