Added ImageViewer Control to display full screen Image with Zoom, Pan & paging
A ImageViewer displays a full screen Image that allows Zoom, Pan, and paging through multipe images.
The image src can be a single image path String or a List of image strings to page through. Example:
import flet as ft
def main(page):
def show_image_viewer_click(e):
img = e.control.data
page.dialog = ft.ImageViewer(src=img, swipe_dismissable=False)
page.dialog.open = True
page.update()
images = ft.GridView(expand=1, runs_count=5)
for i in range(0, 60):
images.controls.append(
ft.GestureDetector(
content=ft.Image(
src=f"https://picsum.photos/150/150?{i}",
fit=ft.ImageFit.NONE,
),
data=f"https://picsum.photos/150/150?{i}",
on_tap=show_image_viewer_click,
)
)
page.add(images)
ft.app(target=main)
Sorry for the delay with reply... I honestly believe widgets like ImageViewer should be implemented as "out-of-band" (OOB) Flet controls in separate libraries, that user can optionally add to the app (via flet build command).
We will create guidelines (there is an item on roadmap) on how to create a Python part (Python adapter) for a custom control and how to create and publish Flutter/Dart part of the control.
I think some of the existing or future Flet "core" controls could be implemented as optional "extensions", e.g. audioplayer, video, webview - they add a certain weight into the resulting app, but not all users need them.
I'm leaving this PR open as a possible candidate for testing OOB control extensions.
Aw, but it seemed like a simple, useful, general use UI function that so many apps use when you click on an image. I've used a full-screen Image Zoom feature in every Flutter app I've done, seemed like it should be a core feature, but it is up to you. I hope I'll be able to use your OOB extension framework when deploying on Google Colab since that's my apps primary platform, I'm a bit confused how it's going to install a personal build of Flet there but will have to figure it out then. My Diffusion Deluxe app would be using the Image Viewer everywhere since the whole purpose of it is to generate high-resolution upscaled AI images that everyone wants to zoom into.. Check my progress at https://DiffusionDeluxe.com/screenshots and see what I mean, the project got really elaborate last year, way too many fun ways to use the Python AI code to make complex images.. Anyways, let me know when there's any updates, I look forward to expanding more features this year, thanks Feodor...
🤓 OK, could you please update this PR from main and fix the conflicts?
Looks like merging gone wrong - CI is failing: https://ci.appveyor.com/project/flet-dev/flet/builds/48927108/job/bb574ivys2ifw3d3#L145
shake is no longer required: https://github.com/flet-dev/flet/blob/main/package/pubspec.yaml#L23-L43
Thanks Feodor, I fixed those minor issues and got the changes merged. Hopefully it's all good now, let me know if there's anything else I can do. Appreciate your hard work, trying to make it as easy as possible for ya..
Wondering how this control is going...
We need to make it in a separate package.
Wondering how this control is going...
Wondering how this control is going...
I had it all done, even though the commit might need to be redone because main was updated where I couldn't update my PR. However Feodore then said it should be a separate package rather than core, which I have no idea how to do where I can still use it in my install without having to rebuild the package which I don't think would work for me in my Colab launcher. I had it done almost a year ago and it sat, but for me this was still a much needed feature that I've been living without... So I don't know what the next step would be if we have any hope of a standard full screen image viewer.