daohoangson
Is there any way to get rid of HeightPlaceholder?
I don't need the HeightPlaceholder for each after my rendered widgets, is there any way to remove HeightPlaceholder from the column?
That widget renders the spacing between paragraphs. Why do you want to remove it?
I need to customize the content that I got from the web, is there any way to just set the HeightPlaceholder height into 0 or even get rid of it completely? Thank you
The height placeholder is a fairly integrated part of the rendering pipeline so it's not possible to control from outside. Can you share your HTML and describe how you want to change the rendering?
I see, is it okay if I fork the library and then customize it thru it? If it is okay, can you walk me thru on how to fork the library and use it in my project?
@daohoangson I got the same issue. Trying to migrate from flutter_html to flutter_widget_from_html_core
This is flutter_html output:
This is flutter_widget_from_html_core output:
Is there a way to remove HeightPlaceholder?
I have a customWidgetBuilder with extra tags, if that matters
What is the HtmlWidget configuration? It shouldn't render new line for that HTML.
What is the
HtmlWidgetconfiguration? It shouldn't render new line for that HTML.
Here is my config:
HtmlWidget(
body,
onTapUrl: (url) {
_onLinkTap(context, url, {});
return true;
},
customStylesBuilder: (element) {
if (element.localName == 'a') {
return {
'color': my.theme.linkColor.toHex(),
'text-decoration-line': 'none',
};
}
return null;
},
customWidgetBuilder: (element) {
if (element.localName == 'span') {
final attrs = element.attributes;
switch (attrs['class']) {
case 'unkfunc':
return Text(
element.text,
style: TextStyle(
color: my.theme.quoteColor,
fontSize: postFontSize,
fontWeight: my.prefs.fontWeight,
),
);
case 'quote':
return BlockQuote(
text: element.text,
postFontSize: postFontSize,
);
case 'spoiler':
return Spoiler(
text: element.text,
postFontSize: postFontSize,
onTap: () => _maybeOpenUrl(element.text, context),
);
case 's':
return Text(
element.text,
style: TextStyle(
color: postFontColor,
decoration: TextDecoration.lineThrough,
fontSize: postFontSize,
fontWeight: my.prefs.fontWeight,
),
);
case 'u':
return Text(
element.text,
style: TextStyle(
color: postFontColor,
decoration: TextDecoration.underline,
fontSize: postFontSize,
fontWeight: my.prefs.fontWeight,
),
);
default:
return null;
}
}
return null;
},
textStyle: TextStyle(
color: postFontColor,
fontSize: postFontSize,
fontWeight: my.prefs.fontWeight,
),
),
Your customWidgetBuilder is returning the whole Text widget so each SPAN is rendered in its own line; then the BR is processed and another new line is added -> the final result is each piece of text has 2 new line characters.
For your use case, it's recommended to use customStylesBuilder to map the CSS class to stylings. Something like https://try.fwfh.dev/?id=320378a33b13a3b936404f297a1c1cba
@daohoangson thanks for your answer! However, customStylesBuilder doesnt fit for my needs because I need to add a gesture detector for some stuff like spoiler tag and blockquote tag.
I think I'll stick to flutter_html for now
Is it possible to intercept specific tags to customize them, and then display other tags as default
You can use customWidgetBuilder to do that. For even greater control, override the WidgetFactory.