1. 匯入依賴模塊
from kivy.app import App from kivy.lang import Builder from kivy.uix.boxlayout import BoxLayout from kivy.uix.behaviors import ToggleButtonBehavior from kivy.core.window import Window from kivy.utils import get_color_from_hex # 靜止全屏顯示 Window.fullscreen = False # 設定表單背景顏色為白色 Window.clearcolor = get_color_from_hex('#ffffff')
其他模塊時出現運行的一些基本模塊,表單的一些配置,還要布局容器
2. 自定義RadioButton類
main.py檔案中的類定義,我們的目的是當滑鼠點擊RadioButton整個容器時,里面的checkbox就會顯示被選中,
class RadioButton(ToggleButtonBehavior, BoxLayout): def on_change_checkbox(self): ToggleButtonBehavior._do_press(self.children[1]) class ToomaxWindow(BoxLayout): pass
main.kv檔案中布局定義
#:import C kivy.utils.get_color_from_hex <RadioButton>: id: radiobtn orientation: 'horizontal' group: 'btn' size_hint: 1, None height: 50 on_touch_down: self.on_change_checkbox() CheckBox: # 這里使用了kivy自帶的checkbox控制元件,只要添加group屬性值,就能起到單選按鈕的功能 group: "checkbox" size_hint: None, None size: lab.height, lab.height Label: id: lab text: "RadioButton" color: 0, 0, 0, 1 size_hint: None, None size: self.texture_size <ToomaxWindow>: orientation: 'vertical' spacing: 2 RadioButton: RadioButton:
3. 運行程式后效果
怎么運行我這里就貼出代碼了,就是定義一個App類,并重寫build()方法,然后呼叫App類實體的run()即可,
從運行結果可知,兩個單選按鈕都沒有被選中,我們希望在程式運行后,有一個是默認選中的,那么如何解決這個問題呢?
這里就需要用到控制元件的自定義屬性來進行配置,在RadioButton中自定義一個selected屬性,用于設定單選按鈕的狀態,
class RadioButton(ToggleButtonBehavior, BoxLayout): selected = BooleanProperty(False) def on_change_checkbox(self): ToggleButtonBehavior._do_press(self.children[1]) self.selected = True
kv檔案中RadioButton也需要做相應的更改,
<RadioButton>: id: radiobtn orientation: 'horizontal' group: 'btn' size_hint: 1, None height: 32 valign: 'middle' on_touch_down: self.on_change_checkbox() CheckBox: group: "checkbox" # 使用selected屬性來判斷checkbox的狀態 state: 'down' if self.parent.selected else 'normal' size_hint: None, None size: lab.height, lab.height Label: id: lab text: "RadioButton" color: 0, 0, 0, 1 size_hint: None, None size: self.texture_size <ToomaxWindow>: orientation: 'vertical' spacing: 2 RadioButton: # 將第一個單選按鈕設定為選中狀態 selected: True RadioButton:
再次運行后第一個單選按鈕就會被選中,
4. 不使用checkbox控制元件,自定義狀態圖示
有的時候,我們在開發類似單選按鈕功能時,前面的圖示會用其他的字體圖示來替代,那么如何實作這個需求呢?
比如我們將checkbox改成label控制元件,我們只需要將label的text屬性設定為字體圖示,就可以實作定制化,
py內容:
class ToomaxWindow(BoxLayout): pass class RadioButton(ToggleButtonBehavior, BoxLayout): selected = BooleanProperty(False) text = StringProperty('') # 重寫on_state事件處理方法,當state值發生變化后執行 def on_state(self, widget, value): if value =https://www.cnblogs.com/toomax/p/= 'down': self.selected = True else: self.selected = False # 重寫_do_press方法,當單選容器被點擊后執行,其目的就是解決togglebutton被選中后再次點擊就會取消選中的問題 def _do_press(self): if self.state == 'normal': ToggleButtonBehavior._do_press(self) self.selected = True pass class TestApp(App): def __init__(self, **kwargs): super(TestApp, self).__init__(**kwargs) # 注冊字體圖示,需要匯入kivy.core.text.LabelBase模塊 LabelBase.register(name='font_mp', fn_regular='./fonts/modernpics.otf') def build(self): Builder.load_string(kv) return ToomaxWindow() TestApp().run()
kv檔案內容:
#:import C kivy.utils.get_color_from_hex <RadioButton>: id: radiobtn orientation: 'horizontal' group: 'btn' size_hint: 1, None height: 32 # 根據selected屬性來確定選中狀態 state: 'down' if self.selected else 'normal' Label: # 使用字體圖示 text: '[font=font_mp][size=32]>[/size][/font]' # 根據父控制元件的selected屬性來設定字體圖示的顏色 color: C('#ff0000') if self.parent.selected else C('#000000') size_hint: None, None size: lab.height, lab.height markup: True Label: id: lab # 在父控制元件中增加了text屬性,用來定義單選按鈕的文本內容,沒有則使用默認值 text: self.parent.text if self.parent.text else 'RadioButton' color: 0, 0, 0, 1 size_hint: None, None size: self.texture_size <ToomaxWindow>: orientation: 'vertical' spacing: 2 RadioButton: selected: True text: 'good' RadioButton:
運行效果:
5. 總結
-
開發組件時,最好用簡單的原始控制元件,來做基石
-
利用好behaviors模塊中的各種行為類
-
充分掌握好自定義屬性,其可以實作很多意想不到的效果
轉載請註明出處,本文鏈接:https://www.uj5u.com/houduan/141659.html
標籤:Python
