Kivy - 分隔器



Kivy 中的 Splitter 小部件會在任何其他小部件或包含在其內的佈局周圍放置一個可拖動的邊界。您可以拖動邊界來調整其內含物件的大小。邊界可以放置在內含小部件的上方或下方,或左側或右側。

Splitter 類在 "kivy.uix.splitter" 模組中定義。

from kivy.uix.splitter import Splitter
split = Splitter(**kwargs)

配置邊界位置所需的一個重要屬性是 'sizable_from'。它定義了小部件可從哪個方向調整大小。選項包括:left、right、top 或 bottom;預設為 'left'。

邊界中間有一個手柄。您可以使用此手柄拖動邊界,甚至可以透過雙擊它來拖動。

Splitter 類的其他屬性如下:

  • border - 用於 BorderImage 圖形指令的邊框。這必須是一個包含四個值的列表:(bottom, right, top, left),預設為 [4,4,4,4]

  • keep_within_parent - 如果為 True,則會限制分隔器停留在其父小部件內。

  • max_size - 指定小部件不可調整大小的最大尺寸。max_size 預設為 500pt。

  • min_size - 指定小部件不可調整大小的最小尺寸。預設為 100 pt。

  • rescale_with_parent - 如果為 True,則會在調整其大小時自動更改大小以佔據父小部件的相同比例,同時保持在 min_size 和 max_size 之內。

  • sizable_from - 指定小部件是否可調整大小。選項包括 - left、right、top 或 bottom;預設為 left。

Kivy Splitter

示例

讓我們建立一個簡單的水平箱式佈局,並在兩個按鈕之間放置一個 Image 小部件。但是,Image 物件放置在從左側可調整大小的 Splitter 內。

from kivy.app import App
from kivy.uix.button import Button
from kivy.uix.image import Image
from kivy.uix.boxlayout import BoxLayout
from kivy.uix.splitter import Splitter
from kivy.core.window import Window

Window.size = (720,350)

class splitterApp(App):
   def build(self):
      layout=BoxLayout(orientation='horizontal')
      b1=Button(
         text='Button1',
         font_size=24, color=(1,0,0,1)
      )
      layout.add_widget(b1)
      spl=Splitter(sizable_from = 'left')
      img=Image(source='Logo.jpg')
      spl.add_widget(img)
      layout.add_widget(spl)
      b2=Button(
         text='Button 2', font_size=24,
         background_color =(.8, .4, .3, 1)
      )
      layout.add_widget(b2)
      return layout
   
splitterApp().run()

輸出

程式執行時,您將看到一個可拖動的邊界,其手柄位於影像的左側。拖動它以調整影像的大小。

Kivy Splitter Resize Image

這是程式的“kv”指令碼版本,用於演示從底部可調整大小的垂直分隔器的使用。

BoxLayout:
   orientation:'vertical'
   Button:
      text: 'Button 1'
      font_size:24
      color:(1,0,0,1)
   Splitter:
      sizable_from : 'bottom'
      Image:
         source:'Logo.jpg'
   Button:
      text:'Button 2'
      font_size:24
      background_color: (.8, .4, .3, 1)

垂直可調整大小的影像小部件顯示如下:

Kivy Splitter Vertical
廣告
© . All rights reserved.