FlutterFlow Docs

Navigation Menu

The left-most menu on your FlutterFlow project page is called the Navigation Menu. It gives you access to the project's user interface builder, widget tree, and helps you to navigate to pages for adding project features, including the Firestore database, setting up API calls, uploading image assets, and adding integrations, and more.
Navigation Menu

1. Dashboard

The home icon leads you to the Dashboard page. From here you can navigate to existing projects or manage your projects (create new projects, remove existing projects, duplicate a project and leave a project). You can also access your account information and links to the various FlutterFlow resources.

2. UI Builder

The UI Builder gives you access to all the widgets that can be added to the application. You can customize the widgets by modifying their properties, defining actions, making them dynamic by connecting to backend queries, and applying animations.

3. Widget Tree

The Widget Tree panel gives you a high-level overview of all the widgets that you have added to a selected page. The widget tree changes as your change the selected page. There's one more advantage to this widget tree view, you can add a new widget directly from the widget tree.

4. Firestore

On the Firestore page, you can create database collections using Firebase (you should have your Firebase setup complete to access this page). You also have access to modify the database schema defined inside any Collection. To view your Firestore Security Rules along with their deployment status, head over to the Settings tab of your Firebase console.
Learn more about Firebase on FlutterFlow here.

5. Local State

From this page, you can define the Local state variable for your app. The Local State variable allows you to store values that you can use on different pages. You can store the single or list of items inside the Local State variable. You can also mark any variable as 'Persisted' to store values that can be used even after your app restarts.

6. API Calls

You can define custom API calls here. Simply select your API call method type, add your API URL, Headers & Parameters, and you are ready to go. Now, you can hook up the API call to any UI component using Actions.

7. Project Media/Assets

From this page, you can upload any image assets that you want to use while building your app. You can also remove any asset that you no longer need.

8. Custom Code

You can define your own functions using Dart code that can be used anywhere in the project on FlutterFlow. Learn more about creating the Custom Function.

9. Settings and Integrations

On this page, you can change your project name and package name. From here, you can also customize various app settings including launcher icon, splash screen image, initial page to be loaded, as well as some design settings (like navbar, app bar, colors palette, typography, custom fonts, and so on). From this page, you can also enable the Authentication, Push Notifications and deploy your app to Play Store and App Store.
The integrations offered by FlutterFlow are also accessible from this page - Firebase, Algolia, Google Maps, Google Analytics, AdMob, and payments. You can also invite your team members to the FlutterFlow project by going to the Team tab.