Kivy 教程

Kivy - 主页

Kivy 基础知识

Kivy - 入门 Kivy - 安装 Kivy - 架构 Kivy - 文件语法 Kivy - 应用程序 Kivy - Hello World Kivy - 应用生命周期 Kivy - 事件 Kivy - 属性 Kivy - 输入 Kivy - 行为

Kivy 按钮

Kivy - 按钮 Kivy - 按钮事件 Kivy - 按钮颜色 Kivy - 按钮大小 Kivy - 按钮位置 Kivy - 圆形按钮 Kivy - 禁用按钮 Kivy - 图片按钮

Kivy 小部件

Kivy -小部件 Kivy - 标签 Kivy - 文本输入 Kivy - 画布 Kivy - 线条 Kivy - 复选框 Kivy - 下拉列表 Kivy - 窗口 Kivy - ScrollView Kivy - 轮播 Kivy - 滑块 Kivy - 图像 Kivy - 弹出窗口 Kivy - 开关 Kivy - 旋转器 Kivy - 拆分器 Kivy - 进度条 Kivy - 气泡 Kivy - 选项卡式面板 Kivy - 散点图 Kivy - 手风琴 Kivy - 文件选择器 Kivy - 颜色选择器 Kivy - 代码输入 Kivy - 模态视图 Kivy - 切换按钮 Kivy - 相机 Kivy - 树形视图 Kivy - reStructuredText Kivy - 操作栏 Kivy - 视频播放器 Kivy - 模板视图 Kivy - VKeyboard Kivy - 触摸涟漪 Kivy - 音频 Kivy - 视频 Kivy - 拼写 Kivy - 效果 Kivy - 输入记录器 Kivy - OpenGL Kivy - 文本 Kivy - 文本标记 Kivy - 设置

Kivy 布局

Kivy - 布局 Kivy - 浮动布局 Kivy - 网格布局 Kivy - 框布局 Kivy - 堆栈布局 Kivy - 锚点布局 Kivy - 相对布局 Kivy - 页面布局 Kivy - 循环布局 Kivy - 布局中的布局

Kivy 高级概念

Kivy - 配置对象 Kivy - Atlas Kivy - 数据加载器 Kivy - 缓存管理器 Kivy - 控制台 Kivy - 动画 Kivy - MultiStroke Kivy - 时钟 Kivy - SVG Kivy - UrlRequest Kivy - 剪贴板 Kivy - 工厂 Kivy - 手势 Kivy - 语言 Kivy - 图形 Kivy - 绘图 Kivy - 打包 Kivy - Garden Kivy - 存储 Kivy - 矢量 Kivy - Utils Kivy - Inspector 工具 Kivy - 工具 Kivy - 日志 Kivy - 帧缓冲区

Kivy 应用程序和项目

Kivy - 绘图应用程序 Kivy - 计算器应用程序 Kivy - 秒表应用程序 Kivy - 相机处理 Kivy - 图像查看器 Kivy - 贝塞尔曲线 Kivy - 画布应力 Kivy - 圆形绘制 Kivy - 小部件动画 Kivy - 杂项

Kivy - 网格布局

GridLayout 是 Kivy 中常用的布局类型之一。GridLayout 对象充当容器网格。它将窗口区域划分为指定数量的行和列,并将其他小部件放入单元格中。

GridLayout 类在 kivy.uix.gridlayout 模块中定义。该对象必须至少定义其中一个属性 - rows 和 cols。如果您未指定这两个中的任何一个,Kivy 会抛出 GridLayoutException。

from kivy.uix.gridlayout import GridLayout
grid = GridLayout(**kwargs)

GridLayout 对象的属性如下 −

  • cols −网格中的列数。您不能再将其设置为负值。cols 是一个 NumericProperty,默认为 None。

  • rows − 网格中的行数。您不能再将其设置为负值。rows 是一个 NumericProperty,默认为 None。

  • cols_minimum − 每列的最小宽度字典。字典键是列号(例如 0、1、2……)。它是一个 DictProperty,默认为 {}。

  • rows_minimum − 每行的最小高度字典。字典键是行号(例如 0、1、2……)。它是一个 DictProperty,默认为 {}。

  • minimum_width − 自动计算包含所有子项所需的最小宽度。它是一个 NumericProperty,默认为 0。它是只读的。

  • minimum_height − 自动计算包含所有子项所需的最小高度。它是一个 NumericProperty,默认为 0。它是只读的。

  • orientation − 布局的方向。此属性确定小部件如何放置在网格中的连续单元格中。"orientation"是一个 OptionProperty。其有效值为 −

    • 'lr-tb' −单元格按从左到右、从上到下的顺序填充。

    • 'tb-lr' − 单元格按从上到下、从左到右的顺序填充。

    • 'rl-tb' − 单元格按从右到左、从上到下的顺序填充。

    • 'tb-rl' − 单元格按从上到下、从右到左的顺序填充。

    • 'lr-bt' − 单元格按从左到右、从下到上的顺序填充。

    • 'bt-lr' − 单元格按从下到上、从左到右的顺序填充。

    • 'rl-bt' − 单元格按从右到左、从下到上的顺序填充。

    • 'bt-rl' − 单元格按从下到上、从右到左的顺序填充。

orientation 属性的默认值为 'lr-tb'。

  • row_default_height − 行使用的默认最小大小。row_default_height 是 NumericProperty,默认为 0。

  • row_force_default − 如果为 True,则忽略子项的高度和 size_hint_y,并使用默认行高。row_force_default 是 BooleanProperty,默认为 False。

  • spacing −:子项之间的间距:[spacing_horizo​​ntal, Spacing_vertical]。 Spacing 是一个 VariableListProperty,默认为 [0, 0]。

  • padding − 布局框与其子项之间的填充:[padding_left、padding_top、padding_right、padding_bottom]。padding 是一个 VariableListProperty,默认为 [0, 0, 0, 0]。

默认情况下,所有小部件都具有相同的大小。这是因为默认的 size_hint 为 (1,1)。

def build(self):
   self.lo = GridLayout(cols=2)
   self.b1 = Button(text='Button 1', font_size=20)
   self.b2 = Button(text='Button 2', font_size=20)
   self.b3 = Button(text='Button 3', font_size=20)
   self.b4 = Button(text='Button 4', font_size=20)
   self.lo.add_widget(self.b1)
   self.lo.add_widget(self.b2)
   self.lo.add_widget(self.b3)
   self.lo.add_widget(self.b4)
   return self.lo

使用此代码,您将获得以下布局 −

Kivy Grid Layouts

现在,让我们将 Hello 按钮的大小固定为 250px,而不是使用"size_hint_x=None"。

self.lo = GridLayout(cols = 2)

self.b1 = Button(
   text='Button 1', font_size=20,
   size_hint_x=None, width=250
)

self.b2 = Button(text='Button 2', font_size=20)

self.b3 = Button(
   text='Button 3', font_size=20,
   size_hint_x=None, width=250
)

self.b4 = Button(text='Button 4', font_size=20

App 窗口显示如下 −

Kivy Grid Layouts2

如果我们将 row_default_height 定义为 100 并设置"row_force_default=True"−

self.lo = GridLayout(
cols=2, row_force_default=True, row_default_height=100
)
self.b1 = Button(
text='Button 1', font_size=20, size_hint_x=None, width=250
)
self.b2 = Button(text='Button 2', font_size=20)
self.b3 = Button(
text='Button 3', font_size=20, size_hint_x=None, width=250
)
self.b4 = Button(text='Button 4', font_size=20)

现在窗口显示为 −

Kivy Grid Layouts

示例 1

在此程序中,我们在具有四列的网格布局中添加了 15 个按钮。每个按钮的标题都是一个唯一但随机生成的数字,介于 1 到 15 之间。random 模块中的 randint() 函数用于此目的。

from kivy.app import App
from kivy.uix.button import Button
from kivy.uix.gridlayout import GridLayout
from kivy.config import Config
import random

Config.set('graphics', 'width', '720')
Config.set('graphics', 'height', '400')
Config.set('graphics', 'resizable', '1')

class MyApp(App):
   def build(self):
      self.grid = GridLayout(cols = 4)
      nums=[]
      for i in range(1,16):
         while True:
            num = random.randint(1,15)
            if num not in nums:
               nums.append(num)
               self.grid.add_widget(Button(text = str(num)))
               break
      return self.grid

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

输出

当你运行此代码时,它将产生以下输出窗口 −

Kivy 网格布局

示例 2

Kivy 中的 GridLayout 无法将小部件跨行和/或跨列放置。也无法按行号和列号放置小部件。

需要在两列网格中排列一些标签和文本输入框,但下面的提交按钮应跨两列。为了实现这一点,我们将一个两列网格放在一列网格内,并在其下方放置一个按钮。

from kivy.app import App
from kivy.uix.label import Label
from kivy.uix.button import Button
from kivy.uix.textinput import TextInput
from kivy.uix.gridlayout import GridLayout
from kivy.core.window import Window

Window.size = (720, 400)

class DemoApp(App):
   def build(self):
      self.grid = GridLayout(rows=2)
      self.top_grid = GridLayout(
         cols=2, row_force_default=True,
         row_default_height=100
      )
      self.top_grid.cols = 2
      self.top_grid.add_widget(
         Label(text="Name: ", size_hint_x=None, width=250)
      )
      self.fname = TextInput(
         multiline=False, size_hint_x=None, width=650
      )
      self.top_grid.add_widget(self.fname)
      self.top_grid.add_widget(Label(text="Address: "))
      self.address = TextInput(multiline=True)
      self.top_grid.add_widget(self.address)
      self.top_grid.add_widget(Label(text="College: "))
      self.college = TextInput(multiline=False)
      self.top_grid.add_widget(self.college)
      self.grid.add_widget(self.top_grid)
      self.b1 = Button(text='Submit', size_hint_y=None, height=200)
      self.grid.add_widget(self.b1)
      return self.grid
   
if __name__ == '__main__':
   DemoApp().run()

输出

当你运行此代码时,它将产生以下输出窗口 −

Kivy 网格布局提交