How to Add Google Analytics in Flutter App

Got a Flutter app and want to understand what your users are actually doing inside it? The key is setting up reliable analytics. This tutorial shows you precisely how to integrate Google Analytics into your Flutter application, step-by-step. You'll learn how to configure your project, track screen views, and log custom events to get a complete picture of user engagement.

Graphed

Build AI Agents for Marketing

Build virtual employees that run your go to market. Connect your data sources, deploy autonomous agents, and grow your company.

Build Your First Agent

Why Track App Analytics in the First Place?

Before an app is launched, most of its features are based on assumptions. Analytics turns those assumptions into facts. By tracking how people use your app, you can answer critical business questions like:

• Which features are most popular? Find out where users spend their time so you can double down on what works.
• Where are users getting stuck or dropping off? Identify friction points in your onboarding or checkout funnels to improve conversion rates.
• How effective are your new updates? Measure the adoption of a new feature after a release.
• Who are your most engaged users? Understand the behavior of your power users so you can find more people like them.

Without data, you're flying blind. With an analytics tool like Google Analytics, you can make informed decisions that drive growth and improve the user experience.

Step 1: Set Up for Google Analytics 4 and Firebase

Modern Google Analytics integrates directly with Google's mobile development platform, Firebase. So, our first step is to create both a Firebase project and a GA4 property, which will be automatically linked.

Create a Firebase Project

If you don’t have a Firebase project for your app yet, this is the place to start. It’s a straightforward process:

1. Navigate to the Firebase console and sign in with your Google account.
2. Click "Add project."
3. Give your project a descriptive name, like "My Awesome App."
4. You'll be prompted to enable Google Analytics for this project. Make sure this is turned on! This is the step that automatically creates and links your GA4 property.
5. Choose or create a Google Analytics account to associate with the project.
6. Click "Create project" and wait a minute for Firebase to get everything ready.

Register Your App with Firebase

Now that you have a project, you need to tell Firebase about your specific iOS and Android apps.

On the Firebase project overview page, click the platform ICONS (+ Add app) and register both iOS and Android:

For Android:

• Click the Android icon.
• Find your Android package name. It's located in your Flutter project's android/app/build.gradle file, under applicationId. It usually looks something like com.yourcompany.yourapp.
• Add an App nickname (optional).
• Click "Register app."
• Follow the prompt to download the google-services.json file. Place this file inside the android/app directory of your Flutter project.
• Skip the rest of the steps for now, as the FlutterFire CLI will handle them for us.

For iOS:

• Back in the Firebase console, click "+ Add app" again and select the iOS icon.
• Find your iOS Bundle ID. You can find this by opening your Flutter project in Xcode, navigating to Runner > General > Identity. It will also look like com.yourcompany.yourapp.
• Add an "App nickname" (optional).
• Click “Register App.”
• Follow the prompt to download the GoogleService-Info.plist file. We'll use this file in the next step.
• Skip the rest of the steps shown in the Firebase console.

With our project and configuration files ready, we can now connect our Flutter app.

Step 2: Add Firebase Analytics to Your Flutter App

The Flutter team has made integrating Firebase easier than ever with the FlutterFire CLI. This command-line tool handles the messy native configuration steps for you.

AI Agents for Marketing

Crash Course

Graphed

Free PDF · the crash course

AI Agents for Marketing Crash Course

Learn how to deploy AI marketing agents across your go-to-market — the best tools, prompts, and workflows to turn your data into autonomous execution without writing code.

Download the PDF

Install and Run the FlutterFire CLI

First, install the CLI from your terminal if you haven't already:

dart pub global activate flutterfire_cli

Next, log into Firebase:

firebase login

Now, from the root directory of your Flutter project, run the configure command:

flutterfire configure

This brilliant command will:

• Detect the Firebase project you created.
• Find the iOS and Android apps you registered.
• Automatically download your GoogleService-Info.plist and google-services.json files and place them in the correct locations. (It handles everything!)
• Add the necessary native code modifications to get iOS and Android talking to Firebase.

Add the Analytics Package

With Firebase configured, you can add the actual analytics library to your Flutter app. In your terminal, run:

flutter pub add firebase_analytics

This will add firebase_analytics to your pubspec.yaml dependencies. Now all you need to do is initialize it.

Initialize Firebase in Your App

Open your main.dart file. You need to initialize Firebase before your app runs. The code will look like this:

import 'package:flutter/material.dart',
import 'package:firebase_core/firebase_core.dart',
import 'package:firebase_analytics/firebase_analytics.dart',
import 'firebase_options.dart', // This file was generated by FlutterFire CLI

void main() async {
  WidgetsFlutterBinding.ensureInitialized(),
  await Firebase.initializeApp(
    options: DefaultFirebaseOptions.currentPlatform,
  ),
  runApp(const MyApp()),
}

class MyApp extends StatelessWidget {
  // Good practice to have an analytics instance available
  static FirebaseAnalytics analytics = FirebaseAnalytics.instance,
  static FirebaseAnalyticsObserver observer = FirebaseAnalyticsObserver(analytics: analytics),

  const MyApp({Key? key}) : super(key: key),

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Analytics Demo',
      theme: ThemeData(primarySwatch: Colors.blue),
      // To automatically track screen changes in routes
      navigatorObservers: [observer], 
      home: const MyHomePage(),
    ),
  }
}

And that’s it for setup! Firebase Analytics is now technically active in your app, ready to collect default events like user sessions and demographic data.

Step 3: Tracking Custom Events and Screen Views

The real power of analytics comes from tracking events specific to your app's functionality. This lets you know not just that people are using your app, but how they're using it.

Graphed

Build AI Agents for Marketing

Build virtual employees that run your go to market. Connect your data sources, deploy autonomous agents, and grow your company.

Build Your First Agent

Tracking Screen Views

It’s important to know which screens your users visit most. While the FirebaseAnalyticsObserver helps with named routes, it's often more reliable to log screen views manually as your users navigate.

You can call this in the initState() of your page widgets or wherever you handle your navigation logic:

class ProductsListPage extends StatefulWidget {
  const ProductsListPage({Key? key}) : super(key: key),

  @override
  State<ProductsListPage> createState() => _ProductsListPageState(),
}

class _ProductsListPageState extends State<ProductsListPage> {
  @override
  void initState() {
    super.initState(),
    _logScreenView(),
  }
    
  Future<void> _logScreenView() async {
    await MyApp.analytics.logScreenView(
      screenName: 'ProductsListPage',
      screenClass: 'ProductsListPage',
    ),
  }

  @override
  Widget build(BuildContext context) {
    // Your screen UI...
  }
}

Using clear, readable names for screenName will make your reports in Google Analytics much easier to understand.

Logging Custom Events

This is where you can tag any user action you care about - button clicks, purchases, sharing, playing a video, you name it.

You log custom events with the logEvent() method. Let’s say you want to track when a user clicks your "Request a Demo" button:

ElevatedButton(
  child: const Text('Request a Demo'),
  onPressed: () async {
    // You should await the call to make sure it's processed
    await MyApp.analytics.logEvent(name: 'request_demo_click'),
    // ... proceed with demo request logic
  },
)

You can also pass parameters to add context to your events. Imagine you want to know which product was added to a cart:

ElevatedButton(
  child: const Text('Add to Cart'),
  onPressed: () async {
    await MyApp.analytics.logEvent(
      name: 'add_to_cart',
      parameters: {
        'item_id': 'product_sku_123',
        'item_name': 'Cool Blue Widget',
        'price': 19.99,
        'currency': 'USD',
      },
    ),
    // ... continue cart logic
  },
)

This detailed data allows you to slice and dice your reports later to see revenue by product or your most popular items.

Pro tip: Google Analytics has a list of recommended events (like login, sign_up, purchase). Using these exact names helps GA better understand your data and unlock certain pre-built reports.

AI Agents for Marketing

Crash Course

Graphed

Free PDF · the crash course

AI Agents for Marketing Crash Course

Learn how to deploy AI marketing agents across your go-to-market — the best tools, prompts, and workflows to turn your data into autonomous execution without writing code.

Download the PDF

Setting User Properties

Sometimes you want to analyze groups of users based on their attributes, not just their actions. This is done with setUserProperty(). For example, you could track users based on their subscription plan:

// Call this after a user logs in or upgrades their plan
Future<void> _setUserProperties(String plan_type) async {
  await MyApp.analytics.setUserProperty(name: 'subscription_plan', value: plan_type),
}

Once you set subscription_plan to "free" or "premium," you can use this property in Google Analytics to create audiences and compare the behavior of free users versus paying customers.

Step 4: Verify Your Implementation with DebugView

Don't release your app without knowing for sure that your analytics are working! The easiest way to do this is with Firebase DebugView.

1. Enable Debug Mode on Your Device/Simulator: You need to run a terminal command for this.
2. Run Your App: Start the app from your editor or Xcode/Android Studio.
3. Open DebugView: In the Firebase console, navigate to Analytics > DebugView from the left sidebar.

As you use your app and trigger the events you set up, you will see them appear in the DebugView in near real-time. This confirms that your tags are firing correctly before you publish.

Final Thoughts

You have now successfully instrumented your Flutter app with Google Analytics. By creating a Firebase project, adding the necessary packages and configurations, and implementing tracking for screen views and custom events, you’ve gained visibility into what truly matters: user behavior.

Capturing data is where the work starts, not where it stops. Now your focus moves towards analyzing and presenting this information to make better business decisions. It can become tough with the raw GA4 reporting engine alone - which is why you created Graphed. With us, it is very easy to directly connect to Google Analytics and talk to your data from your app in spoken language, generating dashboards or creating reports in seconds and saving those manual hours of reporting from your agenda.