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就会显示被选中。

SRE实战 互联网时代守护先锋,助力企业售后服务体系运筹帷幄!一键直达领取阿里云限量特价优惠。
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()即可。
Kivy中RadioButton控件实现 Python 第1张

从运行结果可知,两个单选按钮都没有被选中,我们希望在程序运行后,有一个是默认选中的,那么如何解决这个问题呢?

这里就需要用到控件的自定义属性来进行配置,在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:

再次运行后第一个单选按钮就会被选中。
Kivy中RadioButton控件实现 Python 第2张

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 == '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: 

运行效果:
Kivy中RadioButton控件实现 Python 第3张

5. 总结

  • 开发组件时,最好用简单的原始控件,来做基石

  • 利用好behaviors模块中的各种行为类

  • 充分掌握好自定义属性,其可以实现很多意想不到的效果

 

 

 

 

扫码关注我们
微信号:SRE实战
拒绝背锅 运筹帷幄