Kivy 简明教程

Kivy - Widgets

Kivy 应用程序的用户界面由 Kivy 库中的各种小工具设计。 “kivy.uix”模块包含与小工具名称相对应的类定义。这些类提供了相应的控件对象的属性和功能。

Kivy 库中的各种小工具可以分类为以下类别 -

General Purpose Widgets

这些小控件在某种意义上是经典的,因为它们被用于大多数应用程序的界面设计中。比如标签(Label)、不同类型的按钮(Button)、输入框、图片容器、滑块和进度指示器等 UX 小控件属于这个类别。

其中一些 UX 小控件如下所示 −

kivy widgets

Layouts

Kivy 应用程序窗口只能包含一个作为其根对象的小控件。但是,如果你需要将应用程序界面与多个控件组合在一起,则必须使用布局小控件,并将多个 UX 小控件放在其中,然后将布局设置作为应用程序窗口上的根小控件。

需要注意的是,布局小控件本身没有可视化表示。Kivy 提供了各种布局,例如网格布局、框布局、浮动布局等。

Complex UX Widgets

此类型的控件是结合多个经典控件的结果。它们很复杂,因为它们的组装和用法不像经典控件那样通用。

复杂控件类别中的示例包括下拉列表、文件选择器、旋转器、视频播放器、虚拟键盘等。

Behaviors Widgets

这些控件没有自己的渲染,但会响应其子级的图形指令或交互(触控)行为。Scatter、Stencil View 小控件属于此类型。

Screen Manager

在上一个屏幕中切换时管理屏幕和过渡。

Widget Class

在 kivy.uix.widget 模块中定义的 Widget 类是所有小控件类的基础。在此 Widget 类中定义的 size、width、height、pos、pos_hint 等公共属性由其他小控件继承。

任何 Widget 对象的交互性取决于两个方面:“事件处理程序”和“属性回调”。如果小控件在特定类型的事件发生时绑定到某个处理程序,则会调用相应的处理程序函数。

def callback(instance):
   print('Callback handler')

wid = Widget()
wid.bind(on_event=callback)

还会根据某个属性调用回调函数。如果某个属性发生更改,则小控件可以对“on_<propname>”回调中的更改做出响应。

def on_pos_change(instance, value):
   print('The widget position changed to ', value)

wid = Widget()
wid.bind(pos=on_pos_change)

基本 Widget 类和任何小控件都没有 draw() 方法。每个控件都有自己的 Canvas,你可以使用它来绘制。

widget = Widget()
with widget.canvas:
   Rectangle(pos=widget.pos, size=widget.size)

可以将颜色、矩形、线条、缩放和旋转等图形指令添加到任何小控件的 Canvas 中。

在 Kivy 中,事件会从第一个子级通过其他子级向上传播。如果小控件有子级,则事件会先传递给其子级,然后再传递给它后面的控件。

每个小控件都是通过 add_widget() 方法添加到其父对象的。每个添加项都由一个递增索引标识。

box = BoxLayout()
l1=Label(text="a")
l1=Label(text="b")
l1=Label(text="c")
box.add_widget(l1)
box.add_widget(l2)
box.add_widget(l3)

l1、l2、l3 的添加索引分别为 0、1 和 2。你可以将 index 参数显式地传递给 add_widget() 方法。

box.add_widget(l1, index=1)
box.add_widget(l2, index=0)
box.add_widget(l3, index=2)

如果控件安排是嵌套的,则最内部控件的事件将向上传播。假设一个按钮是一个子控件,添加到 Widget 对象本身。因此,将为两个对象调用 touch_down 回调。若要确认触摸事件仅发生在按钮上,请使用 collide_points() 方法。

def callback(self, touch):
   if instance.collide_point(touch.x, touch.y):
      #consume event
      return True
   else:
      #the upper level widget processes the event

Example

一个基本的 Kivy 应用程序在添加到 Widget 对象中标签上显示一个简单的单行消息,代码如下:

from kivy.app import App
from kivy.uix.label import Label
from kivy.uix.widget import Widget
from kivy.core.window import Window

Window.size = (720,300)

class HelloApp(App):
   def build(self):
      w = Widget()
      l1=Label(
         text='Fortune Favours the Brave!',
         font_size=50, size=(200,100),
         pos_hint={'center_x':.5, 'center_y':.5},
         pos=(250,200)
      )
      w.add_widget(l1)
      return w

app = HelloApp()
app.run()

Output

当你运行此代码时,它将生成以下输出窗口 −

kivy widgets window