Kivy - 小部件



Kivy 應用程式的使用者介面是使用 Kivy 庫中的各種小部件設計的。“kivy.uix”模組包含與小部件名稱相對應類的定義。這些類提供了相應小部件物件的屬性和功能。

Kivy 庫中的各種小部件可以分為以下類別:

通用小部件

從某種意義上說,這些小部件本質上是經典的,因為它們用於大多數應用程式的介面設計。UX 小部件(如標籤、各種按鈕型別、輸入框、影像容器、滑塊和進度指示器等)屬於此類別。

下面顯示了一些 UX 小部件:

Kivy Widgets

佈局

Kivy 應用程式視窗只能包含一個小部件作為其根物件。但是,如果您需要使用多個控制元件來組合應用程式介面,則必須使用佈局小部件,並將多個 UX 小部件放置在其中,然後將佈局作為根小部件放在應用程式視窗上。

需要注意的是,佈局小部件本身沒有視覺表示。Kivy 提供了各種佈局,例如網格佈局、箱式佈局、浮動佈局等。

複雜 UX 小部件

此型別的小部件是組合多個經典小部件的結果。它們很複雜,因為它們的組裝和使用不像經典小部件那樣通用。

複雜小部件類別中的示例包括下拉列表、檔案選擇器、微調器、影片播放器、虛擬鍵盤等。

行為小部件

這些小部件沒有自己的渲染,但會響應其子元素的圖形指令或互動(觸控)行為。Scatter、Stencil View 小部件屬於此型別。

螢幕管理器

在從一個螢幕切換到另一個螢幕時管理螢幕和過渡。

小部件類

在 kivy.uix.widget 模組中定義的 Widget 類是所有小部件類的基礎。此 Widget 類中定義的常見屬性(如大小、寬度、高度、位置、位置提示等)由其他小部件繼承。

任何 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。您可以顯式地向 add_widget() 方法提供索引引數。

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

如果小部件排列是巢狀的,則最內部小部件上的事件會向上傳播。假設 Button 是一個小部件的子元素,新增到 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

示例

一個基本的 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()

輸出

執行此程式碼時,它將生成以下輸出視窗:

Kivy Widgets Window
廣告

© . All rights reserved.