flutter_html
flutter_html copied to clipboard
Sub6Resources
i think the Bug is due to flutter html [BUG]
Hi, ii think the Bug is due to flutter html but i dont know that what it exactly is happen
can reproduce code :
import 'package:dio/dio.dart';
import 'package:flutter/material.dart';
import 'package:flutter_html/flutter_html.dart';
import 'package:url_launcher/url_launcher.dart';
// ignore: must_be_immutable
class ShowPageR extends StatefulWidget {
ShowPageR({Key? key}) : super(key: key);
@override
_ShowPageRState createState() => _ShowPageRState();
}
class _ShowPageRState extends State<ShowPageR> {
@override
// ignore: must_call_super
void initState() {
super.initState();
}
var tt = r"""
<h2>结果：</h2><p>最后虽然实现了使用 "html_editor_enhanced" 所见即所得的显示，也解决了 工具栏隐藏，禁止编辑，以及选中文本等多个已知问题，但是也引入了许多其它新的问题："scroll 焦点失效"、"<span style="font-family: Consolas, "Courier New", monospace; white-space: pre; background-color: rgb(255, 255, 255); --darkreader-inline-bgcolor:#1e2122;" data-darkreader-inline-bgcolor="">autoAdjustHeight</span>"问题；</p><p>所以最后还是选择回到flutter_html 上进行代码优化。</p><h2>scroll 焦点失效：</h2><p>表现：</p><p>使用<span style="font-family: Consolas, "Courier New", monospace; white-space: pre; background-color: rgb(255, 255, 255); --darkreader-inline-bgcolor:#1e2122;" data-darkreader-inline-bgcolor="">SingleChildScrollView </span><span style="background-color: rgb(255, 255, 255); font-family: Consolas, "Courier New", monospace; white-space: pre; --darkreader-inline-bgcolor:#1e2122;" data-darkreader-inline-bgcolor="">包裹 HtmlEditor时，已达到可以使用Scroll进行整个页面滑动。</span></p><p>但是当鼠标焦点位于"html_editor_enhanced"的控制范围不可进行滑动，只有移动到非"<span style="background-color: rgb(255, 255, 255); font-family: Consolas, "Courier New", monospace; white-space: pre; --darkreader-inline-bgcolor:#1e2122;" data-darkreader-inline-bgcolor="">HtmlEditor</span>"显示区域可以正确Scroll，后在官方issue上看见，说因为<span style="background-color: rgb(255, 255, 255); font-family: Consolas, "Courier New", monospace; white-space: pre; --darkreader-inline-bgcolor:#1e2122;" data-darkreader-inline-bgcolor="">HtmlEditor是WebView区域，flutter不可控制。</span><a href="https://github.com/tneotia/html-editor-enhanced/issues/158" target="_blank">Issues158</a></p><h2><span style="font-family: Consolas, "Courier New", monospace; white-space: pre; background-color: rgb(255, 255, 255); --darkreader-inline-bgcolor:#1e2122;" data-darkreader-inline-bgcolor="">autoAdjustHeight</span>优化：</h2><p><font face="Consolas, Courier New, monospace"><span style="white-space: pre; background-color: rgb(255, 255, 255); --darkreader-inline-bgcolor:#1e2122;" data-darkreader-inline-bgcolor="">在将"</span></font><span style="background-color: rgb(255, 255, 255); font-family: Consolas, "Courier New", monospace; white-space: pre; --darkreader-inline-bgcolor:#1e2122;" data-darkreader-inline-bgcolor="">autoAdjustHeight</span><span style="background-color: rgb(255, 255, 255); white-space: pre; font-family: Consolas, "Courier New", monospace; --darkreader-inline-bgcolor:#1e2122;" data-darkreader-inline-bgcolor="">" 设置 true，自动调整高度时，会出现一个小尾巴而不解决</span></p><p><span style="background-color: rgb(255, 255, 255); white-space: pre; font-family: Consolas, "Courier New", monospace; --darkreader-inline-bgcolor:#1e2122;" data-darkreader-inline-bgcolor="">图中红色位置：</span></p><p><img src="data:image/png;base64,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" style="width: 1180.67px;" data-filename="image.png">巧了，在GitHub的<a href="https://github.com/tneotia/html-editor-enhanced/issues/190" target="_blank">issue</a>中也看见了这个bug，不过貌似说需要手动设置高度，在OtherOptions中，但是我当前想展示文章，因为不能预期文章的长度，所以不可可以设置高度，遂放弃。</p><h2>总结：</h2><p style="line-height: 1;">其实除了上述两个问题比较棘手外，还有在使用"<span style="background-color: rgb(255, 255, 255); font-family: Consolas, "Courier New", monospace; white-space: pre; --darkreader-inline-bgcolor:#1e2122;" data-darkreader-inline-bgcolor="">HtmlEditor"时灰色蒙版等显示问题。只是上面两个问题最严重所以在此处记录下来了，目前位置，还是选择回到flutter HTML库中解决显示问题最现实。</span></p><p style="line-height: 1;"><span style="background-color: rgb(255, 255, 255); font-family: Consolas, "Courier New", monospace; white-space: pre; --darkreader-inline-bgcolor:#1e2122;" data-darkreader-inline-bgcolor="">不过我还是把我实现的代码放出来，以供各位给出新思路：</span></p><h2 style="line-height: 1;">代码：</h2><pre style="line-height: 1;"><p></p><pre><div style="color: rgb(212, 212, 212); background-color: rgb(30, 30, 30); font-family: Consolas, "Courier New", monospace; font-size: 14px; line-height: 1; --darkreader-inline-color:#fffaf3; --darkreader-inline-bgcolor:#1d1e1f;" data-darkreader-inline-color="" data-darkreader-inline-bgcolor=""><div style="line-height: 1;"><span style="color: rgb(86, 156, 214); --darkreader-inline-color:#78cdff;" data-darkreader-inline-color=""><br class="Apple-interchange-newline">import</span> <span style="color: rgb(206, 145, 120); --darkreader-inline-color:#ffb99a;" data-darkreader-inline-color="">'package:dio/dio.dart'</span>;</div><div style="line-height: 1;"><span style="color: rgb(86, 156, 214); --darkreader-inline-color:#78cdff;" data-darkreader-inline-color="">import</span> <span style="color: rgb(206, 145, 120); --darkreader-inline-color:#ffb99a;" data-darkreader-inline-color="">'package:flutter/material.dart'</span>;</div><div style="line-height: 1;"><span style="color: rgb(86, 156, 214); --darkreader-inline-color:#78cdff;" data-darkreader-inline-color="">import</span> <span style="color: rgb(206, 145, 120); --darkreader-inline-color:#ffb99a;" data-darkreader-inline-color="">'package:</span><span style="color: rgb(206, 145, 120); --darkreader-inline-color:#ffb99a;" data-darkreader-inline-color="">html_editor_enhanced</span><span style="color: rgb(206, 145, 120); --darkreader-inline-color:#ffb99a;" data-darkreader-inline-color="">/</span><span style="color: rgb(206, 145, 120); --darkreader-inline-color:#ffb99a;" data-darkreader-inline-color="">html_editor</span><span style="color: rgb(206, 145, 120); --darkreader-inline-color:#ffb99a;" data-darkreader-inline-color="">.dart'</span>;</div><br><div><span style="color: rgb(86, 156, 214); --darkreader-inline-color:#78cdff;" data-darkreader-inline-color="">import</span> <span style="color: rgb(206, 145, 120); --darkreader-inline-color:#ffb99a;" data-darkreader-inline-color="">'../compoents/rootappbar.dart'</span>;</div><br><div><span style="color: rgb(86, 156, 214); --darkreader-inline-color:#78cdff;" data-darkreader-inline-color="">class</span> <span style="color: rgb(78, 201, 176); --darkreader-inline-color:#73ffe4;" data-darkreader-inline-color="">NewArticle</span> <span style="color: rgb(86, 156, 214); --darkreader-inline-color:#78cdff;" data-darkreader-inline-color="">extends</span> <span style="color: rgb(78, 201, 176); --darkreader-inline-color:#73ffe4;" data-darkreader-inline-color="">StatefulWidget</span> {</div><div> <span style="color: rgb(86, 156, 214); --darkreader-inline-color:#78cdff;" data-darkreader-inline-color="">final</span> <span style="color: rgb(78, 201, 176); --darkreader-inline-color:#73ffe4;" data-darkreader-inline-color="">String</span> <span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">articleId</span>;</div><div> <span style="color: rgb(86, 156, 214); --darkreader-inline-color:#78cdff;" data-darkreader-inline-color="">const</span> <span style="color: rgb(78, 201, 176); --darkreader-inline-color:#73ffe4;" data-darkreader-inline-color="">NewArticle</span>(<span style="color: rgb(86, 156, 214); --darkreader-inline-color:#78cdff;" data-darkreader-inline-color="">this</span>.<span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">articleId</span>, {<span style="color: rgb(78, 201, 176); --darkreader-inline-color:#73ffe4;" data-darkreader-inline-color="">Key</span>? <span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">key</span>}) : <span style="color: rgb(86, 156, 214); --darkreader-inline-color:#78cdff;" data-darkreader-inline-color="">super</span>(<span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">key</span>: <span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">key</span>);</div><br><div> <span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">@</span><span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">override</span></div><div> <span style="color: rgb(78, 201, 176); --darkreader-inline-color:#73ffe4;" data-darkreader-inline-color="">_NewArticleState</span> <span style="color: rgb(220, 220, 170); --darkreader-inline-color:#ffffc7;" data-darkreader-inline-color="">createState</span>() => <span style="color: rgb(78, 201, 176); --darkreader-inline-color:#73ffe4;" data-darkreader-inline-color="">_NewArticleState</span>();</div><div>}</div><br><div><span style="color: rgb(86, 156, 214); --darkreader-inline-color:#78cdff;" data-darkreader-inline-color="">class</span> <span style="color: rgb(78, 201, 176); --darkreader-inline-color:#73ffe4;" data-darkreader-inline-color="">_NewArticleState</span> <span style="color: rgb(86, 156, 214); --darkreader-inline-color:#78cdff;" data-darkreader-inline-color="">extends</span> <span style="color: rgb(78, 201, 176); --darkreader-inline-color:#73ffe4;" data-darkreader-inline-color="">State</span><<span style="color: rgb(78, 201, 176); --darkreader-inline-color:#73ffe4;" data-darkreader-inline-color="">NewArticle</span>> {</div><div> <span style="color: rgb(106, 153, 85); --darkreader-inline-color:#a8dd90;" data-darkreader-inline-color="">// 新建监听对象控件</span></div><div> <span style="color: rgb(78, 201, 176); --darkreader-inline-color:#73ffe4;" data-darkreader-inline-color="">ScrollController</span> <span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">scrollController</span> = <span style="color: rgb(78, 201, 176); --darkreader-inline-color:#73ffe4;" data-darkreader-inline-color="">ScrollController</span>();</div><br><div> <span style="color: rgb(106, 153, 85); --darkreader-inline-color:#a8dd90;" data-darkreader-inline-color="">// 新增 文章内容的 富文本编辑器</span></div><div> <span style="color: rgb(86, 156, 214); --darkreader-inline-color:#78cdff;" data-darkreader-inline-color="">final</span> <span style="color: rgb(78, 201, 176); --darkreader-inline-color:#73ffe4;" data-darkreader-inline-color="">HtmlEditorController</span> <span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">_contentController</span> = <span style="color: rgb(78, 201, 176); --darkreader-inline-color:#73ffe4;" data-darkreader-inline-color="">HtmlEditorController</span>();</div><br><div> <span style="color: rgb(106, 153, 85); --darkreader-inline-color:#a8dd90;" data-darkreader-inline-color="">// 创建对象 承接 正确的请求数据</span></div><div> <span style="color: rgb(78, 201, 176); --darkreader-inline-color:#73ffe4;" data-darkreader-inline-color="">dynamic</span> <span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">content</span>;</div><br><div> <span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">@</span><span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">override</span></div><div> <span style="color: rgb(86, 156, 214); --darkreader-inline-color:#78cdff;" data-darkreader-inline-color="">void</span> <span style="color: rgb(220, 220, 170); --darkreader-inline-color:#ffffc7;" data-darkreader-inline-color="">initState</span>() {</div><div> <span style="color: rgb(86, 156, 214); --darkreader-inline-color:#78cdff;" data-darkreader-inline-color="">super</span>.<span style="color: rgb(220, 220, 170); --darkreader-inline-color:#ffffc7;" data-darkreader-inline-color="">initState</span>();</div><div> <span style="color: rgb(220, 220, 170); --darkreader-inline-color:#ffffc7;" data-darkreader-inline-color="">getarticle</span>();</div><div> }</div><br><div> <span style="color: rgb(86, 156, 214); --darkreader-inline-color:#78cdff;" data-darkreader-inline-color="">void</span> <span style="color: rgb(220, 220, 170); --darkreader-inline-color:#ffffc7;" data-darkreader-inline-color="">getarticle</span>() <span style="color: rgb(197, 134, 192); --darkreader-inline-color:#f8aaf1;" data-darkreader-inline-color="">async</span> {</div><div> <span style="color: rgb(78, 201, 176); --darkreader-inline-color:#73ffe4;" data-darkreader-inline-color="">String</span> <span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">Url</span> = <span style="color: rgb(206, 145, 120); --darkreader-inline-color:#ffb99a;" data-darkreader-inline-color="">"http://url</span><span style="color: rgb(206, 145, 120); --darkreader-inline-color:#ffb99a;" data-darkreader-inline-color="">"</span>;</div><div> <span style="color: rgb(78, 201, 176); --darkreader-inline-color:#73ffe4;" data-darkreader-inline-color="">Dio</span> <span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">_dio</span> = <span style="color: rgb(78, 201, 176); --darkreader-inline-color:#73ffe4;" data-darkreader-inline-color="">Dio</span>();</div><div> <span style="color: rgb(197, 134, 192); --darkreader-inline-color:#f8aaf1;" data-darkreader-inline-color="">try</span> {</div><div> <span style="color: rgb(78, 201, 176); --darkreader-inline-color:#73ffe4;" data-darkreader-inline-color="">Response</span> <span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">_resp</span> = <span style="color: rgb(197, 134, 192); --darkreader-inline-color:#f8aaf1;" data-darkreader-inline-color="">await</span> <span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">_dio</span>.<span style="color: rgb(220, 220, 170); --darkreader-inline-color:#ffffc7;" data-darkreader-inline-color="">get</span>(<span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">Url</span>);</div><div> <span style="color: rgb(197, 134, 192); --darkreader-inline-color:#f8aaf1;" data-darkreader-inline-color="">if</span> (<span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">_resp</span>.<span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">statusCode</span> == <span style="color: rgb(181, 206, 168); --darkreader-inline-color:#dbfcc9;" data-darkreader-inline-color="">200</span>) {</div><div> <span style="color: rgb(220, 220, 170); --darkreader-inline-color:#ffffc7;" data-darkreader-inline-color="">setState</span>(() {</div><div> <span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">content</span> = <span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">_resp</span>.<span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">data</span>;</div><div> });</div><div> } <span style="color: rgb(197, 134, 192); --darkreader-inline-color:#f8aaf1;" data-darkreader-inline-color="">else</span> {</div><div> <span style="color: rgb(197, 134, 192); --darkreader-inline-color:#f8aaf1;" data-darkreader-inline-color="">throw</span> <span style="color: rgb(206, 145, 120); --darkreader-inline-color:#ffb99a;" data-darkreader-inline-color="">"状态码错误"</span>;</div><div> }</div><div> } <span style="color: rgb(197, 134, 192); --darkreader-inline-color:#f8aaf1;" data-darkreader-inline-color="">catch</span> (<span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">e</span>) {</div><div> <span style="color: rgb(220, 220, 170); --darkreader-inline-color:#ffffc7;" data-darkreader-inline-color="">print</span>(<span style="color: rgb(206, 145, 120); --darkreader-inline-color:#ffb99a;" data-darkreader-inline-color="">"请求错误"</span> + <span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">e</span>.<span style="color: rgb(220, 220, 170); --darkreader-inline-color:#ffffc7;" data-darkreader-inline-color="">toString</span>());</div><div> }</div><div> }</div><br><div> <span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">@</span><span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">override</span></div><div> <span style="color: rgb(78, 201, 176); --darkreader-inline-color:#73ffe4;" data-darkreader-inline-color="">Widget</span> <span style="color: rgb(220, 220, 170); --darkreader-inline-color:#ffffc7;" data-darkreader-inline-color="">build</span>(<span style="color: rgb(78, 201, 176); --darkreader-inline-color:#73ffe4;" data-darkreader-inline-color="">BuildContext</span> <span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">context</span>) {</div><div> <span style="color: rgb(197, 134, 192); --darkreader-inline-color:#f8aaf1;" data-darkreader-inline-color="">return</span> <span style="color: rgb(78, 201, 176); --darkreader-inline-color:#73ffe4;" data-darkreader-inline-color="">Scaffold</span>(</div><div> <span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">appBar</span>: <span style="color: rgb(78, 201, 176); --darkreader-inline-color:#73ffe4;" data-darkreader-inline-color="">TopAppbar</span>(<span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">context</span>),</div><div> <span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">body</span>: <span style="color: rgb(78, 201, 176); --darkreader-inline-color:#73ffe4;" data-darkreader-inline-color="">SingleChildScrollView</span>(</div><div> <span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">controller</span>: <span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">scrollController</span>,</div><div> <span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">child</span>: <span style="color: rgb(78, 201, 176); --darkreader-inline-color:#73ffe4;" data-darkreader-inline-color="">Center</span>(</div><div> <span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">child</span>: <span style="color: rgb(78, 201, 176); --darkreader-inline-color:#73ffe4;" data-darkreader-inline-color="">Column</span>(<span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">children</span>: [</div><div> </div><div> <span style="color: rgb(78, 201, 176); --darkreader-inline-color:#73ffe4;" data-darkreader-inline-color="">Container</span>(</div><div> <span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">padding</span>: <span style="color: rgb(86, 156, 214); --darkreader-inline-color:#78cdff;" data-darkreader-inline-color="">const</span> <span style="color: rgb(78, 201, 176); --darkreader-inline-color:#73ffe4;" data-darkreader-inline-color="">EdgeInsets</span>.<span style="color: rgb(220, 220, 170); --darkreader-inline-color:#ffffc7;" data-darkreader-inline-color="">only</span>(<span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">top</span>: <span style="color: rgb(181, 206, 168); --darkreader-inline-color:#dbfcc9;" data-darkreader-inline-color="">0</span>, <span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">bottom</span>: <span style="color: rgb(181, 206, 168); --darkreader-inline-color:#dbfcc9;" data-darkreader-inline-color="">5</span>),</div><div> <span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">width</span>: <span style="color: rgb(181, 206, 168); --darkreader-inline-color:#dbfcc9;" data-darkreader-inline-color="">1200</span>,</div><div> <span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">child</span>: <span style="color: rgb(78, 201, 176); --darkreader-inline-color:#73ffe4;" data-darkreader-inline-color="">HtmlEditor</span>(</div><div> <span style="color: rgb(106, 153, 85); --darkreader-inline-color:#a8dd90;" data-darkreader-inline-color="">// 控制器</span></div><div> <span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">controller</span>: <span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">_contentController</span>,</div><div> <span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">htmlEditorOptions</span>: <span style="color: rgb(78, 201, 176); --darkreader-inline-color:#73ffe4;" data-darkreader-inline-color="">HtmlEditorOptions</span>(</div><div> <span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">autoAdjustHeight</span>: <span style="color: rgb(86, 156, 214); --darkreader-inline-color:#78cdff;" data-darkreader-inline-color="">false</span>,</div><div> <span style="color: rgb(106, 153, 85); --darkreader-inline-color:#a8dd90;" data-darkreader-inline-color="">// hint: "Your Content typr here",</span></div><div> <span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">shouldEnsureVisible</span>: <span style="color: rgb(86, 156, 214); --darkreader-inline-color:#78cdff;" data-darkreader-inline-color="">true</span>,</div><div> <span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">initialText</span>: <span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">content</span>[<span style="color: rgb(206, 145, 120); --darkreader-inline-color:#ffb99a;" data-darkreader-inline-color="">"content"</span>],</div><div> ),</div><div> <span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">callbacks</span>:</div><div> <span style="color: rgb(106, 153, 85); --darkreader-inline-color:#a8dd90;" data-darkreader-inline-color="">// 完全禁用编辑功能</span></div><div> <span style="color: rgb(78, 201, 176); --darkreader-inline-color:#73ffe4;" data-darkreader-inline-color="">Callbacks</span>(<span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">onInit</span>: () => <span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">_contentController</span>.<span style="color: rgb(220, 220, 170); --darkreader-inline-color:#ffffc7;" data-darkreader-inline-color="">disable</span>()),</div><br><div> <span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">htmlToolbarOptions</span>: <span style="color: rgb(86, 156, 214); --darkreader-inline-color:#78cdff;" data-darkreader-inline-color="">const</span> <span style="color: rgb(78, 201, 176); --darkreader-inline-color:#73ffe4;" data-darkreader-inline-color="">HtmlToolbarOptions</span>(</div><div> <span style="color: rgb(106, 153, 85); --darkreader-inline-color:#a8dd90;" data-darkreader-inline-color="">// 移除 工具栏， 在其他地方进行显示设置</span></div><div> <span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">toolbarPosition</span>: <span style="color: rgb(78, 201, 176); --darkreader-inline-color:#73ffe4;" data-darkreader-inline-color="">ToolbarPosition</span>.<span style="color: rgb(79, 193, 255); --darkreader-inline-color:#65f3ff;" data-darkreader-inline-color="">custom</span>),</div><div> ),</div><div> ),</div><div> <span style="color: rgb(106, 153, 85); --darkreader-inline-color:#a8dd90;" data-darkreader-inline-color="">// 此处进行 放置 HtmlEditor 的工具栏， 使用 Offstage 让其以为消失不见</span></div><div> <span style="color: rgb(78, 201, 176); --darkreader-inline-color:#73ffe4;" data-darkreader-inline-color="">Offstage</span>(</div><div> <span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">offstage</span>: <span style="color: rgb(86, 156, 214); --darkreader-inline-color:#78cdff;" data-darkreader-inline-color="">true</span>,</div><div> <span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">child</span>: <span style="color: rgb(78, 201, 176); --darkreader-inline-color:#73ffe4;" data-darkreader-inline-color="">ToolbarWidget</span>(</div><div> <span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">controller</span>: <span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">_contentController</span>,</div><div> <span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">htmlToolbarOptions</span>: <span style="color: rgb(86, 156, 214); --darkreader-inline-color:#78cdff;" data-darkreader-inline-color="">const</span> <span style="color: rgb(78, 201, 176); --darkreader-inline-color:#73ffe4;" data-darkreader-inline-color="">HtmlToolbarOptions</span>(</div><div> <span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">toolbarPosition</span>: <span style="color: rgb(78, 201, 176); --darkreader-inline-color:#73ffe4;" data-darkreader-inline-color="">ToolbarPosition</span></div><div> .<span style="color: rgb(79, 193, 255); --darkreader-inline-color:#65f3ff;" data-darkreader-inline-color="">custom</span>, <span style="color: rgb(106, 153, 85); --darkreader-inline-color:#a8dd90;" data-darkreader-inline-color="">//required to place toolbar anywhere!</span></div><div> <span style="color: rgb(106, 153, 85); --darkreader-inline-color:#a8dd90;" data-darkreader-inline-color="">//other options</span></div><div> ),</div><div> <span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">callbacks</span>:</div><div> <span style="color: rgb(78, 201, 176); --darkreader-inline-color:#73ffe4;" data-darkreader-inline-color="">Callbacks</span>(<span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">onInit</span>: () => <span style="color: rgb(156, 220, 254); --darkreader-inline-color:#a9ffff;" data-darkreader-inline-color="">_contentController</span>.<span style="color: rgb(220, 220, 170); --darkreader-inline-color:#ffffc7;" data-darkreader-inline-color="">disable</span>()),</div><div> ),</div><div> ),</div><div> ]),</div><div> )),</div><div> );</div><div> }</div><div>}</div></div></pre></pre>
""";
@override
Widget build(BuildContext context) {
return Scaffold(
body: SingleChildScrollView(
child: Center(
child: Column(
mainAxisSize: MainAxisSize.min,
children: <Widget> [
Container(
// padding: const EdgeInsets.symmetric(vertical: 0, horizontal: 45.0),
width: 1000,
child: const Divider(height:5,color: Colors.grey, thickness: 2, ),
),
SizedBox(width: 1000,
child: Html(
data: tt,
onLinkTap: (url, _, __, ___) {
// ignore: deprecated_member_use
if (url != null) launch(url);
},
style: {
"p": Style(
fontStyle: FontStyle.italic,
fontSize: const FontSize(16),
color: Colors.grey[600],
margin: EdgeInsets.zero,
lineHeight:const LineHeight(2)
)
},
),)
],
))
));
}
}
error: ══╡ EXCEPTION CAUGHT BY RENDERING LIBRARY ╞═════════════════════════════════════════════════════════ The following IndexError was thrown during performLayout(): RangeError (index): Index out of range: index must not be negative: -1
The relevant error-causing widget was: Text Text:file:///D:/Program%20Files/flutter/.pub-cache/hosted/pub.dartlang.org/flutter_html-2.2.1/lib/html_parser.dart:1124:19
When the exception was thrown, this was the stack:
C:/b/s/w/ir/cache/builder/src/out/host_debug/dart-sdk/lib/internal/js_dev_runtime/private/ddc_runtime/errors.dart 251:49 throw
C:/b/s/w/ir/cache/builder/src/out/host_debug/dart-sdk/lib/_internal/js_dev_runtime/private/js_array.dart 117:56 removeLast]
C:/b/s/w/ir/cache/builder/src/out/host_debug/flutter_web_sdk/lib/_engine/engine/text/layout_service.dart 1263:49 [_popSegment]
C:/b/s/w/ir/cache/builder/src/out/host_debug/flutter_web_sdk/lib/_engine/engine/text/layout_service.dart 1402:7 revertToLastBreakOpportunity
C:/b/s/w/ir/cache/builder/src/out/host_debug/flutter_web_sdk/lib/_engine/engine/text/layout_service.dart 170:24 performLayout
C:/b/s/w/ir/cache/builder/src/out/host_debug/flutter_web_sdk/lib/_engine/engine/text/canvas_paragraph.dart 99:20 layout
packages/flutter/src/painting/text_painter.dart 608:5 [_layoutParagraph]
packages/flutter/src/painting/text_painter.dart 655:5 layout
packages/flutter/src/rendering/paragraph.dart 498:18 [_layoutText]
packages/flutter/src/rendering/paragraph.dart 521:5 [_layoutTextWithConstraints]
packages/flutter/src/rendering/paragraph.dart 634:5 performLayout
packages/flutter/src/rendering/object.dart 1915:7 layout
packages/flutter/src/rendering/proxy_box.dart 277:7 performLayout
packages/flutter/src/rendering/object.dart 1915:7 layout
packages/flutter/src/rendering/shifted_box.dart 437:7 performLayout
packages/flutter/src/rendering/object.dart 1915:7 layout
packages/flutter/src/rendering/proxy_box.dart 116:7 performLayout
packages/flutter/src/rendering/object.dart 1915:7 layout
packages/flutter/src/rendering/shifted_box.dart 233:5 performLayout
packages/flutter/src/rendering/object.dart 1915:7 layout
packages/flutter/src/rendering/proxy_box.dart 116:7 performLayout
packages/flutter/src/rendering/object.dart 1915:7 layout
packages/flutter/src/rendering/paragraph.dart 546:14 [_layoutChildren]
packages/flutter/src/rendering/paragraph.dart 633:30 performLayout
packages/flutter/src/rendering/object.dart 1915:7 layout
packages/flutter/src/rendering/proxy_box.dart 277:7 performLayout
packages/flutter/src/rendering/object.dart 1915:7 layout
packages/flutter/src/rendering/shifted_box.dart 437:7 performLayout
packages/flutter/src/rendering/object.dart 1915:7 layout
packages/flutter/src/rendering/proxy_box.dart 116:7 performLayout
packages/flutter/src/rendering/object.dart 1915:7 layout
packages/flutter/src/rendering/shifted_box.dart 233:5 performLayout
packages/flutter/src/rendering/object.dart 1915:7 layout
packages/flutter/src/rendering/proxy_box.dart 116:7 performLayout
packages/flutter/src/rendering/object.dart 1915:7 layout
packages/flutter/src/rendering/paragraph.dart 546:14 [_layoutChildren]
packages/flutter/src/rendering/paragraph.dart 633:30 performLayout
packages/flutter/src/rendering/object.dart 1915:7 layout
packages/flutter/src/rendering/proxy_box.dart 277:7 performLayout
packages/flutter/src/rendering/object.dart 1915:7 layout
packages/flutter/src/rendering/shifted_box.dart 437:7 performLayout
packages/flutter/src/rendering/object.dart 1915:7 layout
packages/flutter/src/rendering/proxy_box.dart 116:7 performLayout
packages/flutter/src/rendering/object.dart 1915:7 layout
packages/flutter/src/rendering/proxy_box.dart 116:7 performLayout
packages/flutter/src/rendering/object.dart 1915:7 layout
packages/flutter/src/rendering/paragraph.dart 546:14 [_layoutChildren]
packages/flutter/src/rendering/paragraph.dart 633:30 performLayout
packages/flutter/src/rendering/object.dart 1915:7 layout
packages/flutter/src/rendering/proxy_box.dart 277:7 performLayout
packages/flutter/src/rendering/object.dart 1915:7 layout
packages/flutter/src/rendering/proxy_box.dart 277:7 performLayout
packages/flutter/src/rendering/object.dart 1915:7 layout
packages/flutter/src/rendering/proxy_box.dart 277:7 performLayout
packages/flutter/src/rendering/object.dart 1915:7 layout
packages/flutter/src/rendering/layout_helper.dart 56:10 layoutChild
packages/flutter/src/rendering/flex.dart 829:43 [_computeSizes]
packages/flutter/src/rendering/flex.dart 931:32 performLayout
packages/flutter/src/rendering/object.dart 1915:7 layout
packages/flutter/src/rendering/shifted_box.dart 437:7 performLayout
packages/flutter/src/rendering/object.dart 1915:7 layout
packages/flutter/src/widgets/single_child_scroll_view.dart 513:7 performLayout
packages/flutter/src/rendering/object.dart 1915:7 layout
packages/flutter/src/rendering/proxy_box.dart 116:7 performLayout
packages/flutter/src/rendering/object.dart 1915:7 layout
packages/flutter/src/rendering/proxy_box.dart 116:7 performLayout
packages/flutter/src/rendering/object.dart 1915:7 layout
packages/flutter/src/rendering/proxy_box.dart 116:7 performLayout
packages/flutter/src/rendering/object.dart 1915:7 layout
packages/flutter/src/rendering/proxy_box.dart 116:7 performLayout
packages/flutter/src/rendering/object.dart 1915:7 layout
packages/flutter/src/rendering/proxy_box.dart 116:7 performLayout
packages/flutter/src/rendering/object.dart 1915:7 layout
packages/flutter/src/rendering/proxy_box.dart 116:7 performLayout
packages/flutter/src/rendering/object.dart 1915:7 layout
packages/flutter/src/rendering/proxy_box.dart 116:7 performLayout
packages/flutter/src/rendering/object.dart 1915:7 layout
packages/flutter/src/rendering/proxy_box.dart 116:7 performLayout
packages/flutter/src/rendering/custom_paint.dart 545:11 performLayout
packages/flutter/src/rendering/object.dart 1915:7 layout
packages/flutter/src/rendering/proxy_box.dart 116:7 performLayout
packages/flutter/src/rendering/object.dart 1915:7 layout
packages/flutter/src/rendering/proxy_box.dart 116:7 performLayout
packages/flutter/src/rendering/object.dart 1915:7 layout
packages/flutter/src/rendering/proxy_box.dart 116:7 performLayout
packages/flutter/src/rendering/object.dart 1915:7 layout
packages/flutter/src/rendering/proxy_box.dart 116:7 performLayout
packages/flutter/src/rendering/object.dart 1915:7 layout
packages/flutter/src/rendering/custom_layout.dart 171:10 layoutChild
packages/flutter/src/material/scaffold.dart 1003:7 performLayout
packages/flutter/src/rendering/custom_layout.dart 240:7 [_callPerformLayout]
packages/flutter/src/rendering/custom_layout.dart 403:14 performLayout
packages/flutter/src/rendering/object.dart 1757:7 [_layoutWithoutResize]
packages/flutter/src/rendering/object.dart 887:17 flushLayout
packages/flutter/src/rendering/binding.dart 504:19 drawFrame
packages/flutter/src/widgets/binding.dart 892:13 drawFrame
packages/flutter/src/rendering/binding.dart 370:5 [_handlePersistentFrameCallback]
packages/flutter/src/scheduler/binding.dart 1146:15 [_invokeFrameCallback]
packages/flutter/src/scheduler/binding.dart 1083:9 handleDrawFrame
packages/flutter/src/scheduler/binding.dart 997:5 [_handleDrawFrame]
C:/b/s/w/ir/cache/builder/src/out/host_debug/flutter_web_sdk/lib/_engine/engine/platform_dispatcher.dart 1090:13 invoke
C:/b/s/w/ir/cache/builder/src/out/host_debug/flutter_web_sdk/lib/_engine/engine/platform_dispatcher.dart 160:5 invokeOnDrawFrame
C:/b/s/w/ir/cache/builder/src/out/host_debug/flutter_web_sdk/lib/_engine/engine/initialization.dart 194:45
The following RenderObject was being processed when the exception was fired: RenderParagraph#98cae relayoutBoundary=up36 NEEDS-LAYOUT NEEDS-PAINT
NEEDS-COMPOSITING-BITS-UPDATE:
creator: RichText ← Text ← SizedBox ← StyledText ← Align ← DecoratedBox ← Padding ← Container ←
ContainerSpan ← Semantics ← RichText ← Text ← ⋯
parentData:
