Skip to content

Commit 135316f

Browse files
committed
Re-add support for onImageError and onImageTap and fix issues with images inside of links
1 parent 85a2840 commit 135316f

File tree

6 files changed

+192
-87
lines changed

6 files changed

+192
-87
lines changed

example/lib/main.dart

Lines changed: 29 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import 'package:flutter/gestures.dart';
12
import 'package:flutter/material.dart';
23
import 'package:flutter_html/flutter_html.dart';
34
import 'package:flutter_html/html_parser.dart';
@@ -13,6 +14,7 @@ class MyApp extends StatelessWidget {
1314
title: 'Flutter Demo',
1415
theme: new ThemeData(
1516
primarySwatch: Colors.blue,
17+
brightness: Brightness.dark,
1618
),
1719
home: new MyHomePage(title: 'flutter_html Example'),
1820
);
@@ -35,15 +37,18 @@ const htmlData = """
3537
<h4>Header 4</h4>
3638
<h5>Header 5</h5>
3739
<h6>Header 6</h6>
40+
<h3>Ruby Support:</h3>
3841
<p>
3942
<ruby>
4043
漢<rt>かん</rt>
4144
字<rt>じ</rt>
4245
</ruby>
43-
&nbsp;is Japanese Kanji
46+
&nbsp;is Japanese Kanji.
4447
</p>
48+
<h3>Support for <code>sub</code>/<code>sup</code></h3>
4549
Solve for <var>x<sub>n</sub></var>: log<sub>2</sub>(<var>x</var><sup>2</sup>+<var>n</var>) = 9<sup>3</sup>
46-
<p>One of the most common equations in all of physics is <var>E</var>=<var>m</var><var>c</var><sup>2</sup>.<p>
50+
<p>One of the most common equations in all of physics is <var>E</var>=<var>m</var><var>c</var><sup>2</sup>.</p>
51+
<h3>Table support:</h3>
4752
<table>
4853
<colgroup>
4954
<col width="50%" />
@@ -65,12 +70,16 @@ const htmlData = """
6570
<tr><td>fData</td><td>fData</td><td>fData</td></tr>
6671
</tfoot>
6772
</table>
73+
<h3>Custom Element Support:</h3>
6874
<flutter></flutter>
75+
<flutter horizontal></flutter>
76+
<h3>SVG support:</h3>
6977
<svg id='svg1' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'>
7078
<circle r="32" cx="35" cy="65" fill="#F00" opacity="0.5"/>
7179
<circle r="32" cx="65" cy="65" fill="#0F0" opacity="0.5"/>
7280
<circle r="32" cx="50" cy="35" fill="#00F" opacity="0.5"/>
7381
</svg>
82+
<h3>List support:</h3>
7483
<ol>
7584
<li>This</li>
7685
<li><p>is</p></li>
@@ -94,6 +103,21 @@ const htmlData = """
94103
<li><h2>Header 2</h2></li>
95104
<h2><li>Header 2</li></h2>
96105
</ol>
106+
<h3>Link support:</h3>
107+
<p>
108+
Linking to <a href='https://github.com'>websites</a> has never been easier.
109+
</p>
110+
<h3>Image support:</h3>
111+
<p>
112+
<img alt='Google' src='https://www.google.com/images/branding/googlelogo/2x/googlelogo_color_92x30dp.png' />
113+
<a href='https://google.com'><img alt='Google' src='https://www.google.com/images/branding/googlelogo/2x/googlelogo_color_92x30dp.png' /></a>
114+
<img alt='Alt Text of an intentionally broken image' src='https://www.google.com/images/branding/googlelogo/2x/googlelogo_color_92x30d' />
115+
</p>
116+
<h3>Video support:</h3>
117+
<h3>Audio support:</h3>
118+
<h3>IFrame support:</h3>
119+
120+
97121
""";
98122

99123
class _MyHomePageState extends State<MyHomePage> {
@@ -113,21 +137,6 @@ class _MyHomePageState extends State<MyHomePage> {
113137
backgroundColor: Colors.black,
114138
color: Colors.white,
115139
),
116-
"a": Style(
117-
color: Colors.red,
118-
),
119-
"li": Style(
120-
// backgroundColor: Colors.red,
121-
// fontSize: FontSize(20),
122-
// margin: const EdgeInsets.only(top: 32),
123-
),
124-
"h1, h3, h5": Style(
125-
// backgroundColor: Colors.deepPurple,
126-
// alignment: Alignment.center,
127-
),
128-
"#whitespace": Style(
129-
backgroundColor: Colors.deepPurple,
130-
),
131140
"table": Style(
132141
backgroundColor: Color.fromARGB(0x50, 0xee, 0xee, 0xee),
133142
),
@@ -140,7 +149,6 @@ class _MyHomePageState extends State<MyHomePage> {
140149
),
141150
"td": Style(
142151
padding: EdgeInsets.all(6),
143-
backgroundColor: Colors.transparent,
144152
),
145153
"var": Style(fontFamily: 'serif'),
146154
},
@@ -161,19 +169,12 @@ class _MyHomePageState extends State<MyHomePage> {
161169
onImageTap: (src) {
162170
print(src);
163171
},
172+
onImageError: (exception, stackTrace) {
173+
print(exception);
174+
},
164175
),
165176
),
166177
),
167-
Expanded(
168-
child: SingleChildScrollView(
169-
child: Text(
170-
HtmlParser.cleanTree(HtmlParser.applyCSS(
171-
HtmlParser.lexDomTree(HtmlParser.parseHTML(htmlData), [], []), null))
172-
.toString(),
173-
style: TextStyle(fontFamily: 'monospace'),
174-
),
175-
),
176-
)
177178
],
178179
),
179180
),

lib/flutter_html.dart

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,7 @@ class Html extends StatelessWidget {
2828
color: Colors.blueAccent,
2929
decorationColor: Colors.blueAccent),
3030
this.shrinkToFit = false,
31-
this.imageProperties,
31+
@deprecated this.imageProperties,
3232
this.onImageTap,
3333
@deprecated this.showImages = true,
3434
this.blacklistedElements = const [],
@@ -40,7 +40,7 @@ class Html extends StatelessWidget {
4040
final EdgeInsetsGeometry padding;
4141
final Color backgroundColor;
4242
final TextStyle defaultTextStyle;
43-
final OnLinkTap onLinkTap;
43+
final OnTap onLinkTap;
4444
final bool renderNewlines;
4545
final double blockSpacing;
4646
final bool useRichText;
@@ -50,7 +50,7 @@ class Html extends StatelessWidget {
5050

5151
/// Properties for the Image widget that gets rendered by the rich text parser
5252
final ImageProperties imageProperties;
53-
final OnImageTap onImageTap;
53+
final OnTap onImageTap;
5454
final bool showImages;
5555

5656
final List<String> blacklistedElements;
@@ -101,6 +101,8 @@ class Html extends StatelessWidget {
101101
htmlData: data,
102102
cssData: css,
103103
onLinkTap: onLinkTap,
104+
onImageTap: onImageTap,
105+
onImageError: onImageError,
104106
style: style,
105107
customRender: customRender,
106108
blacklistedElements: blacklistedElements,

0 commit comments

Comments
 (0)