Kivy - 佈局巢狀

在 Kivy 中，佈局是一個容器元件。它提供了一種有效的機制來構建具有不同元件的 GUI。Kivy 庫包含不同的佈局元件，例如 GridLayout、BoxLayout、AnchorLayout 等。

佈局本身是 Widget 類的子類。因此，我們可以在佈局中策略性地放置一個或多個佈局。透過這種方式，可以構建元件結構的層次結構來為應用程式設計有效的 GUI。任何佈局都可以包含在任何其他佈局中。這完全取決於開發人員如何設想應用程式設計。

讓我們根據以下示意圖規劃我們的應用程式介面佈局：

這裡，我們需要一個最頂層的單列網格佈局。在其中，我們希望放置一個 TextInput 和另外兩個水平箱式佈局。

第一個箱體包含三個按鈕。它下面的一個包含一個影像控制元件和一個 AnchorLayout 元件，其中包含一個滑塊控制元件。

示例

以下“kv”語言指令碼使用了此計劃結構：

GridLayout:
   cols: 1
   size: root.width, root.height
   TextInput:
      text: "Hello World!"
      font_size: 32
      size_hint: (1, .2)
   BoxLayout:
      orientation:'horizontal'
      size_hint: (1, .2)
      Button:
         text:"Btn 1"
         font_size:32
      Button:
         text:"Btn 2"
         font_size:32
      Button:
         text:"Btn 3"
         font_size:32
   FloatLayout:
      Image:
         source: "kivy-logo.png.png"
         size_hint: .5, .75
         pos_hint: {"center_x": 0.25}
      AnchorLayout:
         anchor_x : 'center'
         anchor_y : 'top'
         size_hint: .5, .75
         pos_hint: {"center_x": 0.75}
         Slider:
            min:0
            max:100
            value:25

您可以在以下 App 類中載入此“kv”指令碼：

from kivy.app import App
from kivy.uix.widget import Widget
from kivy.animation import Animation
from kivy.core.window import Window

Window.size = (720,400)

class MyLayoutApp(App):
   def build(self):
      pass
      
if __name__ == '__main__':
   MyLayoutApp().run()

輸出

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

應用程式視窗的最終外觀類似於初始計劃，該計劃使用了“佈局巢狀”。