# Installation

## **Requirements**

* **Android:** API version <mark style="color:blue;">**21**</mark> or higher
  * You need to set the `compileSdkVersion` to <mark style="color:blue;">**34**</mark> in the `android/app/build.gradle` file.
* **iOS:** Version <mark style="color:blue;">**13.0**</mark> or higher
  * Update the `platform :ios` version to <mark style="color:blue;">**13.0**</mark> in your Flutter project’s `ios/Podfile`, and verify and modify the `ios/Podfile` as needed.

{% hint style="info" %}
This package is only available for **Android** and **iOS** environments. It is not supported on **Web**, **macOS**, **Windows**, or **Linux** environments.
{% endhint %}

## **Installation**

The Wepin Flutter Widget SDK is published on pub.dev, and you can install it by adding the following command or by adding a dependency in your app's `pubspec.yaml`.

* **Add using Flutter pub add command:**

```bash
$ flutter pub add wepin_flutter_widget_sdk
```

* **Add to dependencies in `pubspec.yaml`:**

```yaml
dependencies:
    wepin_flutter_widget_sdk: ^0.0.1
```

## Configuration

### **Deep Link Configuration**

To enable OAuth login functionality (`login.loginWithOauthProvider`), you need to configure the Deep Link scheme.

* **Deep Link scheme format:** `wepin.` + `Wepin App ID`

#### **Android**

* Add `manifestPlaceholders` to the `build.gradle (app)` file to easily capture all redirects using this custom scheme with the Wepin Widget SDK.

{% code title="build.gradle(app)" %}

```gradle
// Deep Link configuration => Redirect scheme format: wepin. + Wepin App ID
android.defaultConfig.manifestPlaceholders = [
  'appAuthRedirectScheme': 'wepin.{{YOUR_WEPIN_APPID}}'
]
```

{% endcode %}

#### **iOS**

* Add the app’s URL scheme to the `Info.plist` file to redirect back to the app after the authentication process.

{% code title="Info.plist" %}

```xml
<key>CFBundleURLTypes</key>
<array>
    <dict>
        <key>CFBundleURLName</key>
        <string>unique name</string>
        <key>CFBundleURLSchemes</key>
        <array>
            <string>wepin.{{YOUR_WEPIN_APPID}}</string>
        </array>
    </dict>
</array>
```

{% endcode %}

### Permission Configuration

To use the Wepin Flutter Widget SDK, camera access permission is required. The camera function is essential for recognizing addresses in QR code format.  \[[Reference: permission\_handle](https://pub.dev/packages/permission_handler)]

#### **Android**

* Add the following lines to your app's `AndroidManifest.xml` file:

{% code title="AndroidManifest.xml" %}

```xml
<manifest xmlns:android="http://schemas.android.com/apk/res/android">
  <uses-permission android:name="android.permission.CAMERA" />
  <uses-permission android:name="android.permission.INTERNET" />
  <!-- ... -->
</manifest>
```

{% endcode %}

#### **iOS**

* **Update Podfile:** Add camera permission to your `Podfile`.

{% code title="Podfile " %}

```ruby
post_install do |installer|
  installer.pods_project.targets.each do |target|
    flutter_additional_ios_build_settings(target)

    target.build_configurations.each do |config|
      # For more information, refer to https://github.com/BaseflowIT/flutter-permission-handler/blob/master/permission_handler/ios/Classes/PermissionHandlerEnums.h
      config.build_settings['GCC_PREPROCESSOR_DEFINITIONS'] ||= [
        '$(inherited)',
        ## dart: PermissionGroup.camera
        'PERMISSION_CAMERA=1',
        ]
    end
  end
end
```

{% endcode %}

* **Update Info.plist:** Add the required permission usage descriptions.

{% code title="Info.plist" %}

```xml
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
  <!-- 🚨 Keep only the permissions used in your app 🚨 -->
  <key>NSCameraUsageDescription</key>
  <string>YOUR TEXT</string>
  <!-- … -->
</dict>
</plist>
```

{% endcode %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.wepin.io/en/widget-integration/flutter-sdk/widget/installation.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.