Kivy - ScrollView

Kivy 框架中的 ScrollView 控件可以包含任何尺寸大于分配给它的尺寸的其他控件，并为其提供一个可滚动的面板。这使得包含的控件可以垂直或水平平移/滚动。

ScrollView 类定义在 kivy.uix.scrollview 模块中。通常，您在一个布局中组合一个或多个控件，并将该布局添加到 ScrollView 中。

from kivy.uix.scrollview import ScrollView
view = ScrollView()
view.add_widget(layout)

ScrollView 对象的“scroll_x”和“scroll_y”属性控制滚动面板的滚动行为。ScrollView 允许双向滚动。您可以通过将“do_scroll_x”或“do_scroll_y”设置为 False 来禁用某个轴上的滚动。

此外，“scroll_distance”属性设置移动的最小距离，默认为 20 像素。此外，scroll_timeout 属性指定最大时间段，默认为 55 毫秒。

“scroll_distance”和“scroll_timeout”的重要性在于：如果触摸手势滚动的像素数大于或等于 scroll_distance，并且在 scroll_timeout 时间段内，则将其识别为滚动手势，并将开始平移（滚动/平移）。如果超时，则触摸按下事件将传播到子控件。

ScrollView 类的其他属性如下所示：

do_scroll - 允许在 X 或 Y 轴上滚动。
do_scroll_x - 允许在 X 轴上滚动。这是一个 BooleanProperty，默认为 True。
do_scroll_y - 允许在 Y 轴上滚动。这是一个 BooleanProperty，默认为 True。
scroll_distance - 在像素中滚动 ScrollView 之前移动的距离。这是一个 NumericProperty，默认为 20 像素。
scroll_timeout - 触发 scroll_distance 允许的超时时间（毫秒），默认为 55 毫秒
scroll_to() - 滚动视口以确保给定控件可见，可以选择添加填充和动画。
scroll_type - 设置用于 scrollview 内容的滚动类型。可用选项为：['content'], ['bars'], ['bars', 'content']。
ScrollView 对象发出以下事件：
- on_scroll_start - 触摸开始滚动时触发的通用事件。
- on_scroll_move - 触摸滚动移动时触发的通用事件。
- on_scroll_stop - 触摸停止滚动时触发的通用事件。

示例

为了能够理解 ScrollView 的工作原理，我们需要一个足够大的布局，以便它溢出主应用程序窗口的尺寸。为此，我们将 100 个按钮添加到一个单列网格布局中，并应用 scrollview 到它。

以下示例中的操作代码如下所示：

layout = GridLayout(cols=1)

for i in range(100):
   btn = Button(text='Button ' + str(i), size_hint_y=None, height=40)
   layout.add_widget(btn)

root = ScrollView()
root.add_widget(layout)

为了确保高度使得有东西可以滚动，将布局对象的 minimum_height 属性绑定到其设置器。

layout.bind(minimum_height=layout.setter('height'))

以下是 ScrollView 演示代码的完整代码：

from kivy.uix.gridlayout import GridLayout
from kivy.uix.button import Button
from kivy.uix.scrollview import ScrollView
from kivy.app import App
from kivy.core.window import Window

Window.size = (720, 350)

class scrollableapp(App):
   def build(self):
      layout = GridLayout(cols=1, spacing=10, size_hint_y=None)
      layout.bind(minimum_height=layout.setter('height'))

      for i in range(100):
         btn = Button(text='Button ' + str(i), size_hint_y=None, height=40)
         layout.add_widget(btn)
      
      root = ScrollView(
         size_hint=(1, None),
         size=(Window.width, Window.height)
      )
      root.add_widget(layout)
      return root

scrollableapp().run()

输出

运行以上代码。要超出视图中可见的按钮，请使用鼠标垂直滚动，或者如果您正在使用触摸屏设备，则使用手指滚动。

打印页面