Sub6Resources / flutter_html

A Flutter widget for rendering static html as Flutter widgets (Will render over 80 different html tags!)
https://pub.dev/packages/flutter_html
MIT License
1.8k stars 876 forks source link

How to use ImageExtension ? #1409

Open zxl777 opened 10 months ago

zxl777 commented 10 months ago

I previously added rounded corners to <img> tags in an older version of flutter_html, but how should I achieve the same effect with the new ImageExtension?

                    customRender: {
                      'img': (context, child) {
                        return ClipRRect(
                          borderRadius: BorderRadius.circular(5.0),
                          child: (context.tree as ImageContentElement).toWidget(context),
                        );
                      }
                    }
azeunkn0wn commented 6 months ago

Try this:

 ImageExtension(
     builder: (extensionContext) {
          final element = extensionContext.styledElement as ImageElement;

          return ClipRRect(
              borderRadius: BorderRadius.circular(5.0),                         
              child: Image.network(
                  element.src,
                ),
              );
            },
          ),
leeparayno commented 4 months ago

In current 3.0.0-beta.2 ImageElement is not defined for me. What is the current status of img tag?

ilikerobots commented 3 months ago

A bit hacky, but you can cast styledElement to dynamic: final url = (extensionContext.styledElement as dynamic).src;