Kivy - 按鈕顏色

在任何 GUI 應用程式中，按鈕都是一個重要的元件。其主要功能是響應點選事件並呼叫回撥函式。為了設計吸引人的 GUI，應適當地選擇按鈕顏色。您可以透過指定其標題的顏色、正常狀態和停用狀態下的背景顏色來配置按鈕。

在 Kivy 中，Button 類定義了以下與顏色相關的屬性：

• color
• background_color
• disabled_color
• outline_color
• disabled_outline_color

color 屬性

Button 類從 Label 類繼承此屬性，因為 Button 是一個響應點選相關事件的 Label。color 屬性定義按鈕文字或按鈕標題的顏色。

由於 color 是 ColorProperty 型別，因此必須以 (r,g,b,a) 格式指定。顏色取值範圍為“0”到“1”。“a”元件用於透明度。對於按鈕，color 預設為 [1, 1, 1, 1]。

background_color 屬性

此屬性充當紋理顏色的乘數。預設紋理為灰色，因此僅設定背景顏色將產生較暗的結果。按鈕的背景顏色是 ColorProperty，格式為 (r, g, b, a)，預設值為 [1,1,1,1]。

disabled_color 屬性

此屬性繼承自 Label 類。它定義按鈕停用時的文字或標題顏色。它是一個 ColorProperty，預設為 [1,1,1,3]。

outline_color 屬性

繼承自 Label 類，此屬性配置文字輪廓的顏色。請注意，這需要 SDL2 文字提供程式。此屬性為 ColorProperty 型別，其預設值為 [0,0,0,1]。

disabled_outline_color 屬性

此屬性定義小部件停用時文字輪廓的顏色，格式為 (r, g, b)。它繼承自 Label 類。此功能需要 SDL2 文字提供程式。disabled_outline_color 是 ColorProperty，預設為 [0, 0, 0]。

示例 1

讓我們演示 color 和 disabled_color 屬性的使用。在以下示例中，我們在 floatlayout 中放置了兩個按鈕。它們使用不同的 color 和 disabled_color 屬性進行例項化。單擊時，文字顏色會發生變化。

from kivy.app import App
from kivy.uix.button import Button
from kivy.config import Config
from kivy.uix.floatlayout import FloatLayout

# Configuration
Config.set('graphics', 'width', '720')
Config.set('graphics', 'height', '300')
Config.set('graphics', 'resizable', '1')

class HelloApp(App):
   def on_button_press(self, instance):
      instance.disabled = True

   def build(self):
      flo = FloatLayout()

      btn1 = Button(text= 'Hello Python', color= [1,0,0,1],
         disabled_color = [0,0,1,1],
         font_size= 40, size_hint= (.4, .25),
         pos_hint= {'center_x':.5, 'center_y':.8})
      btn1.bind(on_press = self.on_button_press)
      btn2 = Button(text= 'Hello Kivy', color= [0,0,1,1],
         disabled_color = [1,0,0,1],
         font_size= 40, size_hint= (.4, .25),
         pos_hint= {'center_x':.5, 'center_y':.2})
      flo.add_widget(btn1)
      btn2.bind(on_press = self.on_button_press)
      flo.add_widget(btn2)
      return flo

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

輸出

最初，兩個按鈕都處於啟用狀態。當您按下按鈕時，它們會變為停用狀態（它們無法接收“on_press”事件），並且文字顏色會根據配置更改。

示例 2

在以下程式中，當單擊任何按鈕時，其文字顏色和背景顏色會互換。

from kivy.app import App
from kivy.uix.button import Button
from kivy.config import Config
from kivy.uix.floatlayout import FloatLayout

# Configuration
Config.set('graphics', 'width', '720')
Config.set('graphics', 'height', '300')
Config.set('graphics', 'resizable', '1')

class HelloApp(App):
   def on_button_press(self, instance):
      print("change color")
      instance.background_color, instance.color = instance.color, instance.background_color

   def build(self):
      flo = FloatLayout()

      self.btn1 = Button(text='Hello Python',
         color=[1, 0, 0, 1],
         background_color=[0, 0, 1, 1],
         font_size=40, size_hint=(.4, .25),
         pos_hint={'center_x': .5, 'center_y': .8})

      self.btn2 = Button(text='Hello Kivy',
         color=[0, 0, 1, 1],
         background_color=[1, 0, 0, 1],
         font_size=40, size_hint=(.4, .25),
         pos_hint={'center_x': .5, 'center_y': .2})
      flo.add_widget(self.btn1)
      self.btn1.bind(on_press=self.on_button_press)
      self.btn2.bind(on_press=self.on_button_press)
      flo.add_widget(self.btn2)
      return flo

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

輸出

當您單擊兩個按鈕中的任何一個時，它們的色彩會像這裡顯示的那樣互換：