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.76k stars 815 forks source link

can't take <a> tag link from image . it renders only image link on browser . but my <img> contains one anchor i wants to render it #621

Closed maheshwaran-p closed 3 years ago

tneotia commented 3 years ago

I'm guessing your HTML looks something like this?

<a href="default.asp"><img src="smiley.gif" alt="HTML tutorial" style="width:42px;height:42px;"></a>
maheshwaran-p commented 3 years ago

my html.

maheshwaran-p commented 3 years ago

anchor tag placed into my img tag

tneotia commented 3 years ago

Okay, based on what I can see via Inspect Element your html code is this:

<a href="https://bidder3-useast.c1exchange.com/redirect/exchange=c1xus/ad_id=2248/creative_id=4512/bid_id=ac343797-733f-4258-ae3c-a5f6206e44c3/site_domain=junk1.com?url=https://www.c1exchange.com/careers" rel="nofollow"><img src="https://camo.githubusercontent.com/26558a078d7765a129925a4c20d81bb84c66316cf72839a155b9fc578e298d58/68747470733a2f2f6331782e73332d75732d776573742d322e616d617a6f6e6177732e636f6d2f6164732f686f7573652f62616e6e65723732387839302f3732387839302b41642e706e67" width="728" height="90" data-canonical-src="https://c1x.s3-us-west-2.amazonaws.com/ads/house/banner728x90/728x90+Ad.png" style="max-width:100%;">  </a>

How does flutter_html render it? I don't have my device to test it right now.

maheshwaran-p commented 3 years ago

[ ![git](https://user-images.githubusercontent.com/62535697/114597488-af244b80-9c45-11eb-8f83-19d1488ed93e.png) ](url)

maheshwaran-p commented 3 years ago

see this url . i have shown ads like this .

tneotia commented 3 years ago

Hm your screenshot looks almost exactly like the image from the earlier comment. Let me go home and try your html in the app and see what the issue is.

maheshwaran-p commented 3 years ago

ok. help me please.

tneotia commented 3 years ago

It appears correctly in the plugin:

image

See how the browser renders your code:

image

They look the same. Maybe I am misunderstanding your issue?

maheshwaran-p commented 3 years ago

yes appearance correct but while click in image from flutter it will render again same image in browser . but i wants to render anchor tag link for image click.

tneotia commented 3 years ago

Oh then you need to ignore on image tap and just listen on link tap.

maheshwaran-p commented 3 years ago

yes help me

maheshwaran-p commented 3 years ago

while i click on image i want link tap function

tneotia commented 3 years ago

I don't know what your Html widget code looks like but just switch onImageTap parameter to onLinkTap and it should work.

maheshwaran-p commented 3 years ago

maheshwaran-p commented 3 years ago

i wants to render this html anchor tag while click on imag tag.

maheshwaran-p commented 3 years ago

tneotia commented 3 years ago

Yes, so if your html code is like this:

<a href="your_url"><img src="your_image_url" /></a>

and you want to open your_url rather than your_image_url, then in Dart:

Html(
   data: htmlData,
   onLinkTap: (url, _, __, ___) {
      // use URL launcher to open the link href
      // the image href will be ignored
   }
);
tneotia commented 3 years ago

@erickok I think this can be closed.