> For the complete documentation index, see [llms.txt](https://nocode-solutions.gitbook.io/flutterflow-marketplace-item-documentation/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://nocode-solutions.gitbook.io/flutterflow-marketplace-item-documentation/items/id-card-and-document-camera.md).

# ID Card and Document Camera

{% embed url="<https://marketplace.flutterflow.io/item/pdShlKExHTo3o4xyO6CT>" %}
Item on Marketplace
{% endembed %}

## Description

The **ID Card & Document Camera** widget provides a customizable button that launches a camera interface with an overlay guide to help users capture clear images of documents like ID cards, passports, and SIM cards. This widget utilizes the `flutter_camera_overlay` package to display a camera overlay, making it easy for users to align their documents properly for the best possible capture.

Key features include:

* Multiple card formats (ID cards, government IDs, SIM cards, etc.).
* Option to rotate the camera to landscape mode for better document positioning.
* Highly customizable button design with options for colors, border radius, padding, and text.

{% hint style="info" %}
**Note**

This widget depends on the `flutter_camera_overlay` package

The `camera` package is also required for camera functionality; make sure Camera access is requested by your project
{% endhint %}

### Setup Instructions

1. **Add the Widget to Your Page**: Drag and drop the **ID Card & Document Camera** widget onto your desired page in FlutterFlow.
2. **Configure the Widget Properties**:
   * **`width`**: Sets the width of the button (default is `double.infinity`).
   * **`height`**: Sets the height of the button (default is `50.0`).
   * **`cardType`**: Select the card format for the overlay:
     * `0`: Standard ID card (default).
     * `1`: US Government ID card.
     * `2`: SIM card.
   * **`infoText`**: Custom text to provide instructions for users (e.g., "Position your ID card within the rectangle").
   * **`labelText`**: Text label displayed inside the overlay (e.g., "Scanning ID Card").
   * **`buttonText`**: Text to display on the button (e.g., "Capture Document").
   * **`buttonColor`**: Defines the background color of the button.
   * **`borderRadius`**: Adjusts the button’s corner radius (default is `8.0`).
   * **`padding`**: Specifies padding inside the button (default is `8.0`).
   * **`rotateCamera`**: A boolean option to rotate the camera to landscape mode for better capture (default is `false`).
   * **`onCapture`**: Callback function to handle the captured image file. It returns an `FFUploadedFile?` object that can be processed or stored further.
3. **Add Camera Permissions**: Make sure your apps requests for camera permission.
4. **Run Your Application**: After configuring the widget properties and adding necessary permissions, run your app. When users tap the button, it opens the camera interface with a document overlay guide. After capturing, the widget returns the image file that can be used for verification, storage, or further processing.

By following these steps, you can seamlessly integrate and use the **ID Card & Document Camera** widget in your FlutterFlow project to capture high-quality document images.