《Python+Kivy(App开发)从入门到实践》自学笔记:简单UX部件——CheckBox复选框

章节知识点总揽

4.5 CheckBox复选框

        CheckBox复选框包括一个特定的两种状态按钮:可以选中或取消选中。如果一个组中只有一个CheckBox,它将成为一个单选按钮。与ToggleButton按钮在设置CheckBox.group时,一次只能选择一个单选按钮一样。

4.5.1 使用方法

        在.py文件内使用复选框需要引入CheckBox类,通过CheckBox类生成一个复选框并设置相关样式,再通过add_widget()方法添加到布局中即可,关键代码如下:

from kivy.uix.checkbox import CheckBox
    
    #以下内容放在布局__init__()函数内
    checkbox = CheckBox()
    checkbox.bind(active=self.on_checkbox_active)    #因为放在类的__init__()函数内,需要指定使用self自身的函数
    self.add_widget(checkbox)
#以下内容放在布局类内,与__init__()
def on_checkbox_active(self,checkbox,value):
        if value:
            print('The checkbox',checkbox,'is active')
        else:
            print('the checkbox',checkbox,'is inactive')

        新建main.py文件,使用floatlayout布局,内容如下:

from kivy.app import App
from kivy.uix.floatlayout import FloatLayout
from kivy.uix.checkbox import CheckBox
 
class FloatLayoutWidget(FloatLayout):
    def __init__(self,**kwargs):
        super().__init__(**kwargs)
 
        
        checkbox = CheckBox()
        checkbox.bind(active=self.on_checkbox_active)
        self.add_widget(checkbox)
 
    def on_checkbox_active(self,checkbox,value):
        if value:
            print('The checkbox',checkbox,'is active')
        else:
            print('the checkbox',checkbox,'is inactive')
 
 
 
class CheckBoxApp(App):
    def build(self):
        return FloatLayoutWidget()
 
 
if __name__ == '__main__':
    CheckBoxApp().run()

        运行main.py文件,结果如下图:

《Python+Kivy(App开发)从入门到实践》自学笔记:简单UX部件——CheckBox复选框_第1张图片

         相比之下,在.kv内使用就非常简单,无需引入即可使用。关键代码如下:        

#设置布局后,输入下列内容即可
	CheckBox:
		active:True

        使用.kv实现CheckBox复选框功能,修改main.py文件,删除所有布局内容,具体如下:

from kivy.app import App
from kivy.uix.floatlayout import FloatLayout


class FloatLayoutWidget(FloatLayout):
    def __init__(self,**kwargs):
        super().__init__(**kwargs)


class CheckBoxApp(App):
    def build(self):
        return FloatLayoutWidget()


if __name__ =="__main__":
    CheckBoxApp().run()

        根据CheckBoxApp()类,新建checkbox.kv文件,内容如下:

:
	CheckBox:
		active:True

        运行main.py文件,可以实现复选框功能,只是没有触发事件而已。

4.5.2 常用属性

        在kivy中为了方便设置CheckBox的样式,提供了大量的属性,具体如下表:

CheckBox常用属性

属性 说明
activ 是否选中该CheckBox,默认为False
group 组名,在同一组中只能单选
color 显示的颜色,格式为rgba,默认为[1,1,1,1]
background_checkbox_disabled_down 默认为“kivy/tools/theming/defaulttheme/checkbox_disabled_on.png”
background_checkbox_disabled_normal 复选框处于禁用状态且未选中时,显示的背景图像,默认为"checkbox_disabled_off.png"
background_checkbox_down 复选框在选中时,显示的背景图像,默认为“checkbox_on.png”
background_checkbox_normal 复选框未被选中时,显示的背景图像,默认为“checkbox_off.png”
background_radio_disabled_down 默认为“checkbox_radio_disabled_on.png”
background_radio_disabled_normal 默认为“checkbox_radio_disabled_off.png”
background_radio_down 单选按钮选中时,显示的背景图像,默认为“checkbox_radio_on.png”
background_radio_normal 单选按钮未选中时,显示的背景图像,默认为“checkbox_radio_off.png”

        实例:设置CheckBox复选框的常用属性

        在main.py文件中,使用BoxLayout布局来加载checkbox.kv文件,在.kv文件内设置四个复选框,其中三个为一组,具体代码如下:

         main.py内容:

from kivy.app import App
from kivy.uix.boxlayout import BoxLayout


class CheckBoxWidget(BoxLayout):
    def __init__(self,**kwargs):
        super().__init__(**kwargs)


class CheckBoxApp(App):
    def build(self):
        return CheckBoxWidget()


if __name__ =="__main__":
    CheckBoxApp().run()

        根据main.py中建立的CheckBoxApp()类,新建checkbox.kv文件,根据main.py创建的CheckBoxWidget()类,在checkbox.kv文件中,使用该布局。

        注:原书id部分属性空格有误,下列代码正确。

:
	orientation:'vertical'
	canvas:
		Color:
			rgba:[1,1,1,1]
		Rectangle:
			pos:self.pos
			size:self.size
	CheckBox:
		group:'check_0'
		id:'first_check_0'
		color:.6,.2,.2,1
	CheckBox:
		group:'check_0'
		color:.2,.6,.2,1
	CheckBox:
		group:'check_0'
		color:.2,.2,.6,1
	CheckBox:
		color:.6,.6,.6,1

        运行main.py文件,checkbox.kv文件中,设置group的按钮,同组只能选一个(圆形);未设置组的,可以多选(方框)。结果如下图:

《Python+Kivy(App开发)从入门到实践》自学笔记:简单UX部件——CheckBox复选框_第2张图片

4.5.3 触发事件

        在设置CheckBox复选框的触发事件时,CheckBox中的触发事件on_checkbox_active(选中复选框触发),不能直接添加在.kv文件中,需要在.py文件内通过ID属性来获取到对应的复选框,并通过bind()方法绑定即可。

        main.py内容:

from kivy.app import App
from kivy.uix.boxlayout import BoxLayout

class CheckBoxWidget(BoxLayout):
    def __init__(self,**kwargs):
        super().__init__(**kwargs)


        #通过ID获取到CheckBox部件并绑定方法
        self.ids.first_check_0.bind(active=self.on_checkbox_active)

    @staticmethod
    def on_checkbox_active(checkbox,value):
        if value:
            print('The checkbox',checkbox,'is active')
        else:
            print('The checkbox',checkbox,'is inactive')

class CheckBoxApp(App):
    #实现App类的build()方法,(继承自App类)
    def build(self):
        return CheckBoxWidget()

if __name__=='__main__':
    from kivy.core.window import Window
    Window.clearcolor = [.8,.8,.8,1]
    CheckBoxApp().run()

        checkbox.kv内容:

:
	orientation:'vertical'

	canvas:
		Color:
			rgba:[1,1,1,1]
		Rectangle:
			pos:self.pos
			size:self.size
	CheckBox:
		group:'check_0'
		id:first_check_0
		color:.6,.2,.2,1

	CheckBox:
		group:'check_0'
		color:.2,.6,.2,1

	CheckBox:
		group:'check_0'
		color:.2,.2,.6,1

	CheckBox:
		color:.6,.6,.6,1

        运行main.py,结果如下图:

《Python+Kivy(App开发)从入门到实践》自学笔记:简单UX部件——CheckBox复选框_第3张图片

上一篇:简单UX部件——TextInput输入框

下一篇:简单UX部件——Slider滑块

你可能感兴趣的:(python,前端,开发语言)