Add Flutter Example for AdvancedCharts

README.md

@@ -9,7 +9,7 @@ Charting Library is a standalone solution for displaying charts. This free, down
 ## What is this repository about
 This repository lists various libraries/frameworks commonly used with our libraries.
 
-⚠️ All of them would obviously require a granted access to the library. 
+⚠️ All of them would obviously require a granted access to the library.
 If you don't already have one, please check this [page][request-lib-url] and have a look at our [demo][demo-url] website in the meantime as well as at our [documentation website][doc-url].
 
 ## Content
@@ -74,6 +74,10 @@ TradingView [Charting Library](https://www.tradingview.com/HTML5-stock-forex-bit
 
 TradingView [Charting Library](https://www.tradingview.com/HTML5-stock-forex-bitcoin-charting-library/) and [Vue.js v3](https://vuejs.org/) Integration Example
 
+### Flutter
+
+TradingView [Charting Library](https://www.tradingview.com/HTML5-stock-forex-bitcoin-charting-library/) integration into Flutter InAppWebView
+
 [demo-url]: https://trading-terminal.tradingview-widget.com/
 [doc-url]: https://www.tradingview.com/charting-library-docs/
 [tutorial-url]: https://github.com/tradingview/charting-library-tutorial

flutter/.gitignore

@@ -0,0 +1,43 @@
+# Miscellaneous
+*.class
+*.log
+*.pyc
+*.swp
+.DS_Store
+.atom/
+.buildlog/
+.history
+.svn/
+migrate_working_dir/
+
+# IntelliJ related
+*.iml
+*.ipr
+*.iws
+.idea/
+
+# The .vscode folder contains launch configuration and tasks you configure in
+# VS Code which you may wish to be included in version control, so this line
+# is commented out by default.
+#.vscode/
+
+# Flutter/Dart/Pub related
+**/doc/api/
+**/ios/Flutter/.last_build_id
+.dart_tool/
+.flutter-plugins
+.flutter-plugins-dependencies
+.pub-cache/
+.pub/
+/build/
+
+# Symbolication related
+app.*.symbols
+
+# Obfuscation related
+app.*.map.json
+
+# Android Studio will place build artifacts here
+/android/app/debug
+/android/app/profile
+/android/app/release

flutter/.metadata

@@ -0,0 +1,45 @@
+# This file tracks properties of this Flutter project.
+# Used by Flutter tool to assess capabilities and perform upgrades etc.
+#
+# This file should be version controlled and should not be manually edited.
+
+version:
+  revision: "dec2ee5c1f98f8e84a7d5380c05eb8a3d0a81668"
+  channel: "stable"
+
+project_type: app
+
+# Tracks metadata for the flutter migrate command
+migration:
+  platforms:
+    - platform: root
+      create_revision: dec2ee5c1f98f8e84a7d5380c05eb8a3d0a81668
+      base_revision: dec2ee5c1f98f8e84a7d5380c05eb8a3d0a81668
+    - platform: android
+      create_revision: dec2ee5c1f98f8e84a7d5380c05eb8a3d0a81668
+      base_revision: dec2ee5c1f98f8e84a7d5380c05eb8a3d0a81668
+    - platform: ios
+      create_revision: dec2ee5c1f98f8e84a7d5380c05eb8a3d0a81668
+      base_revision: dec2ee5c1f98f8e84a7d5380c05eb8a3d0a81668
+    - platform: linux
+      create_revision: dec2ee5c1f98f8e84a7d5380c05eb8a3d0a81668
+      base_revision: dec2ee5c1f98f8e84a7d5380c05eb8a3d0a81668
+    - platform: macos
+      create_revision: dec2ee5c1f98f8e84a7d5380c05eb8a3d0a81668
+      base_revision: dec2ee5c1f98f8e84a7d5380c05eb8a3d0a81668
+    - platform: web
+      create_revision: dec2ee5c1f98f8e84a7d5380c05eb8a3d0a81668
+      base_revision: dec2ee5c1f98f8e84a7d5380c05eb8a3d0a81668
+    - platform: windows
+      create_revision: dec2ee5c1f98f8e84a7d5380c05eb8a3d0a81668
+      base_revision: dec2ee5c1f98f8e84a7d5380c05eb8a3d0a81668
+
+  # User provided section
+
+  # List of Local paths (relative to this file) that should be
+  # ignored by the migrate tool.
+  #
+  # Files that are not part of the templates will be ignored by default.
+  unmanaged_files:
+    - 'lib/main.dart'
+    - 'ios/Runner.xcodeproj/project.pbxproj'

flutter/README.md

@@ -0,0 +1,134 @@
+
+# **Flutter TradingView Advanced Charts Example**
+
+This project demonstrates how to integrate the **TradingView Advanced Charts Library** into a Flutter application. It includes full support for the library's features, including drawing tools and advanced configurations.
+
+| Android|iOS|
+|---|---|
+|<img src="https://github.com/user-attachments/assets/b0e09ae8-faed-4cb8-8aa7-d10555b9508b" width="200"/> | <img src="https://github.com/user-attachments/assets/5bb2e711-6f8a-4afa-a110-74f98d3eab9a" width="200"/>|
+
+⚠️ **Note:** This implementation currently works **only for Android and iOS platforms**.
+
+---
+
+## **Setup Instructions**
+
+### 1. **Clone the Project**
+
+Clone this repository to your local environment:
+
+```bash
+git clone [email protected]:tradingview/charting-library-examples.git
+cd flutter
+```
+
+### 2. **Download and Add TradingView Library**
+
+To use the TradingView Advanced Charts Library:
+
+1. Download the **Advanced Charts Library** from [TradingView](https://www.tradingview.com/advanced-charts/).
+2. Copy and paste the entire library folder into your Flutter project at:
+
+   ```
+   assets/trading_view/
+   ```
+
+   Your folder structure should look like this:
+
+   ```
+   assets/
+     trading_view/
+       charting_library/
+       datafeeds/
+       index.html
+       ...
+   ```
+
+---
+
+### 3. **Update the project dependencies**
+
+Run the following command to update the project dependencies:
+
+```bash
+flutter pub get
+```
+
+---
+
+### 4. **Platform-Specific Configurations**
+
+#### **Android**
+
+Add Internet permissions in `android/app/src/main/AndroidManifest.xml`:
+
+```xml
+<uses-permission android:name="android.permission.INTERNET" />
+```
+
+Ensure `hardwareAccelerated` & `usesCleartextTraffic` is enabled in the `application` tag:
+
+```xml
+<application
+    android:usesCleartextTraffic="true"
+    android:hardwareAccelerated="true"
+    ... >
+```
+
+#### **iOS**
+
+Update the `ios/Runner/Info.plist` to allow arbitrary loads:
+
+```xml
+<key>NSAppTransportSecurity</key>
+<dict>
+  <key>NSAllowsArbitraryLoads</key>
+  <true/>
+</dict>
+```
+
+---
+
+### 5. **Run the Example**
+
+Run the Flutter project:
+
+```bash
+flutter run
+```
+
+The app will launch and display the **TradingView Advanced Charts** using a `WebView`.
+
+---
+
+## **Code Overview**
+
+### **Loading the Advanced Charts**
+
+- The app uses `flutter_inappwebview` to load a local HTML file (`index.html`) that initializes the TradingView widget.
+- The HTML file is loaded from the assets folder.
+
+---
+
+## **Troubleshooting**
+
+1. **CORS Issues**:
+   If you face **CORS errors**, ensure:
+   - You are loading all resources locally.
+   - You have configured `flutter_inappwebview` with `allowFileAccessFromFileURLs` and `allowUniversalAccessFromFileURLs`.
+
+2. **Assets Not Found**:
+   Verify that:
+   - The `pubspec.yaml` file includes all required assets.
+   - The folder structure is correct.
+
+3. **Library Access**:
+   Ensure you have the necessary permissions from TradingView to use the **Advanced Charts Library**.
+
+---
+
+## **Limitations**
+
+- Currently supported only on **Android** and **iOS**.
+- Requires manual integration of the TradingView library.
+

flutter/analysis_options.yaml

@@ -0,0 +1,28 @@
+# This file configures the analyzer, which statically analyzes Dart code to
+# check for errors, warnings, and lints.
+#
+# The issues identified by the analyzer are surfaced in the UI of Dart-enabled
+# IDEs (https://dart.dev/tools#ides-and-editors). The analyzer can also be
+# invoked from the command line by running `flutter analyze`.
+
+# The following line activates a set of recommended lints for Flutter apps,
+# packages, and plugins designed to encourage good coding practices.
+include: package:flutter_lints/flutter.yaml
+
+linter:
+  # The lint rules applied to this project can be customized in the
+  # section below to disable rules from the `package:flutter_lints/flutter.yaml`
+  # included above or to enable additional rules. A list of all available lints
+  # and their documentation is published at https://dart.dev/lints.
+  #
+  # Instead of disabling a lint rule for the entire project in the
+  # section below, it can also be suppressed for a single line of code
+  # or a specific dart file by using the `// ignore: name_of_lint` and
+  # `// ignore_for_file: name_of_lint` syntax on the line or in the file
+  # producing the lint.
+  rules:
+    # avoid_print: false  # Uncomment to disable the `avoid_print` rule
+    # prefer_single_quotes: true  # Uncomment to enable the `prefer_single_quotes` rule
+
+# Additional information about this file can be found at
+# https://dart.dev/guides/language/analysis-options

flutter/android/.gitignore

@@ -0,0 +1,13 @@
+gradle-wrapper.jar
+/.gradle
+/captures/
+/gradlew
+/gradlew.bat
+/local.properties
+GeneratedPluginRegistrant.java
+
+# Remember to never publicly share your keystore.
+# See https://flutter.dev/to/reference-keystore
+key.properties
+**/*.keystore
+**/*.jks

flutter/android/app/build.gradle

@@ -0,0 +1,44 @@
+plugins {
+    id "com.android.application"
+    id "kotlin-android"
+    // The Flutter Gradle Plugin must be applied after the Android and Kotlin Gradle plugins.
+    id "dev.flutter.flutter-gradle-plugin"
+}
+
+android {
+    namespace = "com.example.flutter_charting_library"
+    compileSdk = flutter.compileSdkVersion
+    ndkVersion = flutter.ndkVersion
+
+    compileOptions {
+        sourceCompatibility = JavaVersion.VERSION_1_8
+        targetCompatibility = JavaVersion.VERSION_1_8
+    }
+
+    kotlinOptions {
+        jvmTarget = JavaVersion.VERSION_1_8
+    }
+
+    defaultConfig {
+        // TODO: Specify your own unique Application ID (https://developer.android.com/studio/build/application-id.html).
+        applicationId = "com.example.flutter_charting_library"
+        // You can update the following values to match your application needs.
+        // For more information, see: https://flutter.dev/to/review-gradle-config.
+        minSdk = flutter.minSdkVersion
+        targetSdk = flutter.targetSdkVersion
+        versionCode = flutter.versionCode
+        versionName = flutter.versionName
+    }
+
+    buildTypes {
+        release {
+            // TODO: Add your own signing config for the release build.
+            // Signing with the debug keys for now, so `flutter run --release` works.
+            signingConfig = signingConfigs.debug
+        }
+    }
+}
+
+flutter {
+    source = "../.."
+}

flutter/android/app/src/debug/AndroidManifest.xml

@@ -0,0 +1,7 @@
+<manifest xmlns:android="http://schemas.android.com/apk/res/android">
+    <!-- The INTERNET permission is required for development. Specifically,
+         the Flutter tool needs it to communicate with the running application
+         to allow setting breakpoints, to provide hot reload, etc.
+    -->
+    <uses-permission android:name="android.permission.INTERNET"/>
+</manifest>

flutter/android/app/src/main/AndroidManifest.xml

@@ -0,0 +1,50 @@
+<manifest xmlns:android="http://schemas.android.com/apk/res/android">
+<uses-permission android:name="android.permission.INTERNET" />
+    <application
+        android:label="flutter_charting_library"
+        android:name="${applicationName}"
+        android:icon="@mipmap/ic_launcher"
+        android:usesCleartextTraffic="true"
+        android:hardwareAccelerated="true">
+
+
+        <activity
+            android:name=".MainActivity"
+            android:exported="true"
+            android:launchMode="singleTop"
+            android:taskAffinity=""
+            android:theme="@style/LaunchTheme"
+            android:configChanges="orientation|keyboardHidden|keyboard|screenSize|smallestScreenSize|locale|layoutDirection|fontScale|screenLayout|density|uiMode"
+            android:hardwareAccelerated="true"
+            android:windowSoftInputMode="adjustResize">
+            <!-- Specifies an Android theme to apply to this Activity as soon as
+                 the Android process has started. This theme is visible to the user
+                 while the Flutter UI initializes. After that, this theme continues
+                 to determine the Window background behind the Flutter UI. -->
+            <meta-data
+              android:name="io.flutter.embedding.android.NormalTheme"
+              android:resource="@style/NormalTheme"
+              />
+            <intent-filter>
+                <action android:name="android.intent.action.MAIN"/>
+                <category android:name="android.intent.category.LAUNCHER"/>
+            </intent-filter>
+        </activity>
+        <!-- Don't delete the meta-data below.
+             This is used by the Flutter tool to generate GeneratedPluginRegistrant.java -->
+        <meta-data
+            android:name="flutterEmbedding"
+            android:value="2" />
+    </application>
+    <!-- Required to query activities that can process text, see:
+         https://developer.android.com/training/package-visibility and
+         https://developer.android.com/reference/android/content/Intent#ACTION_PROCESS_TEXT.
+
+         In particular, this is used by the Flutter engine in io.flutter.plugin.text.ProcessTextPlugin. -->
+    <queries>
+        <intent>
+            <action android:name="android.intent.action.PROCESS_TEXT"/>
+            <data android:mimeType="text/plain"/>
+        </intent>
+    </queries>
+</manifest>

flutter/android/app/src/main/kotlin/com/example/flutter_charting_library/MainActivity.kt

@@ -0,0 +1,5 @@
+package com.example.flutter_charting_library
+
+import io.flutter.embedding.android.FlutterActivity
+
+class MainActivity: FlutterActivity()