Kivy - 旋轉木馬



旋轉木馬是一種用於迴圈瀏覽一系列內容的幻燈片放映。Kivy 框架包含一個 Carousel 元件,允許您輕鬆建立可瀏覽的幻燈片放映,尤其適用於智慧手機等觸控式螢幕裝置。旋轉木馬中的頁面可以水平或垂直移動。

Carousel 類定義在 "kivy.uix.carousel" 模組中。

from kivy.uix.carousel import Carousel
carousel = Carousel(**kwargs)

下面是一個使用旋轉木馬建立簡單幻燈片的 Python/Kivy 程式:

from kivy.app import App
from kivy.uix.carousel import Carousel
from kivy.uix.image import Image

class CarouselApp(App):
   def build(self):
      carousel = Carousel(direction='right')
      img1=Image(source='1.png')
      carousel.add_widget(img1)
      img2=Image(source='2.png')
      carousel.add_widget(img2)
      img3=Image(source='3.png')
      carousel.add_widget(img3)
      return carousel
CarouselApp().run()

您也可以使用 "kv" 語言指令碼構建旋轉木馬。

Carousel:
   direction: 'right'
   Image:
      source: '1.png'
   Image:
      source: '2.png'
   Image:
      source: '3.png'
   Image:
      source: '4.png'

Carousel 類定義了以下屬性:

  • current_slide - 當前顯示的幻燈片。current_slide 是一個 AliasProperty。

  • direction - 指定幻燈片排列的方向。這對應於使用者從哪個方向滑動才能從一個幻燈片切換到下一個幻燈片。可以是 right、left、top 或 bottom。

  • index - 獲取/設定基於索引的當前幻燈片。index 預設值為 0(第一個專案)。

  • load_next(mode='next') - 動畫切換到下一張幻燈片。

  • load_previous() - 動畫切換到上一張幻燈片。

  • load_slide(slide) - 動畫切換到作為引數傳遞的幻燈片。

  • loop - 允許旋轉木馬無限迴圈。如果為 True,當用戶嘗試滑動到最後一頁之後,它將返回到第一頁。如果為 False,它將停留在最後一頁。

  • next_slide - 旋轉木馬中的下一張幻燈片。如果當前幻燈片是旋轉木馬中的最後一頁,則為 None。

  • previous_slide - 旋轉木馬中的上一張幻燈片。如果當前幻燈片是旋轉木馬中的第一頁,則為 None。

  • scroll_distance - 滾動旋轉木馬之前移動的距離(以畫素為單位)。預設距離為 20dp。

  • scroll_timeout - 觸發 scroll_distance 允許的超時時間(以毫秒為單位)。預設為 200(毫秒)。

  • slides - 旋轉木馬內的幻燈片列表。

示例

作為 Kivy 中 Carousel 的示例,請檢視以下程式碼。Carousel 物件用作應用程式的根元件,我們新增標籤、按鈕和影像作為其幻燈片。

from kivy.app import App
from kivy.uix.button import Button
from kivy.uix.carousel import Carousel
from kivy.uix.image import Image
from kivy.core.window import Window
Window.size = (720,350)

class CarouselApp(App):
   def build(self):
      carousel = Carousel(direction='right')
      carousel.add_widget(Button(text='Button 1', font_size=32))
      src = "ganapati.png"
      image = Image(source=src, fit_mode="contain")
      carousel.add_widget(image)
      carousel.add_widget(Button(text="Button 2", font_size=32))
      return carousel
CarouselApp().run()

輸出

這是一個簡單的應用程式,可以透過在裝置顯示屏上滑動來瀏覽一系列幻燈片。direction 引數設定為 right,這意味著後續幻燈片位於右側。

Kivy Carousel

使用 "kv" 語言組裝旋轉木馬

讓我們使用 "kv" 語言指令碼組裝旋轉木馬。這次,direction 設定為 top,這意味著您必須向上滑動螢幕才能看到下一個顯示。

示例

Carousel:
   direction:'top'
   Button:
      text:'Button 1'
      font_size:32
   Image:
      source:"kivy-logo.png"
      fit_mode:"contain"
   Button:
      text:"Button 2"
      font_size:32

輸出

幻燈片一個接一個地堆疊在一起。

Kivy Carousel Button
廣告
© . All rights reserved.