Alan Flutter Framework

Available on: Android iOS



The Alan Flutter plugin helps you to integrate your voice experience and Alan Studio script into your Flutter app.

Note

The alan_voice package version 3.0.0 supports null safety. If your app does not use null safety yet, upgrade the Dart version to 2.12 or higher or use a previous version of the alan_voice package.

Integrating with Alan

To integrate a Flutter app with Alan:

  1. In the pubspec.yaml file of your Flutter project, add the Alan voice dependency:

    /// pubspec.yaml file
...
dependencies:
  flutter:
    sdk: flutter
    ...

  alan_voice: 2.4.0

  2. Open the main.dart file and at the top of it, add the alan_voice package dependency:

    /// main.dart file
...
import 'package:alan_voice/alan_voice.dart';

  3. In the _MyHomePageState class, add the method for initializing the Alan button:

    /// main.dart file
...
class _MyHomePageState extends State<MyHomePage> {
...
  _MyHomePageState() {
    /// Initializing Alan with sample project id
    AlanVoice.addButton(
      "",
      buttonAlign: AlanVoice.BUTTON_ALIGN_LEFT);
 }
...

  4. In Alan Studio, go to Integrations, copy the value from the Alan SDK Key field and insert this value in the quotes.

    /// main.dart file
...
class _MyHomePageState extends State<MyHomePage> {
...
  _MyHomePageState() {
    /// Initializing Alan with sample project id
    AlanVoice.addButton(
      "314203787ccd9370974f1bf6b6929c1b2e956eca572e1d8b807a3e2338fdd0dc/prod",
      buttonAlign: AlanVoice.BUTTON_ALIGN_LEFT);
  }
...

That’s it. Now you can run the app, tap the Alan button and start interacting with Alan.

Listening to the Alan button states

When the user launches an app with the Alan button, Alan connects to the project in the Alan Cloud, and the Alan button transitions through several states:

  • CONNECTING: Alan is connecting to your voice assistant project in the Alan Cloud

  • ONLINE: a connection to the project is established

  • LISTEN: Alan is listening to the user input

  • PROCESS: Alan is processing the user input

  • REPLY: Alan is replying to the user

  • OFFLINE: no connection to the Internet; the connection to the Alan Studio project cannot be established

If you need to perform some activities in the app while the Alan button is in a specific state, you can add a handler that will be listening to the Alan button state changes. In the example below, once the Alan button state changes, the state name is logged to the console.

_MyHomePageState() {
  /// Initializing Alan with a sample project id
  AlanVoice.addButton(
    "a5a1c514d84c9c127d43485dbc3cb44a2e956eca572e1d8b807a3e2338fdd0dc/stage"
  );

  /// Listening to the Alan button state changes
  AlanVoice.eventCallbacks.add((event) {
    debugPrint("Got new event ${event.name} from Alan");
  });
}

Switching between logging levels

By default, Alan does not log its system events such as change of the Alan button state to the IDE console. If you want to see messages from Alan, switch to the all logging level:

AlanVoice.setLogLevel("all");

To disable logs, either remove the line above or switch to the none logging level:

AlanVoice.setLogLevel("none");

Troubleshooting

To troubleshoot problems you may have with your Flutter app, check the solutions below:

  • The minimum possible Android SDK version required by the Alan SDK is 21. If the version in your project is lower, you may encounter the following error: AndroidManifest.xml Error: uses-sdk:minSdkVersion 16 cannot be smaller than version 21 declared in library [:alan_voice]. Open the ./android/app/build.gradle file, under defaultConfig, locate minSdkVersion and change the version to 21.

  • Starting from version 3.0.0, the alan_voice package supports null safety. If you encounter the following error: Cannot run with sound null safety because dependencies don't support null safety, upgrade to the latest package version.

Trying Alan sample apps

In our GitHub repository, you can find sample Flutter apps already integrated with Alan. Download these apps to get an idea of how you can voice-enable your app and trigger activities in the app with voice commands.

  • Alan simple app: an example demonstrating how to integrate Alan with a Flutter app

  • Flutter Shrine app: a shopping app with a voice interface synchronized with the app visual elements

What’s next?

You can now proceed to building a voice interface with Alan. Use the following resources: