TF-105 [BUG] Fix long line should be wrapped
This commit is contained in:
@@ -1,55 +1,31 @@
|
||||
import 'package:core/presentation/utils/html_transformer/html_transform.dart';
|
||||
import 'package:flutter/foundation.dart';
|
||||
import 'package:flutter/gestures.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_inappwebview/flutter_inappwebview.dart';
|
||||
import 'package:url_launcher/url_launcher.dart' as launcher;
|
||||
|
||||
class _HtmlGenerationArguments {
|
||||
final String message;
|
||||
final bool blockExternalImages;
|
||||
|
||||
const _HtmlGenerationArguments(
|
||||
this.message,
|
||||
this.blockExternalImages,
|
||||
);
|
||||
}
|
||||
|
||||
class _HtmlGenerationResult {
|
||||
final String? html;
|
||||
final String? errorDetails;
|
||||
|
||||
const _HtmlGenerationResult.success(this.html) : errorDetails = null;
|
||||
|
||||
const _HtmlGenerationResult.error(this.errorDetails) : this.html = null;
|
||||
}
|
||||
|
||||
class HtmlContentViewer extends StatefulWidget {
|
||||
|
||||
final String message;
|
||||
final bool blockExternalImages;
|
||||
|
||||
/// Is notified about any errors that might occur
|
||||
final void Function(Object? exception, StackTrace? stackTrace)? onError;
|
||||
final String contentHtml;
|
||||
final int minHeight;
|
||||
|
||||
/// Register this callback if you want a reference to the [InAppWebViewController].
|
||||
final void Function(InAppWebViewController controller)? onWebViewCreated;
|
||||
final void Function(InAppWebViewController controller)? onCreated;
|
||||
|
||||
final void Function(InAppWebViewController controller, Uri? uri)? onWebViewLoadStart;
|
||||
final void Function(InAppWebViewController controller, Uri? uri)? onLoadStart;
|
||||
|
||||
final void Function(InAppWebViewController controller, Uri? uri)? onWebViewLoadStop;
|
||||
final void Function(InAppWebViewController controller, Uri? uri)? onLoadStop;
|
||||
|
||||
/// Handler for mailto: links
|
||||
final Future Function(Uri mailto)? mailtoDelegate;
|
||||
|
||||
const HtmlContentViewer({
|
||||
Key? key,
|
||||
required this.message,
|
||||
this.blockExternalImages = false,
|
||||
this.onError,
|
||||
this.onWebViewCreated,
|
||||
this.onWebViewLoadStart,
|
||||
this.onWebViewLoadStop,
|
||||
required this.contentHtml,
|
||||
this.minHeight = 100,
|
||||
this.onCreated,
|
||||
this.onLoadStart,
|
||||
this.onLoadStop,
|
||||
this.mailtoDelegate,
|
||||
}) : super(key: key);
|
||||
|
||||
@@ -59,123 +35,126 @@ class HtmlContentViewer extends StatefulWidget {
|
||||
|
||||
class _HtmlContentViewState extends State<HtmlContentViewer> {
|
||||
|
||||
String? _htmlData;
|
||||
bool? _wereExternalImagesBlocked;
|
||||
bool _isGenerating = false;
|
||||
double? _webViewContentHeight = 1.0;
|
||||
double? _documentHeight = 1.0;
|
||||
double? _documentWidth = 1.0;
|
||||
String? _initialPageContent;
|
||||
late InAppWebViewController _webViewController;
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
_generateHtml(widget.blockExternalImages);
|
||||
super.initState();
|
||||
_initialPageContent = _generateHtmlDocument(widget.contentHtml);
|
||||
}
|
||||
|
||||
void _generateHtml(bool blockExternalImages) async {
|
||||
_wereExternalImagesBlocked = blockExternalImages;
|
||||
_isGenerating = true;
|
||||
final args = _HtmlGenerationArguments(
|
||||
widget.message,
|
||||
blockExternalImages,
|
||||
);
|
||||
final result = await compute(_generateHtmlImpl, args);
|
||||
_htmlData = result.html;
|
||||
if (_htmlData == null) {
|
||||
final onError = widget.onError;
|
||||
if (onError != null) {
|
||||
onError(result.errorDetails, null);
|
||||
}
|
||||
}
|
||||
if (mounted) {
|
||||
setState(() {
|
||||
_isGenerating = false;
|
||||
});
|
||||
}
|
||||
}
|
||||
String _generateHtmlDocument(String content) {
|
||||
final htmlTemplate = '''
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<style>
|
||||
#editor {
|
||||
outline: 0px solid transparent;
|
||||
min-height: ${widget.minHeight}px;
|
||||
min-width: 300px;
|
||||
color: #182952;
|
||||
font-family: verdana;
|
||||
}
|
||||
blockquote {
|
||||
font: normal helvetica, verdana;
|
||||
margin-top: 10px;
|
||||
margin-bottom: 10px;
|
||||
margin-left: 20px;
|
||||
padding-left: 15px;
|
||||
border-left: 5px solid #eee;
|
||||
}
|
||||
table {
|
||||
width: 100%;
|
||||
max-width: 100%;
|
||||
}
|
||||
td {
|
||||
padding: 13px;
|
||||
margin: 0px;
|
||||
}
|
||||
th {
|
||||
padding: 13px;
|
||||
margin: 0px;
|
||||
}
|
||||
</style>
|
||||
<script>
|
||||
var documentHeight;
|
||||
|
||||
static _HtmlGenerationResult _generateHtmlImpl(_HtmlGenerationArguments args) {
|
||||
try {
|
||||
final htmlTransform = HtmlTransform(args.message);
|
||||
final html = htmlTransform.transformToHtml(
|
||||
blockExternalImages: args.blockExternalImages,
|
||||
);
|
||||
return _HtmlGenerationResult.success(html);
|
||||
} catch (e, s) {
|
||||
String errorDetails = e.toString() + '\n\n' + s.toString();
|
||||
return _HtmlGenerationResult.error(errorDetails);
|
||||
}
|
||||
function onLoaded() {
|
||||
documentHeight = document.body.scrollHeight;
|
||||
document.execCommand("styleWithCSS", false, true);
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<body onload="onLoaded();">
|
||||
<div id="editor">$content</div>
|
||||
</body>
|
||||
</html>
|
||||
''';
|
||||
return htmlTemplate;
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
if (_isGenerating) {
|
||||
return SizedBox.shrink();
|
||||
}
|
||||
if (widget.blockExternalImages != _wereExternalImagesBlocked) {
|
||||
_generateHtml(widget.blockExternalImages);
|
||||
}
|
||||
|
||||
final size = MediaQuery.of(context).size;
|
||||
_documentWidth = size.width - 30;
|
||||
return SizedBox(
|
||||
height: _webViewContentHeight,
|
||||
width: size.width,
|
||||
child: Padding(
|
||||
padding: EdgeInsets.only(top: 16),
|
||||
child: _buildWebView(),
|
||||
),
|
||||
height: _documentHeight,
|
||||
width: _documentWidth,
|
||||
child: _buildWebView(),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildWebView() {
|
||||
if (_htmlData == null) {
|
||||
if (_initialPageContent == null || _initialPageContent?.isEmpty == true) {
|
||||
return Container();
|
||||
}
|
||||
|
||||
return InAppWebView(
|
||||
key: ValueKey(_htmlData),
|
||||
initialData: InAppWebViewInitialData(data: _htmlData!),
|
||||
key: ValueKey(_initialPageContent),
|
||||
initialData: InAppWebViewInitialData(data: _initialPageContent!),
|
||||
initialOptions: InAppWebViewGroupOptions(
|
||||
crossPlatform: InAppWebViewOptions(
|
||||
useShouldOverrideUrlLoading: true,
|
||||
verticalScrollBarEnabled: false,
|
||||
disableVerticalScroll: true,
|
||||
transparentBackground: true,
|
||||
disableVerticalScroll: false,
|
||||
disableHorizontalScroll: false,
|
||||
supportZoom: true,
|
||||
),
|
||||
android: AndroidInAppWebViewOptions(
|
||||
useWideViewPort: false,
|
||||
loadWithOverviewMode: true,
|
||||
useHybridComposition: true,
|
||||
),
|
||||
ios: IOSInAppWebViewOptions(
|
||||
allowsInlineMediaPlayback: true,
|
||||
enableViewportScale: true,
|
||||
enableViewportScale: false,
|
||||
allowsLinkPreview: false
|
||||
)
|
||||
),
|
||||
),
|
||||
onLoadStart: (controller, uri) {
|
||||
if (widget.onWebViewLoadStart != null) {
|
||||
widget.onWebViewLoadStart!(controller, uri);
|
||||
if (widget.onLoadStart != null) {
|
||||
widget.onLoadStart!(controller, uri);
|
||||
}
|
||||
},
|
||||
onWebViewCreated: widget.onWebViewCreated,
|
||||
onWebViewCreated: _onWebViewCreated,
|
||||
onLoadStop: (controller, uri) async {
|
||||
var scrollHeight = (await controller.evaluateJavascript(source: 'document.body.scrollHeight'));
|
||||
if (scrollHeight != null) {
|
||||
final scrollWidth = (await controller.evaluateJavascript(source: 'document.body.scrollWidth'));
|
||||
final size = MediaQuery.of(context).size;
|
||||
final containerWidth = size.width - 60.0;
|
||||
if (scrollWidth > containerWidth) {
|
||||
var scale = (containerWidth / scrollWidth);
|
||||
if (scale < 0.2) {
|
||||
scale = 0.2;
|
||||
}
|
||||
await controller.zoomBy(zoomFactor: scale, iosAnimated: true);
|
||||
scrollHeight = (scrollHeight * scale).ceil();
|
||||
}
|
||||
final scrollHeight = await _webViewController.evaluateJavascript(source: 'document.body.scrollHeight');
|
||||
if ((scrollHeight != null) && mounted && (scrollHeight + 30.0 > widget.minHeight)) {
|
||||
setState(() {
|
||||
_webViewContentHeight = double.tryParse('${scrollHeight + 24}');
|
||||
_documentHeight = (scrollHeight + 30.0);
|
||||
});
|
||||
}
|
||||
|
||||
if (widget.onWebViewLoadStop != null) {
|
||||
widget.onWebViewLoadStop!(controller, uri);
|
||||
if (widget.onLoadStop != null) {
|
||||
widget.onLoadStop!(controller, uri);
|
||||
}
|
||||
},
|
||||
onScrollChanged: (controller, x, y) {
|
||||
if (y != 0) {
|
||||
controller.scrollTo(x: 0, y: 0);
|
||||
}
|
||||
},
|
||||
shouldOverrideUrlLoading: _shouldOverrideUrlLoading,
|
||||
@@ -185,6 +164,13 @@ class _HtmlContentViewState extends State<HtmlContentViewer> {
|
||||
);
|
||||
}
|
||||
|
||||
void _onWebViewCreated(InAppWebViewController controller) {
|
||||
_webViewController = controller;
|
||||
if (widget.onCreated != null) {
|
||||
widget.onCreated!(_webViewController);
|
||||
}
|
||||
}
|
||||
|
||||
Future<NavigationActionPolicy> _shouldOverrideUrlLoading(
|
||||
InAppWebViewController controller,
|
||||
NavigationAction request
|
||||
|
||||
Reference in New Issue
Block a user