Kivy 简明教程

Kivy - Button Colors

在任何 GUI 应用程序中,按钮都是一个重要的组件。它的主要功能是响应点击事件并调用回调。为了设计出美观的 GUI,应适当地选择按钮颜色。你可以通过指定其标题的颜色、正常状态的背景颜色以及禁用状态的背景颜色来配置按钮。

在 Kivy 中,Button 类定义了以下与颜色相关的属性 −

  1. color

  2. background_color

  3. disabled_color

  4. outline_color

  5. disabled_outline_color

color Property

Button 类从 Label 类继承此属性,因为 Button 是一个响应点击相关事件的 Label。 color 属性定义按钮文本或按钮标题的颜色。

由于 color 的类型为 ColorProperty,因此必须指定为 (r,g,b,a) 格式。颜色取值范围为 “0” 到 “1”。“a” 组件用于透明度。对于一个按钮,颜色默认为 [1, 1, 1, 1]。

background_color Property

它用作纹理颜色的乘数。默认纹理为灰色,因此仅设置背景颜色将得到较暗的结果。按钮的背景颜色是 (r, g, b, a) 格式中的 ColorProperty,其默认值为 [1,1,1,1]。

disabled_color Property

此属性从 Label 类继承而来。它定义当按钮被禁用时的按钮文本或标题颜色。它是一个 ColorProperty,默认为 [1,1,1,3]

outline_color Property

继承自 Label 类,此属性配置文本轮廓的颜色。请注意,这需要 SDL2 文本提供程序。此属性的类型为 ColorProperty,其默认值为 [0,0,0,1]

disabled_outline_color Property

此属性定义禁用小组件时文本轮廓的颜色,格式为 (r, g, b)。它从 Label 类继承而来。此功能需要 SDL2 文本提供程序。 disabled_outline_color 是一个 ColorProperty,默认为 [0, 0, 0]。

Example 1

让我们演示如何使用 color 和 disabled_color 属性。在以下示例中,我们在浮动布局中放置了两个按钮。它们使用不同的 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()

Output

最初,两个按钮都处于启用状态。当你按下按钮时,它们会被禁用(它们无法接收“on_press”事件),并且文本颜色会根据配置而改变。

kivy button colors

Example 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()

Output

当单击两个按钮中的任意一个按钮时,它们的颜色的交换方式如下所示:

kivy button colors hello