vyuh-tech / vyuh

Build Modular, Scalable, CMS-driven Flutter Apps
https://vyuh.tech
Other
17 stars 5 forks source link

Image Support #6

Open thecannoli opened 1 month ago

thecannoli commented 1 month ago

Hey Pavan,

Joe here. I am super grateful for this Sanity Portable Text and I have been tinkering to attempt to add image support as well, as this is the only piece missing for my use-case. Would you have some time to add it or help me in figuring it out. My level is only intermediate and I can't quite handle the portable text as elegantly as you can.

Thanks, Joe

pavanpodila commented 1 month ago

Hello @thecannoli, the image support is part of the sanity_client package.

The portable text package is squarely focused on supporting the Portable Text Format.

HTH.

thecannoli commented 1 month ago

Hey @pavanpodila, thanks for responding. I am aware that images are supported by the sanity_client. :D Additionally, clever GROQ queries can also just handle the image url conversion for you to put right into a NetworkImage widget. ;)

As you know, though, in Sanity the Portable Text format can include images. The package you created already seems setup to convert the Portable Text into an array of widgets which is returned ( I think ). So, it should work that while looping through the returned json it should be possible to check the type for 'image' which is an image block and then return a NetworkImage widget with the url. Happy to hop into a call to go over what I am seeing and would be happy to discuss development in general as I believe you enjoy mentoring as well. :)

pavanpodila commented 1 month ago

This can be handled by adding a custom block in Sanity and creating a BlockWidgetBuilder for it via the PortableConfig. In your case, you can add an image block on Sanity and create a simple ImageBlock on the Flutter side by registering this block with PortableTextConfig.

You can use this for reference: https://pub.dev/packages/flutter_sanity_portable_text#with-a-custom-block