---
title: "Configure the Flutter client"
url: https://docs.catalyst.zoho.com/en/tutorials/dialer-mobile-app/flutter/configure-client/
description: "Build a dialer application in Flutter using Catalyst Advanced I/O Functions, Data Store, and Twilio's Voice API to call customers from your sales team."
last_updated: 2026-11-04T10:10:44Z
service: All Services
type: tutorial
related_links:
  - name: "Client Directory Structure"
    url: /en/cli/v1/project-directory-structure/introduction
---

# Configure Flutter Client

We will be providing the entire Flutter code for your Dialer application. You can download the Flutter code from [here](https://learn.zoho.com/scroll/downloadFile.do?soid=671864332&fileId=5569550000021783853&articleId=5569550000012907037).

The code directory will look like this : 

![code-bundle](https://catalyst-docs-development.zohostratus.in/images/tutorials/dialer-app/flutter/code-bundle.webp)

> **Note:** This code zip contains the source code required for both Android and iOS applications.

In the code provided, we have already imported the Flutter SDK in the `lib/main.dart` file. You can check the detailed steps to import the SDK in this help page. 

After importing the SDK, we have initialized the SDK in the main()function using the `ZCatalystApp.init()` method. To know the steps to initialize the SDK, you can refer to this help page. 

> **Note:** Since the provided code includes the `build.gradle` file, you won’t need to rebuild the application manually.

Now we will proceed to configure and run the application in Android Studio and Xcode.

To configure the project in Android Studio please make sure to follow the below listed steps :

1. Click **File → Open** and open the downloaded code folder.
![file-open](https://catalyst-docs-development.zohostratus.in/images/tutorials/dialer-app/flutter/file-open.webp)

2. Navigate to **View → Tool Windows → Terminal**.
Run the following command in the terminal to install the dependencies needed for the Flutter application.

```sh
flutter pub get
```

![pub-get](https://catalyst-docs-development.zohostratus.in/images/tutorials/dialer-app/flutter/pub-get.webp)

3. Navigate to the assets directory(**/assets**) of your Android app module and add the android configuration file you downloaded from the Catalyst console in [this step](https://docs.catalyst.zoho.com/en/tutorials/dialer-mobile-app/flutter/register-app).
![add-config](https://catalyst-docs-development.zohostratus.in/images/tutorials/dialer-app/flutter/add-config.webp)

Next, we will need to configure the Catalyst function URLs for both `/makeCall` and `/getLogs` routes in the `catalyst_paramters.env` file in Android Studio.
	
To fetch the Catalyst function url, navigate to **Serverless → Functions** and click the **dialer function**.

![function-page](https://catalyst-docs-development.zohostratus.in/images/tutorials/dialer-app/flutter/function-page.webp)

Copy the invocation url as shown in the screenshot below and paste it in the `catalyst_paramters.env` file.

![invocation-url](https://catalyst-docs-development.zohostratus.in/images/tutorials/dialer-app/flutter/invocation-url.webp)

For example:

**CALL_INITIATION_URL** = https://catalystdialerapp-781316834.development.catalystserverless.com/server/dialer/makeCall

**CALL_LOGS_URL** = https://catalystdialerapp-781316834.development.catalystserverless.com/server/dialer/getLogs

To configure the iOS project in Xcode please make sure to follow the below listed steps :

1. Click **File → Open** and open the iOS folder and all other files from the code zip extracted earlier, except android folder.
![open-xcode](https://catalyst-docs-development.zohostratus.in/images/tutorials/dialer-app/flutter/open-xcode.webp)

2. Right click on **Runner**. Select **Add Files to Runner** and now add the iOS configuration file downloaded in [this step](https://docs.catalyst.zoho.com/en/tutorials/dialer-mobile-app/flutter/register-app). 

![add-ios-config](https://catalyst-docs-development.zohostratus.in/images/tutorials/dialer-app/flutter/add-ios-config.webp)