如何在 kivy 中设置网格布局的位置(x,y 坐标)?

Posted

技术标签:

【中文标题】如何在 kivy 中设置网格布局的位置(x,y 坐标)?【英文标题】:How can I set the position (x,y coordinates) of a grid layout in kivy? 【发布时间】:2012-07-25 17:35:32 【问题描述】:

我注意到,当您在 Kivy 中使用网格布局制作按钮时,它们会在 (0,0) 处创建,并根据先前按钮的长度和宽度移动多个空格。 但是,我想在屏幕底部的中间有一个 3x4 的网格。

到目前为止我有这个:

import kivy
from kivy.uix.gridlayout import GridLayout
from kivy.app import App
from kivy.uix.button import Button

class CalcApp(App):
    def build(self):
        layout = GridLayout(cols=3, row_force_default=True, row_default_height=50)
        layout.add_widget(Button(text='1', size_hint_x=None, width=100))
        layout.add_widget(Button(text='2', size_hint_x=None, width=100))
        layout.add_widget(Button(text='3', size_hint_x=None, width=100))
        layout.add_widget(Button(text='4', size_hint_x=None, width=100))
        layout.add_widget(Button(text='5', size_hint_x=None, width=100))
        layout.add_widget(Button(text='2', size_hint_x=None, width=100))
        layout.add_widget(Button(text='6', size_hint_x=None, width=100))
        layout.add_widget(Button(text='7', size_hint_x=None, width=100))
        layout.add_widget(Button(text='8', size_hint_x=None, width=100))
        layout.add_widget(Button(text='9', size_hint_x=None, width=100))
        layout.add_widget(Button(text='0', size_hint_x=None, width=100))
        layout.add_widget(Button(text='Enter', size_hint_x=None, width=100))
        return layout

CalcApp().run()

那么,我该如何改变位置呢?

【问题讨论】:

我更喜欢使用 kvlang 而不是使用这么多的 add_widget。当有人看到这段代码时,它看起来确实很奇怪。 【参考方案1】:
import kivy
from kivy.uix.gridlayout import GridLayout
from kivy.app import App
from kivy.uix.button import Button

class CalcApp(App):
    def build(self):
        layout = GridLayout(cols=3, row_force_default=True, row_default_height=50,
            pos_hint='center_x':.5 , size_hint=(None, None))
            # ^ position grid in mid horizontally, ^ make grid use custom
            # size.
        # Bind the size of the gridlayout of to it's minimum_size(calculated
        # by children size)
        layout.bind(minimum_size = layout.setter('size'))
        # bind the top of the grid to it's height'
        layout.bind(height = layout.setter('top'))
        for x in (1, 2, 3, 4, 5, 2, 6, 7, 8, 9, 0):
            layout.add_widget(Button(text=str(x), size_hint_x=None, width=100))
        layout.add_widget(Button(text='Enter', size_hint_x=None, width=100))
        return layout

CalcApp().run()

同样的代码使用 kv lang::

import kivy

from kivy.uix.gridlayout import GridLayout
from kivy.app import App
from kivy.lang import Builder

Builder.load_string('''
# a template Butt of type Button
[Butt@Button]
    # ctx.'attribute_name' is used to access the 
    # attributes defined in the instance of Butt.
    text: ctx.text
    # below vars are constant for every instance of Butt
    size_hint_x: None
    width: 100

<CalcApp>:
    cols: 3
    row_force_default: True
    row_default_height: 50
    pos_hint: 'center_x':.5
    size_hint: (None, None)
    # size is updated whenever minimum_size is.
    size: self.minimum_size
    # top is updated whenever height is.
    top: self.height
    Butt:
        text: '1'
    Butt:
        text: '2'
    Butt:
        text: '3'
    Butt:
        text: '4'
    Butt:
        text: '5'
    Butt:
        text: '2'
    Butt:
        text: '6'
    Butt:
        text: '7'
    Butt:
        text: '8'
    Butt:
        text: '9'
    Butt:
        text: '0'
    Butt:
        text: 'Enter'
''')

class CalcApp(App, GridLayout):

    def build(self):
        return self

CalcApp().run()

【讨论】:

谢谢,效果很好。而且我可能会补充说,您在某种意义上是一个“英雄”,因为我认为这个问题已经死了。此外,感谢您还添加了 kv 代码。这是我第一次接触,如果我计划广泛使用 Kivy,我计划研究 Kivy 语言。

以上是关于如何在 kivy 中设置网格布局的位置(x,y 坐标)?的主要内容,如果未能解决你的问题,请参考以下文章

在kivy中设置动态类

如何在 CSS 网格布局中设置列的最大宽度?

使用属性窗口在 QT 网格布局中设置小部件的行和列

如何使用字典在网格中获得点位置?

如何在 iPhone x 中设置安全区域布局

KIVY:如何清除所有子项的网格布局