Skip to content

Commit

Permalink
fix: make trading view work using 3rd party dependency
Browse files Browse the repository at this point in the history
  • Loading branch information
bonomat committed May 9, 2024
1 parent c59ea28 commit 28833e7
Show file tree
Hide file tree
Showing 3 changed files with 161 additions and 87 deletions.
186 changes: 101 additions & 85 deletions mobile/lib/features/trade/tradingview_candlestick.dart
Original file line number Diff line number Diff line change
@@ -1,113 +1,129 @@
import 'dart:io';

import 'package:flutter/material.dart';
import 'package:get_10101/common/global_keys.dart';
import 'package:get_10101/common/snack_bar.dart';
import 'package:get_10101/main.dart';
import 'package:flutter_inappwebview/flutter_inappwebview.dart';
import 'package:url_launcher/url_launcher.dart';
import 'package:webview_flutter/webview_flutter.dart';
import 'package:get_10101/main.dart';

class TradingViewCandlestick extends StatefulWidget {
const TradingViewCandlestick({super.key});
const TradingViewCandlestick({
super.key,
});

@override
State<StatefulWidget> createState() => _TradingViewCandlestickState();
State<TradingViewCandlestick> createState() => _TradingViewCandlestickState();
}

class _TradingViewCandlestickState extends State<TradingViewCandlestick> {
late final WebViewController controller;
final GlobalKey webViewKey = GlobalKey();
InAppWebViewController? webViewController;

static bool enabled() => Platform.isAndroid || Platform.isIOS;
double progress = 0;
/// place holder if loading fails
late String html = """<html lang="en"><body><p>Tradingview chart not found</p></body></html>""";
// this url doesn't matter, it just has to exist
final baseUrl = WebUri("https://10101.finance/");

@override
void initState() {
super.initState();

const Color bg = appBackgroundColor;
String rgba = "rgba(${bg.red}, ${bg.green}, ${bg.blue}, ${255.0 / bg.alpha})";
String html = '''
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<style>
body {
overflow: hidden;
}
String rgba =
"rgba(${bg.red}, ${bg.green}, ${bg.blue}, ${255.0 / bg.alpha})";
html = '''
<html lang="en">
<head>
<title></title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
body {
overflow: hidden;
}
html, body, #container, .tradingview-widget-container {
background-color: $rgba;
}
iframe {
height: 100% !important;
}
.tradingview-widget-copyright {
display: none;
}
</style>
</head>
html, body, #container, .tradingview-widget-container {
background-color: $rgba;
}
<body>
iframe {
height: 100% !important;
<div id="container">
<!-- TradingView Widget BEGIN -->
<div class="tradingview-widget-container" style="height:100%;width:100%">
<div class="tradingview-widget-container__widget" style="height:100%;width:100%"></div>
<div class="tradingview-widget-copyright"><a href="https://www.tradingview.com/" rel="noopener nofollow" target="_blank"><span class="blue-text">Track all markets on TradingView</span></a></div>
<script type="text/javascript" src="https://s3.tradingview.com/external-embedding/embed-widget-advanced-chart.js" async>
{
"autosize": true,
"symbol": "BITMEX:XBT",
"interval": "D",
"timezone": "Etc/UTC",
"theme": "light",
"style": "1",
"locale": "en",
"enable_publishing": false,
"backgroundColor": "$rgba",
"hide_top_toolbar": true,
"hide_legend": true,
"allow_symbol_change": false,
"save_image": false,
"calendar": false,
"support_host": "https://www.tradingview.com"
}
.tradingview-widget-copyright {
display: none;
}
</style>
<div id="container">
<!-- TradingView Widget BEGIN -->
<div class="tradingview-widget-container" style="height:100%;width:100%">
<div class="tradingview-widget-container__widget" style="height:100%;width:100%"></div>
<div class="tradingview-widget-copyright"><a href="https://www.tradingview.com/" rel="noopener nofollow" target="_blank"><span class="blue-text">Track all markets on TradingView</span></a></div>
<script type="text/javascript" src="https://s3.tradingview.com/external-embedding/embed-widget-advanced-chart.js" async>
{
"autosize": true,
"symbol": "BITMEX:XBT",
"interval": "D",
"timezone": "Etc/UTC",
"theme": "light",
"style": "1",
"locale": "en",
"enable_publishing": false,
"backgroundColor": "$rgba",
"hide_top_toolbar": true,
"hide_legend": true,
"allow_symbol_change": false,
"save_image": false,
"calendar": false,
"support_host": "https://www.tradingview.com"
}
</script>
</div>
</div>
<!-- TradingView Widget END -->
</body>
</script>
</div>
</div>
<!-- TradingView Widget END -->
</body>
</html>
''';
}

if (enabled()) {
controller = WebViewController()
..setJavaScriptMode(JavaScriptMode.unrestricted)
..enableZoom(false)
..setNavigationDelegate(NavigationDelegate(
onNavigationRequest: (req) async {
final uri = Uri.parse(req.url);

if (uri.scheme == "about") {
return NavigationDecision.navigate;
}
@override
Widget build(BuildContext context) {
return Stack(
children: [
InAppWebView(
key: webViewKey,
onWebViewCreated: (controller) {
webViewController = controller;
webViewController!
.loadData(data: html, baseUrl: baseUrl, historyUrl: baseUrl);
},
shouldOverrideUrlLoading: (controller, navigationAction) async {
var uri = navigationAction.request.url!;

if (await canLaunchUrl(uri)) {
await launchUrl(uri, mode: LaunchMode.externalApplication);
} else {
showSnackBar(ScaffoldMessenger.of(rootNavigatorKey.currentContext!),
"Failed to open link to TradingView");
if (uri
.toString()
.startsWith("https://www.tradingview.com/chart")) {
// this is the link to the external chart, we want to open this in an external window
if (await canLaunchUrl(uri)) {
// Launch the App
await launchUrl(uri, mode: LaunchMode.externalApplication);
// and cancel the request
return NavigationActionPolicy.CANCEL;
}
}

return NavigationDecision.prevent;
return NavigationActionPolicy.ALLOW;
},
onProgressChanged: (controller, progress) {
setState(() {
this.progress = progress / 100;
});
},
))
..loadHtmlString(html);
}
),
progress < 1.0 ? LinearProgressIndicator(value: progress) : Container(),
],
);
}

@override
Widget build(BuildContext context) => enabled()
? WebViewWidget(controller: controller)
: const Text("TradingView chart only supported on IOS and Android");
}
60 changes: 58 additions & 2 deletions mobile/pubspec.lock
Original file line number Diff line number Diff line change
Expand Up @@ -398,6 +398,62 @@ packages:
description: flutter
source: sdk
version: "0.0.0"
flutter_inappwebview:
dependency: "direct main"
description:
name: flutter_inappwebview
sha256: "3e9a443a18ecef966fb930c3a76ca5ab6a7aafc0c7b5e14a4a850cf107b09959"
url: "https://pub.dev"
source: hosted
version: "6.0.0"
flutter_inappwebview_android:
dependency: transitive
description:
name: flutter_inappwebview_android
sha256: d247f6ed417f1f8c364612fa05a2ecba7f775c8d0c044c1d3b9ee33a6515c421
url: "https://pub.dev"
source: hosted
version: "1.0.13"
flutter_inappwebview_internal_annotations:
dependency: transitive
description:
name: flutter_inappwebview_internal_annotations
sha256: "5f80fd30e208ddded7dbbcd0d569e7995f9f63d45ea3f548d8dd4c0b473fb4c8"
url: "https://pub.dev"
source: hosted
version: "1.1.1"
flutter_inappwebview_ios:
dependency: transitive
description:
name: flutter_inappwebview_ios
sha256: f363577208b97b10b319cd0c428555cd8493e88b468019a8c5635a0e4312bd0f
url: "https://pub.dev"
source: hosted
version: "1.0.13"
flutter_inappwebview_macos:
dependency: transitive
description:
name: flutter_inappwebview_macos
sha256: b55b9e506c549ce88e26580351d2c71d54f4825901666bd6cfa4be9415bb2636
url: "https://pub.dev"
source: hosted
version: "1.0.11"
flutter_inappwebview_platform_interface:
dependency: transitive
description:
name: flutter_inappwebview_platform_interface
sha256: "545fd4c25a07d2775f7d5af05a979b2cac4fbf79393b0a7f5d33ba39ba4f6187"
url: "https://pub.dev"
source: hosted
version: "1.0.10"
flutter_inappwebview_web:
dependency: transitive
description:
name: flutter_inappwebview_web
sha256: d8c680abfb6fec71609a700199635d38a744df0febd5544c5a020bd73de8ee07
url: "https://pub.dev"
source: hosted
version: "1.0.8"
flutter_launcher_icons:
dependency: "direct dev"
description:
Expand Down Expand Up @@ -1430,5 +1486,5 @@ packages:
source: hosted
version: "2.1.1"
sdks:
dart: ">=3.2.0-0 <4.0.0"
flutter: ">=3.10.0"
dart: ">=3.2.3 <4.0.0"
flutter: ">=3.16.6"
2 changes: 2 additions & 0 deletions mobile/pubspec.yaml
Original file line number Diff line number Diff line change
Expand Up @@ -49,6 +49,8 @@ dependencies:
syncfusion_flutter_sliders: ^24.2.9
syncfusion_flutter_core: ^24.2.9
html: ^0.15.4
flutter_inappwebview: ^6.0.0-beta.23

dev_dependencies:
analyzer: ^6.4.1
flutter_launcher_icons: ^0.13.1
Expand Down

0 comments on commit 28833e7

Please sign in to comment.