《Python+Kivy(App开发)从入门到实践》自学笔记：FloatLayout布局

原创已于 2024-04-03 19:48:36 修改 · 1.4k 阅读

3 ·

CC 4.0 BY-SA版权

文章标签：

#python #前端 #1024程序员节

于 2022-10-17 22:12:38 首次发布

Kivy基本使用学习专栏专栏收录该内容

65 篇文章

订阅专栏

本文介绍了Kivy框架中的FloatLayout布局，它允许子部件自由定位并随窗口尺寸变化调整大小。通过Python代码和KV语言展示了如何创建和使用FloatLayout，包括设置背景、添加按钮以及利用pos_hint属性实现窗口大小变化时的位置调整。FloatLayout适用于不同分辨率设备，确保布局在窗口大小改变时保持整洁。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

章节目录与知识点总揽

2.2 FloatLayout 布局

FloatLayout——浮动布局

允许将子部件通过位置和尺寸放置在窗口的任意位置。在不同分辨率移动设备中，当窗口尺寸改变时，放置在窗口的子部件也会相应地调整大小和位置。不会因窗口大小的改变使布局变地一团糟。

2.2.1 使用步骤

1.新建一个main.py文件

2.导入App类以及相关的包，例如：FloatLayout、Button

3.创建一个类让它继承App类

4.在该类内实现build()方法

5.编写具体的布局或布局类，让其继承FloatLayout类。

6.在build()方法结尾返回具体的布局或布局类。

7.通过run()方法运行实例。

2.2.2 在.py内使用FloatLayout布局

main.py代码如下：

from kivy.app import App
from kivy.uix.button import Button
from kivy.uix.floatlayout import FloatLayout
from kivy.graphics import Rectangle,Color

class FloatLayoutApp(App):
    def build(self):
        def update_rect(layout,*args):
            #设置背景尺寸,可忽略
            layout.rect.pos = layout.pos
            layout.rect.size = layout.size

        float_layout = FloatLayout()

        #设置背景颜色（可忽略）
        with float_layout.canvas:
            Color(1,1,1,1)
            float_layout.rect = Rectangle(pos=float_layout.pos,size=float_layout.size)
            float_layout.bind(pos=update_rect,size=update_rect)

        #在布局内的[300,200]处添加一个尺寸为0.3,0.2的按钮
        button = Button(text='Hello FloatLayout',size_hint=(.3,.2),pos=(300,200))
        #将按钮添加到布局内
        float_layout.add_widget(button)
        #返回布局
        return float_layout

if __name__ == '__main__':
    FloatLayoutApp().run()

运行该文件，结果如下图：

当窗口的大小改变时，按钮的大小也会随之改变。但是位置并不会改变。因为这里给的是一个定值，如果需要位置也随之改变，需要使用pos_hint属性。

2.2.3 在kv内使用FloatLayout布局

main.py代码如下：

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

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

class FloatLayoutApp(App):
    #实现App类的build()方法（继承自App类）
    def build(self):
        return FloatLayoutWidget()

if __name__ == '__main__':
    FloatLayoutApp().run()

floatlayout.kv代码如下：

<Button>:
	font_size:40
	size_hint:0.3,0.3

<FloatLayoutWidget>:

	canvas:
		Color:
			rgba:[1,1,1,1]
		Rectangle:
			size:self.size
			pos:self.pos
	Button:
		text:'Bt0'
		background_color:0.1,0.5,0.6,1
		pos_hint:{'x':0,'top':1}
	Button:
		text:'Bt1'
		background_color:0.1,0.5,0.6,1
		pos_hint:{'x':0.35,'y':0.3}
	Button:
		text:'Bt2'
		background_color:0.1,0.5,0.6,1
		pos_hint:{'x':.7,'bottom':0}
	Button:
		text:'Bt3'
		background_color:0.1,0.5,0.6,1
		pos_hint:{'x':.7,'top':1}
	Button:
		text:'Bt4'
		background_color:0.1,0.5,0.6,1
		pos_hint:{'x':0,'bottom':1}

运行结果如下图：