# 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 %}