Kivy - 顏色選擇器

Kivy 的 ColorPicker 元件是一個內建的對話方塊，它允許您透過多種方式選擇顏色。它提供了一個色輪，從中可以選擇所需的顏色。它還具有滑塊控制元件，可以調整以獲得所需的顏色值。HSV 模式下還有用於透明度和顏色值的滑塊。

這些每個顏色屬性都有一個文字框，您可以在其中直接輸入 0 到 255 之間的數字顏色值。

ColorPicker 元件如下所示：

ColorPicker 類在“kivy.uix.colorpicker”模組中定義。

from kivy.uix.colorpicker import ColorPicker
colour = ColorPicker(**kwargs)

要呈現上述顏色對話方塊，只需將 ColorPicker 物件新增到父視窗即可。如果其 color 屬性繫結到事件處理程式，則顏色值可用於進一步處理，例如使用所選顏色更改某些物件的顏色。

除了顏色之外，ColorPicker 物件還具有 hsv 和 hex_color 屬性。在下面的程式碼片段中，當選擇顏色時，顏色、hsv 和 hex_color 值將列印到控制檯。

對於從色輪中選擇的顏色，RGB、HSV、A 和十六進位制值將顯示在文字框中，並由滑塊位置指示。

回撥方法將值列印到控制檯：

RGBA = [1, 0.5, 0.5, 1]
HSV = (0.0, 0.5, 1)
HEX = #ff7f7fff

ColorPicker 屬性

r - 當前選擇的顏色的紅色值。它是一個 BoundedNumericProperty，可以是 0 到 1 之間的值。預設為 0。
g - 當前選擇的顏色的綠色值。“g”是一個 BoundedNumericProperty，可以是 0 到 1 之間的值。
b - 當前選擇的顏色的藍色值。“b”是一個 BoundedNumericProperty，可以是 0 到 1 之間的值。
a - 當前選擇的顏色的 Alpha 值。“a”是一個 BoundedNumericProperty，可以是 0 到 1 之間的值。
hsv - hsv 以 hsv 格式儲存當前選擇的顏色。hsv 是一個 ListProperty，預設為 (1, 1, 1)。
hex_color - hex_color 以十六進位制格式儲存當前選擇的顏色。hex_color 是一個 AliasProperty，預設為 #ffffffff。
color - color 以 rgba 格式儲存當前選擇的顏色。color 是一個 ListProperty，預設為 (1, 1, 1, 1)。
font_name - 指定 ColorPicker 上使用的字型。font_name 是一個 StringProperty。
wheel - wheel 儲存顏色輪。wheel 是一個 ObjectProperty，預設為 None。

示例

讓我們使用 ColorPicker 元件來選擇任何所需的顏色，無論是從色輪還是從滑塊，或者透過直接輸入顏色值；並將其應用於父視窗上的標籤。

Kivy 應用程式視窗包含一個標籤和一個按鈕，放置在網格佈局中。在按鈕的 on_press 事件上，將顯示一個彈出視窗。

彈出視窗使用 ColorPicker 和另一個網格佈局中的按鈕設計。彈出視窗按鈕在關閉彈出視窗之前將所選顏色應用於應用程式視窗上的標籤。

from kivy.app import App
from kivy.uix.button import Button
from kivy.uix.label import Label
from kivy.uix.gridlayout import GridLayout
from kivy.uix.popup import Popup
from kivy.uix.colorpicker import ColorPicker
from kivy.core.window import Window

Window.size = (720, 350)

class ColorPickApp(App):
   def build(self):
      self.layout = GridLayout(cols=1, padding=10)
      self.l1 = Label(
         text='www.tutorialspoint.com',
         font_size=32, color=[.8, .6, .4, 1]
      )
      self.layout.add_widget(self.l1)
      self.button = Button(text="Click Here")
      self.layout.add_widget(self.button)
      self.button.bind(on_press=self.onButtonPress)
      return self.layout
      
   def onButtonPress(self, button):
      layout = GridLayout(cols=1, padding=10)
   
      self.clr = ColorPicker()
      closeButton = Button(text="OK", size_hint=(.1, .05))
      
      layout.add_widget(self.clr)
      layout.add_widget(closeButton)
   
      self.popup = Popup(
         title='Hello', content=layout, auto_dismiss=False
      )
      self.popup.open()
   
      closeButton.bind(on_press=self.on_close)
   def on_close(self, event):
      self.l1.color = self.clr.hex_color
      self.popup.dismiss()
      
ColorPickApp().run()

輸出

此 Kivy 應用程式的初始顯示將顯示一個標籤和一個按鈕。單擊按鈕時，將彈出 ColorPicker 元件。

選擇所需的顏色並按確定。您將看到標籤文字相應地更改其顏色。

列印頁面