Skip to content
61 changes: 61 additions & 0 deletions docs/ff-concepts/alerts-notification/haptic-feedback.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,61 @@
---
title: Haptic Feedback
slug: /concepts/alerts-notification/haptic-feedback
sidebar_position: 4
tags: [Actions, Alerts & Notifications]
keywords: [FlutterFlow, Actions, Alerts & Notifications, Haptic Feedback]
---
# Haptic Feedback
Using this action, you can vibrate the user's device. Typically this is used to draw users' attention to the action they have performed. For example, vibrating the user's device on setting the alarm.

## Types of Haptic Feedback

Depending on the action a user has performed (e.g., bookmark an item, on-off flashlight), you can set the different vibration intensity and duration types.

Here are the types of haptic feedback:

1. **Light**: This creates a very low-intensity vibration similar to pressing a virtual on-screen key.
2. **Medium**: This creates a medium-intensity vibration similar to pressing a key on a keyboard.
3. **Heavy**: This creates a high-intensity vibration similar to clicking an item.
4. **Selection Click**: This vibrates the device when selection changes through discrete values. Similar to changing hours and minutes on the clock app.
5. **Vibrate**: This creates a vibration for a short duration.

:::warning
- The *Light*, *Medium*, *Heavy*, and *Selection Click*, these types of haptic feedback only work on iOS version 10 and above.
- The *Selection Click* type only works on Android API levels 23 and above.
:::

## Adding Haptic Feedback [Action]

Go to your project page on FlutterFlow and follow the steps below to define the Action to any widget.

1. Select the **Widget** (e.g., Button) on which you want to define the action.
2. Select **Actions** from the Properties panel (the right menu), and click **+ Add Action**.
3. Search and select the **Haptic Feedback** (under *Alerts/Notifications*) action.
4. Set the **Feedback Type** among the **Light**, **Medium**, **Heavy**, **Selection Click**, and **Vibrate**.

<div style={{
position: 'relative',
paddingBottom: 'calc(56.67989417989418% + 41px)', // Keeps the aspect ratio and additional padding
height: 0,
width: '100%'}}>
<iframe
src="https://demo.arcade.software/MfWI3yPIBv4WmHTl99Iq?embed&show_copy_link=true"
title=""
style={{
position: 'absolute',
top: 0,
left: 0,
width: '100%',
height: '100%',
colorScheme: 'light'
}}
frameborder="0"
loading="lazy"
webkitAllowFullScreen
mozAllowFullScreen
allowFullScreen
allow="clipboard-write">
</iframe>
</div>
<p></p>
2 changes: 1 addition & 1 deletion docs/ff-concepts/alerts-notification/push-notifications.md
Original file line number Diff line number Diff line change
Expand Up @@ -40,7 +40,7 @@ Here are the steps to send push notifications:

1. [Enabling push notification](#enabling-push-notification)
2. [Only for iOS: Configuring iOS app](#only-for-ios-configuring-ios-app)
3. [Sending push notifications](#3-sending-push-notifications)
3. [Sending push notifications](#sending-push-notifications)

### Enabling push notification

Expand Down
125 changes: 125 additions & 0 deletions docs/ff-concepts/file-handling/clear-delete-media.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,125 @@
---
title: Clear or Delete Media
slug: /concepts/file-handling/clear-delete-media
sidebar_position: 6
tags: [Media, Action]
keywords: [Media, Clear Data, Delete Data Firebase Storage, Supabase Storage]
---

# Clear or Delete Media

The Clear and Delete Media actions provide essential functionalities for managing media files efficiently.

## Clear Uploaded Data

By utilizing this action, you can clear the *Uploaded File URL*. This functionality is handy when you want to offer users a straightforward method to remove any uploaded media, such as images or recordings, by providing them with an explicit option to do so.

<div style={{
position: 'relative',
paddingBottom: 'calc(56.67989417989418% + 41px)', // Keeps the aspect ratio and additional padding
height: 0,
width: '100%'}}>
<iframe
src="https://demo.arcade.software/kvwTWagvs71aE973iZX1?embed&show_copy_link=true"
title=""
style={{
position: 'absolute',
top: 0,
left: 0,
width: '100%',
height: '100%',
colorScheme: 'light'
}}
frameborder="0"
loading="lazy"
webkitAllowFullScreen
mozAllowFullScreen
allowFullScreen
allow="clipboard-write">
</iframe>
</div>
<p></p>

:::info
Before you use this action, you must have the [**Upload Data**](upload-save-media.md) action already added.
:::

### Adding Clear Uploaded Data action

Follow the steps below to add this type of action to any widget:

1. Select the **Widget** (e.g., Button) on which you want to add the action.
2. Select **Actions** from the Properties panel (the right menu), and click **+ Add Action**.
3. Search and select the **Clear Uploaded Data** (under *Utilities*) **> [Name of uploaded data]** (given in the [Upload Data](upload-save-media.md)) action.

![Adding Clear Uploaded Data action](imgs/adding-clear-uploaded-data-action.avif)

## Delete Data

Using this action, you can delete the uploaded media, such as photos, videos, and PDF files, from the [Firebase Storage](https://firebase.google.com/docs/storage).

<div style={{
position: 'relative',
paddingBottom: 'calc(56.67989417989418% + 41px)', // Keeps the aspect ratio and additional padding
height: 0,
width: '100%'}}>
<iframe
src="https://demo.arcade.software/fIboVzBCehvRIditcSCp?embed&show_copy_link=true"
title=""
style={{
position: 'absolute',
top: 0,
left: 0,
width: '100%',
height: '100%',
colorScheme: 'light'
}}
frameborder="0"
loading="lazy"
webkitAllowFullScreen
mozAllowFullScreen
allowFullScreen
allow="clipboard-write">
</iframe>
</div>
<p></p>

:::info
Before you add this action, ensure you can access the *Uploaded File URL* of the media. Check out the [**upload media**](upload-data.md) section to see how to get it.
:::

### Adding Delete Media action

Follow the steps below to add this action to any widget.

1. Select the **Widget** (e.g., Button) on which you want to add the action.
2. Select **Actions** from the Properties panel (the right menu), and click **+ Add Action**.
3. Search and select the **Delete Media** (under *Utilities*) action.
4. Inside the **URL** section, provide a valid media URL. This must be either the direct **Uploaded File URL** or a variable that holds the URL.
5. To let users know about the successful deletion of the media, you can [add the snackbar message](../../resources/ui/pages/page-elements.md#snackbar).

<div style={{
position: 'relative',
paddingBottom: 'calc(56.67989417989418% + 41px)', // Keeps the aspect ratio and additional padding
height: 0,
width: '100%'}}>
<iframe
src="https://demo.arcade.software/ColbgtU1jVqrvKp0OKeB?embed&show_copy_link=true"
title=""
style={{
position: 'absolute',
top: 0,
left: 0,
width: '100%',
height: '100%',
colorScheme: 'light'
}}
frameborder="0"
loading="lazy"
webkitAllowFullScreen
mozAllowFullScreen
allowFullScreen
allow="clipboard-write">
</iframe>
</div>
<p></p>
Binary file not shown.
4 changes: 2 additions & 2 deletions docs/ff-concepts/file-handling/upload-save-file.md
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
---
title: Upload/Save File
title: Upload or Save File
slug: /concepts/file-handling/upload-save-file
sidebar_position: 4
tags: [Media, Upload Data, File Management]
Expand All @@ -11,7 +11,7 @@ keywords: [Media, Upload Data, Firebase Storage, Supabase Storage]
import Tabs from '@theme/Tabs';
import TabItem from '@theme/TabItem';

# Upload/Save File
# Upload or Save File

Using this action, you can upload any type of file to your app (e.g., PDF, MP3, etc.). You can store the file on [Firebase](https://firebase.google.com/docs/storage), [Supabase](https://supabase.com/docs/guides/storage) storage, or your own server using an API. Once uploaded, you can access the file through its generated URL. This URL can be used to display the content immediately or store it in a database for future retrieval.

Expand Down
4 changes: 2 additions & 2 deletions docs/ff-concepts/file-handling/upload-save-media.md
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
---
title: Upload/Save Media
title: Upload or Save Media
slug: /concepts/file-handling/upload-save-media
sidebar_position: 5
tags: [Media, Upload Data, File Management]
Expand All @@ -10,7 +10,7 @@ import Tabs from '@theme/Tabs';
import TabItem from '@theme/TabItem';


# Upload/Save Media
# Upload or Save Media

This action allows you to easily upload a photo or video to your app. You have the flexibility to store the file on [Firebase](https://firebase.google.com/docs/storage), [Supabase](https://supabase.com/docs/guides/storage) storage, or your own server using an API. Once uploaded, you can access the file through its generated URL. This URL can be used to display the content immediately or store it in a database for future retrieval.

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -130,7 +130,7 @@ Changing the app language manually includes the following steps:

1. [Building a page](#1-building-a-page)
2. [Translating app content](#2-translating-app-content)
3. [Adding action to change the language](#3-adding-action-to-change-the-language)
3. [Adding action to change the language](#3-add-set-app-language-action)

### 1. Building a page

Expand Down Expand Up @@ -223,8 +223,8 @@ Managing your app's text translation includes updating the translated text (prod

There are two ways you can manage the app text translation:

- [Inside Language Settings](#1-inside-language-settings)
- [Inside App Builder](#2-inside-app-builder)
- [Inside Language Settings](#inside-language-settings)
- [Inside App Builder](#inside-app-builder)

### Inside Language Settings

Expand Down Expand Up @@ -270,8 +270,8 @@ FlutterFlow allows you to manage the translation for predefined messages, such a

There are two types of messages you can translate:

- [iOS Permission Messages](#1-ios-permission-messages)
- [Preset Snackbar Messages](#2-preset-snackbar-messages)
- [iOS Permission Messages](#ios-permission-messages)
- [Preset Snackbar Messages](#preset-snackbar-messages)

### iOS Permission Messages

Expand Down Expand Up @@ -390,8 +390,8 @@ While building a multi-language app, sometimes you may need language-related dat

In FlutterFlow, you can get the following two types of language-related data:

- [Current language code](#1-current-language-code)
- [Language dependent text](#2-language-dependent-text)
- [Current language code](#current-language-code)
- [Language dependent text](#language-dependent-text)

### Current language code

Expand Down
Binary file not shown.
Binary file not shown.
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
---
slug: /integrations/authentication/supabase/email-authentication
slug: /integrations/authentication/supabase/email
title: Email Authentication
description: Learn how to integrate Email Login of Supabase Auth into your FlutterFlow app.
tags: [Email Authentication, Authentication, Supabase]
Expand Down
Loading