Kivy 简明教程

Kivy - Anchor Layout

当使用此布局时,我们可以将小部件排列在其中,使其固定在布局尺寸的某个位置。AnchorLayout 类在“kivy.uix.anchorlayout”模块中定义。

from kivy.uix.anchorlayout import AnchorLayout
lo = AnchorLayout(**kwargs)

Keyword Parameters

  1. anchor_x − 定义要放置的小部件的水平锚点。它是一个 OptionProperty,其值必须是“left”、“center”或“right”。默认为“center”。

  2. anchor_y − 定义要放置的小部件的垂直锚点。它是一个 OptionProperty,其值必须是“top”、“center”或“bottom”。默认为“center”。

  3. padding − 小部件框与其子类之间的填充,以像素为单位:[padding_left, padding_top, padding_right, padding_bottom]。它还接受一个双参数形式 [padding_horizontal, padding_vertical] 和一个单参数形式 [padding]。padding 是一个 VariableListProperty,默认为 [0, 0, 0, 0]。

kivy anchor layout

AnchorLayout 类继承了两个方法“add_widget()”和“remove_widget()”,我们已在前面的章节中介绍过这两个方法。

Example 1

以下示例展示了 AnchorLayout 的典型用法 −

from kivy.app import App
from kivy.uix.label import Label
from kivy.uix.anchorlayout import AnchorLayout
from kivy.core.window import Window

Window.size = (720, 400)

class DemoApp(App):
   def build(self):
      lo = AnchorLayout(
         anchor_x='left', anchor_y='bottom'
      )
      self.l1 = Label(
         text='Hello World', font_size=20,
         size_hint=(None, None), size=(200, 75)
      )
      lo.add_widget(self.l1)
      return lo

if __name__ == '__main__':
   DemoApp().run()

Output

可以看出,该标签已锚定到布局的左下角。

kivy anchor layout hello world

具有 AnchorLayout 的 Kivy 应用程序也可以通过“kv”语言脚本构建 −

AnchorLayout:
   anchor_x : 'left'
   anchor_y : 'bottom'
   Label:
      id:l1
      text: 'Hello World'
      font_size: '20pt'
      size_hint : (None, None)
      size : (200, 75)

Example 2

在以下示例中,应用程序窗口具有带有可排列在 3 行中的小部件的顶级 GridLayout。在每一行中,我们将放置三个 AnchorLayout,以便窗口包含九个具有 lefttop、left-center、left-bottom、center-top、center-center、center-bottom、right-top、right-center 和 right-bottom anchor-x 和 anchor-y 属性的锚布局。

在每个布局中,根据锚配置放置一个按钮小部件。

from kivy.app import App
from kivy.uix.button import Button
from kivy.config import Config
from kivy.uix.anchorlayout import AnchorLayout
from kivy.uix.gridlayout import GridLayout

Config.set('graphics', 'width', '720')
Config.set('graphics', 'height', '400')
Config.set('graphics', 'resizable', '1')

class AnchorApp(App):
   def build(self):
      lo = GridLayout(rows=3)
      ax = ['left', 'center', 'right']
      ay = ['top', 'center', 'bottom']
      c = 0

      # 3X3 grid with anchor layout in each
      for i in range(3):
         for j in range(3):
            print(ax[i], ay[j])
            anchrlo = AnchorLayout(
               anchor_x=ax[i], anchor_y=ay[j]
         )
         b = Button(
            text=ax[i] + "-" + ay[j],
            size_hint=(None, None),
            size=(200, 75), halign=ax[i]
         )

         # red text color for top row,
         # green for middle row,
         # blue for bottom row
         if i == 0: b.color = [1, 0, 0, 1]
         if i == 1: b.color = [0, 1, 0, 1]
         if i == 2: b.color = [0, 0, 1, 1]

         anchrlo.add_widget(b)
         lo.add_widget(anchrlo)
      return lo
AnchorApp().run()

Output

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

kivy anchor layout 3 rows