How do I display a local image file? about flutter_tex HOT 10 CLOSED

This time you can use
<img src="http://localhost:5353/assets/app_icon.png"> <br>
Just use port 5353 instead of 8080 but it's not a permanent fix, I'll handle this in the next update.

from flutter_tex.

from flutter_tex.

I have updated the package please take a look at 3.6.2. I have added a new widget TeXViewImage where you can load images either from assets or network. Be careful there are some API changes with some new features please do check Changelog and example before proceeding.

from flutter_tex.

The TeXViewImage works like a charme, however I really liked the solution to use
<img src="http://localhost:5353/assets/app_icon.png">
inside the teX string. With the new update that line of code doesn't work anymore.
The advantage for me to use it inside the teX code is that I can use html style functionality.
I want to be able to show code right next to the image.
In html this can be accomplished by something like this:

<div>
        <div style:"display: inline-block">
		<img src="drawings\fig1.4.1.svg" alt="figure 1.4.1">
	</div>
	<div style:"display: inline-block">
		$$\begin{aligned} 
                |\mathbf a| &= |\mathbf c|=2, \\[5px]
                |\mathbf d| &= |\mathbf f|=3, \\[5px]
                |\mathbf b| &= 4
                \end{aligned}$$
        </div>	
</div>

Whats an image src I could use to accomplish this?
Thanks for your help

from flutter_tex.

Put TeXViewImage in TeXViewContainer and apply style to your container using TeXViewStyle.fromCSS("your:style;" ), I hope you can achive exactly what you want.

Image src is a source either from a network or local assets.

from flutter_tex.

Yes this worked for me. Thanks for the tip.
If I have a page with lots of images and formula right next to that image I have to split the raw teX-String into lots of smaller pieces and then put them back each in a TexViewContainer file.
Since I have to use some containers inside of each other to achive the layout that I want it becomes very nested.
If I could just use the raw HTML and teX code with something like this:
<img src="http://localhost:5353/assets/app_icon.png"> <br>
it would become a lot easer for me.
However if this solution can't be available anymore I'll stick with the containers.

from flutter_tex.

Ok fine you can get port by using this window.location.port and just use that port. because this time port is dynamic for each instance, but it won't work properly.
Why don't you create a custom TeXViewWiget and reuse that again and again?

e.g. for you above code

  TeXViewWidget customTeXViewWidget(imgSrc, rawTeX) {
    return TeXViewColumn(children: [
      TeXViewContainer(child: TeXViewImage.asset(imgSrc),
          style: TeXViewStyle.fromCSS("display: inline-block")),
      TeXViewDocument(
          rawTeX, style: TeXViewStyle.fromCSS('display: inline-block'))
    ]);
  }

from flutter_tex.

Hey now again you can use <img src="http://localhost:5353/assets/app_icon.png"> <br> do get the latest version of flutter_tex.

from flutter_tex.

Thanks, this works!

from flutter_tex.

check this solution
#135 (comment)

from flutter_tex.