Flutter SDK Setup AppSync

To integrate AppsOnAir AppSync Flutter SDK to your Flutter Apps, follow the below steps

apiKey Setup

• Make sure to configure the API key properly. For additional information Getting started

Step 1. iOS Requirements and setup

1.1 Requirements​

• iOS deployment target: 12.0

• If CFBundleDisplayName is not added in your app then added in your app info.plist file.

info.plist

<key>CFBundleDisplayName</key>
<string>YourAppName</string>

Step 2. Android Requirements​ and setup

2.1 Requirements​

• JAVA 11 required

• An Android 7.0+ device or emulator.

• Project using AndroidX.

• compileSDKVersion set to 34 or higher.

• Targets API level 24 (NOUGAT) or higher

• Android Gradle Plugin (AGP): Version 8.0.2 or higher

• Gradle version 8.0 or higher

• Kotlin Version 1.7.10 or higher

• Uses Jetpack (AndroidX), which includes meeting these version requirements:

  • compileSdkVersion 34 or later

• Set up a physical device or use an emulator to run your app.

• Create or login to your AppsOnAir (AoA) Account

• Goto the your app details page -> App services tab -> API key tab to get your AoA services API Key

Newer versions of Android Studio

When creating a new project from Android Studio Artic Fox (or newer) the allprojects{...} is no longer added in the project level gradle.so need add in settings.gradle

gradle.properties

android.useAndroidX = true;
android.enableJetifier = true;

2.2 Setup

open your root setting.gradle file, add the following

• Add below code to setting.gradle.

setting.gradle

pluginManagement {
   ……
   repositories {
       google()
       mavenCentral()
       gradlePluginPortal()
       maven { url 'https://jitpack.io' }
   }
}

open your root build.gradle file, add the following

• Add below code to your root level build.gradle

build.gradle

allprojects {
   repositories {
       google()
       mavenCentral()
       maven { url 'https://jitpack.io' }
   }
}

Add required code

• Add meta-data to the app's AndroidManifest.xml file under the application tag.
  • Make sure meta-data name is “com.appsonair.icon”.
  • Provide your application logo in meta-data value.

AndroidManifest.xml

</application>
    ...
    <meta-data
            android:name="com.appsonair.icon"
            android:resource="@mipmap/ic_launcher" />
</application>

Create string.xml file in to android/app/resourse/value and add below code

string.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <string name="app_name"> YOUR_APP_NAME </string>
</resources>

Applicaton icon

Also make sure to add app icon into drawable as app_icon

Step 3. Add the AppSync Service in Flutter code and usage

3.1 Use of package

Dart

pubspec.yaml

 $ flutter pub add appsonair_flutter_appsync

3.2 Import it

Now in your Dart code, you can use:

Dart

Import

import "package:appsonair_flutter_appsync/app_sync_service.dart";

3.3 Call service into initState, with Default design

Dart

Package use

@override
void initState() {
    AppSyncService.sync(context);
    super.initState();
}

Initialization

Make sure that to call sync() method after MaterialApp!

for IOS

Don't forgot to install pods! (for iOS)

3.4 Call Service into initState with Custom Design

Dart

With custom ui

@override
void initState() {
   AppSyncService.sync(
     context,
     options: {'showNativeUI': false},
     customWidget: (response) {
       return Column(
         mainAxisSize: MainAxisSize.min,
         children: [
           Text("Application Name : ${response["appName"]}"),
           Text(
             "Application Version : ${response["updateData"]["buildNumber"]}",
           ),
           const SizedBox(height: 20),
           ElevatedButton(
             onPressed: () {},
             child: const Text('Update'),
           ),
         ],
       );
     },
   );
super.initState();
}

Properties Information

sync(BuildContext context,{Map<String, dynamic>? options,Widget? Function(Map<String, dynamic>)? customWidget})

• To display a custom alert for app updates, set options: {'showNativeUI': false} in the sync() method.
• Custom UI Requirements :
• Set options: {'showNativeUI': false} to disable native UI.
• Pass a customWidget parameter to define your custom alert widget.
• Failing to provide customWidget will result in an exception.

Step 4. Run your App and Setup your app update and/or its maintenance services

Run your app by using core editor on Android/IOS simulators or any physical device to make sure it builds correctly.

note

Note that to check the App Update and maintenance services are only configured from AppsOnAir portal.

For more details explore the example