kivy文件:
在kivy中引入kivy文件,用于ui代码和逻辑代码分离(ui代码就是编写用户界面的)
kivy文件命名:文件名为继承App类的类名的小写形式,且去除App外。例如下图继承App类的类名为TestApp,对应的kivy文件名为text.kv
kivy文件内容:和.py文件定义的类中内容相同,但书写形式不同,具体看下图比对。(注意:kivy文件中代码的缩进程度代表并列或包含关系)
举个例子:仅一个文件:逻辑代码+ui代码
###逻辑代码+ui代码
from kivy.app import App
from kivy.uix.boxlayout import BoxLayout
from kivy.uix.button import Button
class Box(BoxLayout):
def __init__(self):
super().__init__()
#添加一个按钮
self.button=Button(
text='first box'
)
#将按钮添加到布局
self.add_widget(self.button)
class TestApp(App):
def build(self):
return Box()
if __name__=="__main__":
TestApp().run()
两个文件:逻辑代码 ui代码分别写
###逻辑代码
from kivy.app import App
from kivy.uix.boxlayout import BoxLayout
from kivy.uix.button import Button
class Box(BoxLayout):
pass
# class Box(BoxLayout):
# def __init__(self):
# super().__init__()
# self.button=Button(
# text='first box'
# )
#
# self.add_widget(self.button)
#
class TestApp(App):
def build(self):
return Box()
if __name__=="__main__":
TestApp().run()
###ui代码
<Box>:
BoxLayout:
Button:
text:'first box'
下图是用户界面
中文显示:
kivy不支持中文,需要下载msyh.ttc(一种ttc格式的雅黑常规字体),然后在文件中指定所使用的字体
将上面的test.ky加上font_name:'msyh.ttc'(注意font_name中为msy.ttc的路径,这里我把它和.kv文件放到了同一个包中)
<Box>:
BoxLayout:
Button:
#在kivy文件中设置各种属性时,末尾不需要加','
text:"你好呀"
font_name:'msyh.ttc'
<Box>:
BoxLayout:
Button:
text:'jg'
基础控件:
坐标轴:
与数学中坐标轴相同,x表示横坐标,y表示纵坐标,(0,0)为左下角的原点
尺寸:
size/size_hint在kivy中是通用的,用列表或元组来表示(除特殊说明外,以下基础控件都适用)。
属性 | 描述 |
size_hint | 相较于父窗口的比例,使用元组或列表表示。比例用0-1的值表示,小数点前的0.可以省略不写。 当父窗口变化时,控件随之变化。 |
size | 控件尺寸大小为固定值。当父窗口变化时,控件大小不变。 若想设置控件尺寸大小为固定值,需要指定size_hint=[None,None] |
###相对尺寸:
class Box(FloatLayout):
# pass
def __init__(self):
super().__init__()
self.button=Button(
text='jg',
font_name='msyh.ttc',
###相对尺寸
##整体设置
size_hint=(0.3,0.2)#x轴比例设为0.3,y轴比例设为0.2
##可以单独设置,若只设置一个方向,另一个方向与父窗口该方向的尺寸相同
#size_hint_x=0.2,
#size_hint_y=0.2
)
self.add_widget(self.button)
当父窗口变化时,子窗口尺寸也变化。需要注意在使用盒子布局时,相对尺寸会失效,这里使用了FloatLayout布局。
###固定尺寸
class Box(FloatLayout):
#pass
def __init__(self):
super().__init__()
self.button=Button(
text='jg',
font_name='msyh.ttc',
###固定尺寸
size_hint=[None,None],
size=(200,200)
)
self.add_widget(self.button)
当父窗口变化时,子窗口尺寸不会变化。
位置:
pos/pos_hint在kivy中是通用的,用法与size/size_hint相似。需要注意在使用pos属性时,不必将pos_hint设置为None。
属性 | 描述 |
pos_hint | 可以用6个参数描述位置。以按钮为例,按钮的左边界、中线、右边界距离y轴的参数分别为x,center_x,right;按钮的上边界、中线、下边界距离x轴的参数分别为top,center_y,y。 设置pos_hint属性需要传入一个字典,如:{'x':0.2,'center_y':0.5} |
pos | 如:[200,100] |
###相对位置
当父窗口变化时,按钮位置也变化。
<Box>:
FloatLayout:
Button:
text:"你好呀"
font_name:'msyh.ttc'
size_hint:[None,None]
size:[200,200]
pos_hint:{'x':0.2,'center_y':0.5}
###固定位置
下图是pos:[20,50]的button位置,20指左边界距离y轴,50指下边界距离x轴。当父窗口变化时,按钮位置不变,而未显现的部分仅被父窗口遮挡住了。
Button属性:
kivy中使用Button类创建按钮,按钮上可以放置图片、文本,也可以用来监听用户的行为。注意若未同时指定按钮的尺寸和位置,在运行程序时,kivy会自动放大根控件,使整个按钮充满窗口。
###设置颜色背景
class ButtonTest(FloatLayout):
def __init__(self):
super().__init__()
self.button=Button(
size_hint=(.3, .3),#通用
pos=(100, 100),#通用
background_color=(1, 1, 1,1),#背景采用rgb,第四个参数为透明度。这个地方颜色为灰
text='你好呀',
font_name='msyh.ttc',
font_size='15sp',
color=[1,0,1,1],#文本字体颜色采用rgb,第四个参数为透明度
state='normal',#按钮状态,默认为normal(未点击按钮时 即可显示背景颜色),可设置成'down'(点击按钮后 显示背景颜色)
#按钮状态为normal时,除被点击时,其余时间的背景均为所设置的背景
#按钮状态为down时,除未点击前和被点击时,其余时间的背景均为所设置的背景
disabled=False,#若为True则禁用该按钮,默认为False
)
self.add_widget(self.button)
未点击前+点击后 点击时
class ButtonTest(FloatLayout):
def __init__(self):
super().__init__()
self.button=Button(
size_hint=(.3, .3),#通用
pos=(100, 100),#通用
background_color=(1, 1, 1,1),#背景采用rgb,第四个参数为透明度。这个地方颜色为灰
text='你好呀',
font_name='msyh.ttc',
font_size='15sp',
color=[1,0,1,1],#文本字体颜色采用rgb,第四个参数为透明度
state='down',#按钮状态,默认为normal(未点击按钮时 即可显示背景颜色),可设置成'down'(点击按钮后 显示背景颜色)
#按钮状态为normal时,除被点击时,其余时间的背景均为所设置的背景
#按钮状态为down时,除未点击前和被点击时,其余时间的背景均为所设置的背景
disabled=False,#若为True则禁用该按钮,默认为False
)
self.add_widget(self.button)
未点击前+点击时 点击后
###设置图片背景
class ButtonTest(FloatLayout):
def __init__(self):
super().__init__()
self.button=Button(
size_hint=(.5, .5),#通用
pos=(50, 50),#通用
#background_color=(1, 1, 1,1),#背景采用rgb,第四个参数为透明度。这个地方颜色为灰
text='你好呀',
font_name='msyh.ttc',
font_size='15sp',
color=[1,0,1,1],#文本字体颜色采用rgb,第四个参数为透明度
state='normal',#按钮状态,默认为normal(未点击按钮时 即可显示背景颜色),可设置成'down'(点击按钮后 显示背景颜色)
#按钮状态为normal时,除被点击时,其余时间的背景均为所设置的背景
#按钮状态为down时,除未点击前和被点击时,其余时间的背景均为所设置的背景
disabled=False,#若为True则禁用该按钮,默认为False
background_down='灯泡.jpg',
background_normal='花海.jpeg'
)
self.add_widget(self.button)
未点击前+点击后 点击时
class ButtonTest(FloatLayout):
def __init__(self):
super().__init__()
self.button=Button(
size_hint=(.5, .5),#通用
pos=(50, 50),#通用
#background_color=(1, 1, 1,1),#背景采用rgb,第四个参数为透明度。这个地方颜色为灰
text='你好呀',
font_name='msyh.ttc',
font_size='15sp',
color=[1,0,1,1],#文本字体颜色采用rgb,第四个参数为透明度
state='down',#按钮状态,默认为normal(未点击按钮时 即可显示背景颜色),可设置成'down'(点击按钮后 显示背景颜色)
#按钮状态为normal时,除被点击时,其余时间的背景均为所设置的背景
#按钮状态为down时,除未点击前和被点击时,其余时间的背景均为所设置的背景
disabled=False,#若为True则禁用该按钮,默认为False
background_down='灯泡.jpg',
background_normal='花海.jpeg'
)
self.add_widget(self.button)
未点击前+点击时 点击后
###Button的两个事件
事件 | 说明 |
on_press | 按下按钮时触发该事件 |
on_release | 按下按钮并释放时触发该事件 |
可以在kv文件设置触发事件的回调函数root.callback(参数)或在py文件使用bind()绑定处理函数。注意在回调函数中添加一个形参来结束绑定事件传过来的对象。
支持一个触发事件内调用多个回调函数。
###逻辑代码+ui代码
from kivy.app import App
from kivy.uix.floatlayout import FloatLayout
from kivy.uix.button import Button
class ButtonTest(FloatLayout):
def __init__(self):
super().__init__()
self.button01=Button(
size_hint=(.5, .5),#通用
pos=(50, 50),#通用
text='你好呀',
font_name='msyh.ttc',
font_size='15sp',
color=[1,0,1,1],#文本字体颜色采用rgb,第四个参数为透明度
)
self.button01.bind(on_press=self.button01_clicked)#传入回调函数名,不需要传入()
self.add_widget(self.button01)
def button01_clicked(self,but):#需要添加一个形参来接受绑定事件的对象
#此处形参为but,可以在这个函数中使用形参
print('%s被点击了'%but.text)
class TestApp(App):
def build(self):
return ButtonTest()
if __name__=="__main__":
TestApp().run()
###逻辑代码与ui代码分开写
#逻辑代码
from kivy.app import App
from kivy.uix.floatlayout import FloatLayout
from kivy.uix.button import Button
class ButtonTest(FloatLayout):
pass
#当不需要获得按钮的某些属性时,可以不添加形参
def button01_clicked(self):
print('df')
#需要获得按钮的某些属性时,添加形参
#def button01_clicked(self,but):
#print('df')
#but.text='别碰我'
#print('修改后的按钮:',but.text)
class TestApp(App):
def build(self):
return ButtonTest()
if __name__=='__main__':
TestApp().run()
#ui代码
<ButtonTest>:
Button:
text:'你好呀'
font_name:'msyh.ttc'
size_hint:[None,None]
size:[100,100]
#绑定事件:当不需要获得按钮的某些属性时,可以不添加形参
on_press:root.button01_clicked()#函数需要添加()
on_release:root.button01_clicked()
##绑定事件:需要获得按钮的某些属性时,添加形参self
#on_press:root.button01_clicked(self)#函数需要添加()
#on_release:root.button01_clicked(self)
文章持续更新中~~~