InteractiveViewer

Allows you to pan, zoom, and rotate its content.

Inherits: LayoutControl

Properties

• alignment(Alignment | None) –

  The alignment of the content within this viewer.

• boundary_margin(MarginValue) –

  A margin for the visible boundaries of the content.

• clip_behavior(ClipBehavior) –

  Defines how to clip the content.

• constrained(bool) –

  Whether the normal size constraints at this point in the widget tree are applied

• content(Control) –

  The Control to be transformed.

• interaction_end_friction_coefficient(Number) –

  Changes the deceleration behavior after a gesture.

• interaction_update_interval(int) –

  The interval (in milliseconds) at which the

• max_scale(Number) –

  The maximum allowed scale.

• min_scale(Number) –

  The minimum allowed scale.

• pan_enabled(bool) –

  Whether panning is enabled.

• scale_enabled(bool) –

  Whether scaling is enabled.

• scale_factor(Number) –

  The amount of scale to be performed per pointer scroll.

• trackpad_scroll_causes_scale(bool) –

  Whether scrolling up/down on a trackpad should cause scaling instead of panning.

Events

• on_interaction_end(EventHandler[ScaleEndEvent[InteractiveViewer]] | None) –

  Called when the user ends a pan or scale gesture.

• on_interaction_start(EventHandler[ScaleStartEvent[InteractiveViewer]] | None) –

  Called when the user begins a pan or scale gesture.

• on_interaction_update(EventHandler[ScaleUpdateEvent[InteractiveViewer]] | None) –

  Called when the user updates a pan or scale gesture.

Methods

• pan –
• reset –
• restore_state –
• save_state –
• zoom –

Examples

Live example

Handling events

import flet as ft


def main(page: ft.Page):
    page.add(
        ft.InteractiveViewer(
            min_scale=0.1,
            max_scale=15,
            boundary_margin=ft.margin.all(20),
            on_interaction_start=lambda e: print(e),
            on_interaction_end=lambda e: print(e),
            on_interaction_update=lambda e: print(e),
            content=ft.Image(
                src="https://picsum.photos/500/500",
            ),
        )
    )


ft.run(main)

Properties

alignment class-attribute instance-attribute

alignment: Alignment | None = None

The alignment of the content within this viewer.

boundary_margin class-attribute instance-attribute

boundary_margin: MarginValue = 0

A margin for the visible boundaries of the content.

clip_behavior class-attribute instance-attribute

clip_behavior: ClipBehavior = HARD_EDGE

Defines how to clip the content.

constrained class-attribute instance-attribute

constrained: bool = True

Whether the normal size constraints at this point in the widget tree are applied to the child.

content instance-attribute

content: Control

The Control to be transformed.

Must be visible.

Raises:

• ValueError –

  If content is not visible.

interaction_end_friction_coefficient class-attribute instance-attribute

interaction_end_friction_coefficient: Number = 1.35e-05

Changes the deceleration behavior after a gesture.

Raises:

• ValueError –

  If it is less than or equal to 0.

interaction_update_interval class-attribute instance-attribute

interaction_update_interval: int = 200

The interval (in milliseconds) at which the on_interaction_update event is fired.

max_scale class-attribute instance-attribute

max_scale: Number = 2.5

The maximum allowed scale.

Raises:

• ValueError –

  If it is not greater than 0 or is less than min_scale.

min_scale class-attribute instance-attribute

min_scale: Number = 0.8

The minimum allowed scale.

Raises:

• ValueError –

  If it is not greater than 0 or less than max_scale.

pan_enabled class-attribute instance-attribute

pan_enabled: bool = True

Whether panning is enabled.

scale_enabled class-attribute instance-attribute

scale_enabled: bool = True

Whether scaling is enabled.

scale_factor class-attribute instance-attribute

scale_factor: Number = 200

The amount of scale to be performed per pointer scroll.

trackpad_scroll_causes_scale class-attribute instance-attribute

trackpad_scroll_causes_scale: bool = False

Whether scrolling up/down on a trackpad should cause scaling instead of panning.

Events

on_interaction_end class-attribute instance-attribute

on_interaction_end: (
    EventHandler[ScaleEndEvent[InteractiveViewer]] | None
) = None

Called when the user ends a pan or scale gesture.

on_interaction_start class-attribute instance-attribute

on_interaction_start: (
    EventHandler[ScaleStartEvent[InteractiveViewer]] | None
) = None

Called when the user begins a pan or scale gesture.

on_interaction_update class-attribute instance-attribute

on_interaction_update: (
    EventHandler[ScaleUpdateEvent[InteractiveViewer]] | None
) = None

Called when the user updates a pan or scale gesture.

Methods

pan async

pan(dx: Number, dy: Number = 0, dz: Number = 0)

reset async

reset(animation_duration: DurationValue | None = None)

restore_state async

restore_state()

save_state async

save_state()

zoom async

zoom(factor: Number)