如何在Kivy中基于KV语言实现图片的用户缩放功能

单图场景（对应第一种写法） #

直接在Image外层嵌套ScrollView组件，开启内容缩放属性即可，无需修改Python代码，修改后的KV代码如下：

BoxLayout:
    orientation: "vertical"
    ScrollView:
        scroll_type: ['content']
        zoom_min: 0.5
        zoom_max: 5.0
        do_scroll_x: True
        do_scroll_y: True
        Image:
            source: r"Dekalbprotocols (1)-026.jpg"
            allow_stretch: True
            keep_ratio: True
            size_hint: 1, None
            height: self.parent.height

修改核心逻辑：

• 给ScrollView配置缩放参数，开启内容缩放能力，同时指定缩放的上下限
• 将Image的allow_stretch改为True，允许图片拉伸适配缩放后的尺寸
• 把Image的高度和父容器绑定，保证初始显示大小正常

多图PageLayout场景（对应第二种写法） #

每个Image外层单独嵌套ScrollView即可实现单张图片独立缩放，修改后的KV代码如下：

BoxLayout:
    orientation: "vertical"
    PageLayout:
        border: "100dp"
        ScrollView:
            scroll_type: ['content']
            zoom_min: 0.5
            zoom_max: 5.0
            do_scroll_x: True
            do_scroll_y: True
            Image:
                source: r"Dekalbprotocols (1)-019.jpg"
                allow_stretch: True
                keep_ratio: True
                size_hint: 1, None
                height: self.parent.height
        ScrollView:
            scroll_type: ['content']
            zoom_min: 0.5
            zoom_max: 5.0
            do_scroll_x: True
            do_scroll_y: True
            Image:
                source: r"Dekalbprotocols (1)-020.jpg"
                allow_stretch: True
                keep_ratio: True
                size_hint: 1, None
                height: self.parent.height
        ScrollView:
            scroll_type: ['content']
            zoom_min: 0.5
            zoom_max: 5.0
            do_scroll_x: True
            do_scroll_y: True
            Image:
                source: r"Dekalbprotocols (1)-021.jpg"
                allow_stretch: True
                keep_ratio: True
                size_hint: 1, None
                height: self.parent.height

补充说明 #

• 触控设备用双指捏合即可触发缩放，键鼠设备按住Ctrl键滚动鼠标滚轮也可实现缩放
• 可以按需调整zoom_min（最小缩放比例）和zoom_max（最大缩放比例）的数值自定义缩放范围
• 保留keep_ratio: True即可保证图片缩放过程中不会出现拉伸变形

内容的提问来源于stack exchange，提问作者NoTakeOnlyThrow