代码之家 › 专栏 › 技术社区 › Alter

kivy-如何更改网格布局内元素的大小?

kivy python

Alter · 技术社区 · 8 年前

我是Kivy框架的新手,正在尝试使用GridLayout创建三列。在第3列中,我想将元素的宽度更改为更小并右对齐(我不想更改整个列宽),但是我的尝试不起作用。

主要.py

从kivy.app导入app 从kivy.uix.widget导入小部件类AppCore(小部件): 通过类testapp(app): 定义构建(自身): 返回appcore() def run_app(): testapp().run()。如果“名称”= 运行应用程序()


   试验.kv

应用程序核心
网格布局:
科尔斯:3
尺寸:根宽×0.8,根高×0.8

行\默认高度:30
行强制默认值:真
中心:ROOT.WIDTH/2,ROOT.HEIGH/2

标签:
text:'你好,世界'

文本输入:
ID:文本字段
多行:假

按钮:
身份证:但是
填充\右:0
宽度:10
.

主.py


from kivy.app import App
from kivy.uix.widget import Widget

class AppCore(Widget):
    pass

class TestApp(App):
    def build(self):
        return AppCore()

def run_app():
    TestApp().run()

if __name__ == '__main__':
    run_app()


测试.kv

<AppCore>
    GridLayout:
        cols: 3
        size: root.width * 0.8, root.height * 0.8

        row_default_height: 30
        row_force_default: True
        center: root.width / 2, root.height / 2

        Label:
            text: 'hello world'

        TextInput:
            id: text_field
            multiline: False

        Button:
            id: f_but
            padding_right: 0
            width: 10

2 回复 | 直到 8 年前

eyllanesc 8 年前

解决方案是在第三列和该布局内建立一个

应用程序核心网格布局: 科尔斯:3 尺寸:根宽×0.8,根高×0.8 行\默认高度:30 行强制默认值:真中心:ROOT.WIDTH/2,ROOT.HEIGH/2 标签: text:'你好,世界' 文本输入: ID:文本字段多行:假锚定布局: 锚_x:'右' 按钮: 身份证:但是宽度:40 大小\u提示\u x:无


   

为了更好地可视化,让我们放置背景色:

应用程序核心
网格布局:
科尔斯:3
尺寸:根宽×0.8,根高×0.8
行\默认高度:30
行强制默认值:真
中心:ROOT.WIDTH/2,ROOT.HEIGH/2

标签:
text:'你好,世界'

画布。之前:
颜色:
RGBA:1、0、0、1
矩形:
位置:self.pos
大小:self.size

文本输入:
ID:文本字段
多行:假

锚定布局:
锚_x:'右'
画布。之前:
颜色:
RGBA:0、0、1、1
矩形:
位置:self.pos
大小:self.size
按钮:
身份证:但是
宽度:40
大小\u提示\u x:无

在第三列中,在该布局中,按钮:

<AppCore>
    GridLayout:
        cols: 3
        size: root.width * 0.8, root.height * 0.8
        row_default_height: 30
        row_force_default: True
        center: root.width / 2, root.height / 2

        Label:
            text: 'hello world'

        TextInput:
            id: text_field
            multiline: False

        AnchorLayout:
            anchor_x: 'right'
            Button:
                id: f_but
                width: 40
                size_hint_x: None




为了更好地可视化,让我们放置背景色:

<AppCore>
    GridLayout:
        cols: 3
        size: root.width * 0.8, root.height * 0.8
        row_default_height: 30
        row_force_default: True
        center: root.width / 2, root.height / 2

        Label:
            text: 'hello world'

            canvas.before:
                Color:
                    rgba: 1, 0, 0, 1
                Rectangle:
                    pos: self.pos
                    size: self.size

        TextInput:
            id: text_field
            multiline: False

        AnchorLayout:
            anchor_x: 'right'
            canvas.before:
                Color:
                    rgba: 0, 0, 1, 1
                Rectangle:
                    pos: self.pos
                    size: self.size
            Button:
                id: f_but
                width: 40
                size_hint_x: None

rafaeljneves 8 年前

尝试 size_hint_x: -0.5

而不是 width 属性。

使用 GridLayout ,可以使用“大小提示”x将列高度固定为特定大小。

应用更改:

测试.kv

<AppCore>
    GridLayout:
        cols: 3
        size: root.width * 0.8, root.height * 0.8

        row_default_height: 30
        row_force_default: True
        center: root.width / 2, root.height / 2

        Label:
            text: 'hello world'

        TextInput:
            id: text_field
            multiline: False

        Button:
            id: f_but
            padding_right: 0
            size_hint_x: -0.5

希望能帮上忙。