Getting started with actions in your FlutterFlow project

Introduction

You have a FlutterFlow app, but there’s one problem: you haven’t yet implemented any actions, and you’re not sure where to start. Don’t worry, we’ve got you covered! In this beginner-friendly guide, we’ll walk you through the essential actions that every app needs. Actions can get really complex and project-specific, but there are also some basic actions that are necessary for every single app.

Why these actions?

Well, every production-grade app relies on a variety of actions to perform tasks and respond to user interactions. The actions we will talk about here are pretty much used in every single project. Why waste time searching for them or creating them one by one when you can just get all of them here in one place. To help you kickstart your project, we’ve created a free FlutterFlow marketplace item that includes five essential actions we use in every single project. Get it here. Having these actions implemented from the get-go will save you time and effort, allowing you to focus on the unique aspects of your app.

Our top 3 must-have actions

Let’s dive into some of the key actions included in our FF marketplace item and explain how they work.

1. checkInternetConnection

Ensuring that your app can detect internet connectivity is crucial for providing a smooth user experience. This action checks whether the app is connected to the internet and returns “true” if the user has internet connectivity, and “false” otherwise.

Future<bool> checkInternetConnection() async {
  bool result = await InternetConnection().hasInternetAccess;
  return result;
}

This function uses the InternetConnectionCheckerPlus package to determine if the device has an active internet connection. It returns true if connected and false if not, allowing your app to handle connectivity issues gracefully.

2. inAppReview

Encouraging users to leave reviews can boost your app’s visibility and credibility. This action triggers the in-app review process.

Future inAppReview() async {
  final InAppReview inAppReview = InAppReview.instance;
  if (await inAppReview.isAvailable()) {
    inAppReview.requestReview();
  }
}

This function uses the InAppReview package to check if the in-app review feature is available on the user’s device. If it is, it prompts the user to leave a review, helping you gather valuable feedback and improve your app’s ratings.

3. openUrlInSameTab (webapps)

Sometimes, you need to open a URL in the same browser tab. This action makes it easy to do just that. Note: this is only functional on web apps.

Future openUrlInSameTab(String url) async {
  html.window.location.href = url;
}

This function changes the current browser window’s location to the specifiedURL, effectively opening the URL in the same tab. This is particularly useful for web apps built with FlutterFlow.

Additional actions included in our free marketplace item

• lockOrientation: ensure your app is viewed in the correct orientation by locking it to portrait or landscape mode.
• customToast (web apps): show custom toast notifications in your web apps for user feedback.

Conclusion

Actions are necessary for a production-grade app. Start with these 5 to improve user experience and skip the hurdle of having to create them yourself. Whether you’re checking internet connectivity, prompting for in-app reviews, or opening URLs, these actions will help with your development process and save you time.

Our “Essential actions pack”

Use our free actions package from the FlutterFlow marketplace to not have to integrate these yourself. Find it here. This package includes all of these 5 actions already so you can start using them as soon as possible.