Flutter Lara classifier

Welcome

Welcome to the Documentation of Flutter Lara Classifier - Mobile Application!
We are delighted that you have selected our Flutter-based mobile application, Flutter Lara Classifier.

This documentation is designed to provide you with an extensive guide on utilizing, personalizing, and deploying the Flutter Lara Classifier app on both Android and iOS platforms.

App User Guide

User Guide: How to Use Flutter Lara Listing app

Introduction

Welcome to [Flutter Lara app]!.
This user guide will walk you through the various features and functionalities of our app, ensuring you have a seamless and enjoyable experience while using it.
User Registration, Login, and Password Recovery
To get started, you need to create an account on [Flutter Lara app]. Here's how:
- Sign Up: Open the app and click on the "Sign Up" button.
  Enter your name, email, password, and any other required information.
  Once done, click "Sign Up" to create your account.
- Sign In: After signing up, use your registered email and password to log in to your account. Click on the "Sign In" button, enter your credentials, and click "Login."
- Forgot Password: In case you forget your password, don't worry! Click on the "Forgot Password" option on the login screen.
  Follow the instructions to reset your password securely.

Home Screen
The dynamic home screen provides a personalized experience.
It adapts based on your preferences, browsing history, and location.
Here's what you can find on the home screen:
- Featured Listings: Discover the best and latest listings highlighted for you.
- Popular Categories: Explore trending categories to find what you're looking for quickly.
- Recent Activities: Keep track of the latest updates and activities in the app.

Listing Detail
Get comprehensive information about a specific listing.
The listing detail page includes the listing's name, image, address, price, location, description, and any custom fields associated with the listing.

Around You
Explore listings in close proximity to your current location using geolocation services.
This feature focuses on local relevance to enhance your user experience.

All Categories
Browse through a comprehensive list of all categories available in the app.
Easily access the listings that interest you by selecting specific categories.

Add Listing
Want to sell or promote something? Use the "Add Listing" feature to create and publish new listings.
Follow the step-by-step process to enter listing details, upload images, and provide accurate information to attract potential buyers.

Messages
Keep track of all your message history with other app users. Enjoy real-time message synchronization for seamless communication.

Chat
Engage in real-time conversations with other users.
Exchange messages, negotiate deals, and discuss listing details conveniently within the app.

Search
Use the search engine feature to quickly find specific listings or items by entering relevant keywords.
The efficient search algorithms ensure accurate results based on your input.

Filter
Refine your search results based on specific criteria using the filter functionality.
Narrow down listings by category, city, price range, and custom fields for the most relevant results.

Choose Package
Explore subscription packages or pricing options for specific categories.
Choose a package that suits your requirements to maximize visibility within the app.

Favorite
Save and manage your favorite listings for future reference or quick access.
This feature enhances user engagement and provides a convenient way to keep track of preferred listings.

My Listings
View an overview of all the listings you've uploaded to the platform. Easily manage your listings, edit details, update images, or remove listings if necessary.

Sign In
Log in to your account using your registered email and password to access personalized features and interact with other app user

Sign Up
New users can create an account by registering their personal information, including name, email, password, and any additional required information.

Forgot Password
If you forget your password, use the "Forgot Password" functionality to reset it securely and regain access to your account.

Change Password
Change your account password periodically or in case of security concerns. Use the "Change Password" feature to do so securely.

Profile
View and update your account information, including personal details, uploaded listings, and any additional information you've provided.

Verify Phone
Verify your phone number to enable listing uploads.
This adds an extra layer of security and helps prevent spam or misuse of the app.

Builder Desktop App
Use the "Builder Desktop App" to customize the app's home layout and configure various settings.
Personalize the app's appearance and functionality to suit your preferences.
Congratulations! You now have a comprehensive guide on how to use [Flutter Lara app].
Enjoy exploring, buying, and selling within the app. Should you have any questions or concerns, feel free to reach out to our support team for assistance.
Happy using!

Preview features and screens

Flutter laraclassifier App

Try the app here:

App Setup
Next Setup - Set purchase code

App Setup

Set purchase code

after you buy the template you can find your purchase code from https://laralisting.amk4soft.com/ when you login with your account
open file configs/env.props and set purchase_code with you purchase code to be able to run the app
for example if your purchase code is abfe544-gwwvww-evvsdvds-vdvsds your configs/env.props file must be like


purchase_code=abfe544-gwwvww-evvsdvds-vdvsds
servalUrl=ENTER_YOUR_SERVER_URL_HERE
appName=ENTER_YOUR_APP_NAME_HERE
iosBundleId=ENTER_YOUR_IOS_BUNDLE_ID_HERE
androidPackageName=ENTER_YOUR_ANDROID_PACKAGE_NAME_HERE
googleApiKeyAndroid=ENTER_YOUR_GOOGLE_Api_KEY_HERE
keyAlias=ENTER_YOUR_Key_Alias_HERE
storeFile=ENTER_YOUR_STORE_FILE_NAME_HERE
storePassword=ENTER_YOUR_STORE_PASSWORD_HERE
keyPassword=ENTER_YOUR_Key_PASSWORD_HERE

App Setup

App bundle id and package name

open file configs/env.props
set androidPackageName with you package name
set iosBundleId with you ios bundle id
for example if your androidPackageName is com.lara.laraclassify and you ios bundle id is com.lara.laraclassify your configs/env.props file must be like


purchase_code=abfe544-gwwvww-evvsdvds-vdvsds
servalUrl=ENTER_YOUR_SERVER_URL_HERE
appName=ENTER_YOUR_APP_NAME_HERE
iosBundleId= com.lara.laraclassify
androidPackageName= com.lara.laraclassify
googleApiKeyAndroid=ENTER_YOUR_GOOGLE_Api_KEY_HERE
keyAlias=ENTER_YOUR_Key_Alias_HERE
storeFile=ENTER_YOUR_STORE_FILE_NAME_HERE
storePassword=ENTER_YOUR_STORE_PASSWORD_HERE
keyPassword=ENTER_YOUR_Key_PASSWORD_HERE

App Setup

Set Server Configuration

open file configs/env.props
set servalUrl with your lara classifier website url
set laraApiToken with your lara classifier website APP_API_TOKEN you can find it in .env file of your lara laravel
set countryCode with your app countryCode

Note:you can find countryCode from this link : your_lara_website_url/admin/countries

for example if you laraApiToken is https://laraclassified.amk4soft.com and your laraApiToken is "Uk8wYllEVGRvbWc0S2pld1FjMU5Ra3R6RWVXbFRWUDE" your configs/env.props file must be like


purchase_code= abfe544-gwwvww-evvsdvds-vdvsds
servalUrl=https://laraclassified.amk4soft.com
laraApiToken=Uk8wYllEVGRvbWc0S2pld1FjMU5Ra3R6RWVXbFRWUDE
countryCode=EG
appName=ENTER_YOUR_APP_NAME_HERE
iosBundleId= com.lara.laraclassify
androidPackageName= com.lara.laraclassify
googleMapApiKey=ENTER_YOUR_GOOGLE_MAP_Api_KEY_HERE
appStoreId=ENTER_YOUR_APP_STORE_ID_HERE
dynamicLinkUriPrefix=ENTER_YOUR_DYNAMIC_LINK_URI_PREFIX_HERE
keyAlias=ENTER_YOUR_Key_Alias_HERE
storeFile=ENTER_YOUR_STORE_FILE_NAME_HERE
storePassword=ENTER_YOUR_STORE_PASSWORD_HERE
keyPassword=ENTER_YOUR_Key_PASSWORD_HERE

App Setup

Set store key

create your store key for to be able to upload your app to store using the following command keytool -genkey -v -keystore ~/larakeystore.jks -keyalg RSA -keysize 2048 -validity 10000 -alias larakeystore
after create your keystore you must copy genereated file larakeystore.jks to configs folder which inside the app folder
open file configs/env.props
set the values of keyAlias,storeFile,storePassword ,keyPassword and this depend on the info you added when creating your keystore
this is example of configs/env.props after set keyAlias,storeFile,storePassword ,keyPassword vlaues


purchase_code=abfe544-gwwvww-evvsdvds-vdvsds
servalUrl=https://laraclassified.amk4soft.com
laraApiToken=Uk8wYllEVGRvbWc0S2pld1FjMU5Ra3R6RWVXbFRWUDE
appName=ENTER_YOUR_APP_NAME_HERE
iosBundleId= com.lara.laraclassify
androidPackageName= com.lara.laraclassify
googleMapApiKey=ENTER_YOUR_GOOGLE_MAP_Api_KEY_HERE
countryCode=ENTER_YOUR_COUNTRY_Code_HERE
appStoreId=ENTER_YOUR_APP_STORE_ID_HERE
dynamicLinkUriPrefix=ENTER_YOUR_DYNAMIC_LINK_URI_PREFIX_HERE
keyAlias=larakeystore
storeFile=larakeystore.jks
storePassword=123456789
keyPassword=123456789

App Setup

Setup firebase

create your firebase proejct from this link : https://console.firebase.google.com/"
create android app and ios app in this firebase prject

Note : to ceate android app in firbase add SHA-1 and you can get your

Note : you can get your SHA-1 by the following commands

cd Android
./gradlew :app:signingReport

download google-services.json file and GoogleService-Info.plist and place these files in configs folder

App Setup

Enable firestore

open firebase console using the follwing link
https://console.firebase.google.com
Open your firebase project
Go to Build->Firestore Database and enable Firestore

App Setup

Setup dynamic link

open firebase console using the follwing link https://console.firebase.google.com
open your firebase proejct
go Engage->Dynamic Links and enable Dynamic link
after enable Dynamic Links set dynamicLinkUriPrefix and appStoreId on configs/env.props file

Note: you can find your appStoreId in your apple developer account

here is example of configs/env.props file after adding dynamicLinkUriPrefix , appStoreId values


purchase_code=abfe544-gwwvww-evvsdvds-vdvsds
servalUrl=https://laraclassified.amk4soft.com
laraApiToken=Uk8wYllEVGRvbWc0S2pld1FjMU5Ra3R6RWVXbFRWUDE
appName=ENTER_YOUR_APP_NAME_HERE
iosBundleId= com.lara.laraclassify
androidPackageName= com.lara.laraclassify
googleMapApiKey=ENTER_YOUR_GOOGLE_MAP_Api_KEY_HERE
countryCode=ENTER_YOUR_COUNTRY_Code_HERE
appStoreId=123456789
dynamicLinkUriPrefix=https://araclassify.page.link
keyAlias=larakeystore
storeFile=larakeystore.jks
storePassword=123456789
keyPassword=123456789

App Setup

Setup Maps API key

Once you have setup the project on Google Cloud, you need to acquire the Key
open ios/Runner/AppDelegate.swift file and setand set api key as the following


import UIKit
import Flutter
import Foundation

import GoogleMaps
@UIApplicationMain
@objc class AppDelegate: FlutterAppDelegate {
  override func application(
    _ application: UIApplication,
    didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?
  ) -> Bool {
     GMSServices.provideAPIKey("Cgeff434vdvevw3443veevbvdvd")
    GeneratedPluginRegistrant.register(with: self)
    return super.application(application, didFinishLaunchingWithOptions: launchOptions)
  }
}

open file configs/env.props
set the value of googleMapApiKey
here is example of configs/env.props after set googleMapApiKey value


purchase_code=abfe544-gwwvww-evvsdvds-vdvsds
servalUrl=https://laraclassified.amk4soft.com
laraApiToken=Uk8wYllEVGRvbWc0S2pld1FjMU5Ra3R6RWVXbFRWUDE
appName=ENTER_YOUR_APP_NAME_HERE
iosBundleId= com.lara.laraclassify
androidPackageName= com.lara.laraclassify
googleMapApiKey=Cgeff434vdvevw3443veevbvdvd
countryCode=ENTER_YOUR_COUNTRY_Code_HERE
appStoreId= 123456789
dynamicLinkUriPrefix=https://araclassify.page.link
keyAlias=larakeystore
storeFile=larakeystore.jks
storePassword=123456789
keyPassword=123456789

The next Desktop app builder
Introduction to desktop builder

Desktop app builder

Introduction to desktop builder

It is a desktop app that can run in windows and macOS and gives you the ability to do the following:

Manage home layout

Manage app colors

Manage the required files of the app like
google-services.json GoogleService-Info.plist

Manage app configuration

The Previous App Setup
Setup Maps API key

Desktop app builder

setup app using builder

Desktop app builder

Manage Home layout using builder

Desktop app builder

Manage app colors using builder

in the follwing image you can see tha you can maange you app colors scheme from desktop app builder

Next Configuration
App name

Configuration

App name

open file lib/appConfig.dart
set your appName variable value

Configuration

App icon

open file lib/appConfig.dart
set your appIcon variable value

Configuration

Home layout

open file /layout.json as the following example


{
  "homeLayout": [
    {
      "type": "HomeSlider",
      "horizontal": true,
      "cardType": "SimpleCard",
      "id": null
    },
    {
      "type": "LatestListingsBlock",
      "horizontal": true,
      "cardType": "LargeListingCard",
      "id": null
    },
    {
      "type": "SponseredListingsBlock",
      "horizontal": true,
      "cardType": "MultiImageListingCard",
      "id": null
    },
    {
      "type": "HomeCategoriesComponent",
      "horizontal": true,
      "cardType": "SimpleCard",
      "id": null
    },
    {
      "type": "CtegoryListingsBlock",
      "horizontal": true,
      "cardType": "SimpleCard",
      "id": 2
    },
    {
      "type": "CtegoryListingsBlock",
      "horizontal": false,
      "cardType": "WideCard",
      "id": 1
    },
    {
      "type": "HomeSlider",
      "horizontal": true,
      "cardType": "SimpleCard",
      "id": null
    }
  ]
}


     using this file you can set the layout of your home screen using list of component 
        each component have the following attributes :
            1-type : will be one of the following components types 
                #HomeSlider : will represent slider of list of images
                #LatestListingsBlock : will represent list of latest listings
                #SponseredListingsBlock :  will represent list of Sponsered listings
                #CtegoryListingsBlock: will represent list of listings related to specific category
            2-horizontal: if true then the items in this components will be in horizontal view , if false it will be in vertical view
            3-cardType : will be one of the following cards
                #SimpleCard
                #WideCard
                #MultiImageListingCard
            4-id : will be the id of category if the type is CtegoryListingsBlock

Configuration

App colors

This is the content of Create Android store key

open file /lib/core/colors.dart and set your colors scheme for dark and light mode as the following example


class ColorManager{
    //app primary color
    static Color lightPrimColor= const Color(0xff305bc2);
    //color of icons and text which will be in container with primary color
    static Color lightOnPrimColor= const Color(0xffe7e7e7);
    //app secondary color
    static Color lightSecColor=const Color(0xff305bc2);
    //color of icons and text which will be in container with secondary color
    static Color lightOnSecColor=const Color(0xff305bc2);
    //color of screens background
    static Color lightBackgroundColor=const Color(0xfff7f8fd);
    //colors of card and containers in app
    static Color lightSurfaceColor=Colors.white;
    //color of icons and text which will be in container with Surface color
    static Color lightOnSurfaceColor=Colors.white;
    //color of hint in app
    static Color lightHintColor=const Color(0xff646464);
    //color of error in app
    static Color lightErrorColor=Colors.red;
    //color of icons and text which will be in container with error color
    static Color lightOnErrorColor=Colors.red;
    //color of text in app
    static Color lightTextColor=Colors.black;
    //color of textFields in app
    static Color lightInputBackGroundColor=Colors.white;




    //app primary color
    static Color darkPrimColor=const Color(0xff305bc2);
    //color of icons and text which will be in container with primary color
    static Color darkOnPrimColor= Colors.white;
    //app secondary color
    static Color darkSecColor=const Color(0xff305bc2);
    //color of icons and text which will be in container with secondary color
    static Color darkOnSecColor=const Color(0xff305bc2);
    //color of screens background
    static Color darkBackgroundColor=const Color(0xff06041f);
    //colors of card and containers in app
    static Color darkSurfaceColor=const Color(0xff24223a);
    //color of icons and text which will be in container with Surface color
    static Color darkOnSurfaceColor=const Color(0xff24223a);
    //color of hint in app
    static Color darkHintColor=const Color(0xff646464);
    //color of error in app
    static Color darkErrorColor=Colors.red;
    //color of icons and text which will be in container with error color
    static Color darkOnErrorColor=Colors.red;
    //color of text in app
    static Color darkTextColor=Colors.white;
    //color of textFields in app
    static Color darkInputBackGroundColor=const Color(0xff191f2a);



}

Configuration

Home slider images

This is the content of Home slider images

open file lib/appConfig.dart
sliderImages contains list of Home Screen slider images path


class Config {
  static String appName = "Classified Ads";
  static String appIcon = "assets/images/logo.png";
  static bool enableAroundYouScreen = true;
  static bool enableAddListingLocation = true;
  static List sliderImages = [
    'assets/images/slider1.jpg',
    'assets/images/slider2.jpg',
    'assets/images/slider3.jpeg',
    'assets/images/slider4.jpg'
  ];
  static List> customSideBarScreens = [
    {
      "title": "sideparsScreen1",
      "type": "webview",
      "content": "https://flutter.dev/"
    },
    {
      "title": "sideparsScreen2",
      "type": "text",
      "content":
          "this is example text of CustomesideBarScreen with text type this is example text of CustomesideBarScreen with text type this is example text of CustomesideBarScreen with text type"
    }
  ];
}

you can add or delete image as you want

Configuration

Sidebar custom screens

This is the content of Sidebar custom screens

open file lib/appConfig.dart
CustomesideBarScreens contains list of Custom side Bar Screens each one Can be of type webview or text
if type is webview then the content will be the link of this webview
if type is text then the content will be the content text of this screen
in the next code you will find two Custom side Bar Screens in the list the first one in webview type and the second in text


class Config{
  static String appName="Classified Ads";
  static String appIcon="assets/images/logo.png";
  static bool enableAroundYouScreen=true;
  static bool enableAddListingLocation=true;
  static ListsliderImages=[
       'assets/images/slider1.jpg',
       'assets/images/slider2.jpg',
       'assets/images/slider3.jpeg',
       'assets/images/slider4.jpg'
     ];
     static List> CustomesideBarScreens=[
    {
      "title":"sideparsScreen1",
      "type":"webview",
      "content":"https://flutter.dev/"
    },
    {
      "title":"sideparsScreen2",
      "type":"text",
      "content":"this is example text of CustomesideBarScreen with text type this is example text of 	  CustomesideBarScreen with text type this is example text of CustomesideBarScreen with text type"
    }
  ];
    
}

you can add any type or remove from this list as you want and this will reflect on app sidebar

Configuration

Enable around you screen

This is the content of Enable around you screen

open file lib/appConfig.dart
enableAroundYouScreen value determine if the around you icon in Home Screen will appear or not


class Config{
  static String appName="Classified Ads";
  static String appIcon="assets/images/logo.png";
   static bool enableAroundYouScreen=true;
  static bool enableAddListingLocation=true;
  static List sliderImages=[
       'assets/images/slider1.jpg',
       'assets/images/slider2.jpg',
       'assets/images/slider3.jpeg',
       'assets/images/slider4.jpg'
     ];
  static List CustomesideBarScreens=[
    {
      "title":"sideparsScreen1",
      "type":"webview",
      "content":"https://flutter.dev/"
    },
    {
      "title":"sideparsScreen2",
      "type":"text",
      "content":"this is example text of CustomesideBarScreen with text type this is example text of 	  CustomesideBarScreen with text type this is example text of CustomesideBarScreen with text type"
    }
  ];
}

Configuration

Enable Add Listing Location

This is the content of Enable Add Listing Location

open file lib/appConfig.dart
enableAddListingLocation value determine if you will add the location of on map while create new listing or not


class Config{
  static String appName="Classified Ads";
  static String appIcon="assets/images/logo.png";
  static bool enableAroundYouScreen=true;

  static bool enableAddListingLocation=true;

  static ListsliderImages=[
       'assets/images/slider1.jpg',
       'assets/images/slider2.jpg',
       'assets/images/slider3.jpeg',
       'assets/images/slider4.jpg'
     ];
  static List> CustomesideBarScreens=[
    {
      "title":"sideparsScreen1",
      "type":"webview",
      "content":"https://flutter.dev/"
    },
    {
      "title":"sideparsScreen2",
      "type":"text",
      "content":"this is example text of CustomesideBarScreen with text type this is example text of 	  CustomesideBarScreen with text type this is example text of CustomesideBarScreen with text type"
    }
  ];
}

Support

Send Email: support@amk4soft.com

Send Email

Flutter Lara Classifier

Flutter Lara Classifier

Flutter Lara classifier

Welcome

Table of Contents

App Setup

Desktop app builder

App Configuration

Support

Try the app here:

App User Guide

User Guide: How to Use Flutter Lara Listing app

Table of Contents

App Setup

Introduction

User Registration, Login, and Password Recovery

Home Screen

Listing Detail

Around You

All Categories

Add Listing

Messages

Chat

Search

Filter

Choose Package

Favorite

My Listings

Sign In

Sign Up

Forgot Password

Change Password

Profile

Verify Phone

Builder Desktop App

Try the app here:

App Setup

Set purchase code

App Setup

App bundle id and package name

App Setup

Set Server Configuration

App Setup

Set store key

App Setup

Setup firebase

App Setup

Enable firestore

App Setup

Setup dynamic link

App Setup

Setup Maps API key

Desktop app builder

Introduction to desktop builder

Desktop app builder

setup app using builder

Desktop app builder

Manage Home layout using builder

Desktop app builder

Manage app colors using builder

Configuration

App name

Configuration

App icon

Configuration

Home layout

Configuration

App colors

Configuration

Home slider images

Configuration

Sidebar custom screens

Configuration

Enable around you screen

Configuration

Enable Add Listing Location

Support

Support