Kivy 网格布局固定了某些列的列宽

Posted 2023-04-14

【中文标题】Kivy 网格布局固定了某些列的列宽

【英文标题】：Kivy grid layout fixed column width for some columns

【发布时间】：2016-03-26 18:05:20

【问题描述】：

我想构建一个网格布局，其中某些列具有固定宽度（以包含图像），而其他列应占用可用空间。这是我目前的情况（最后一栏）：

正如您在蓝色背景上看到的那样，列对于图像来说太大了。但是，由于有更多列的大小应该相对于可用宽度，我不能使用网格布局的col_force_default 属性。

那么是否可以在固定某些列的宽度的同时仍然让其他列占用所有可用空间？

这是我的 kv 文件的摘录：

<EditWorkoutExcerciseRow@GridLayout>
    exRepetitionsRound: ex_repetitions_round
    exRepetitionsText: ex_repetitions_ti
    exNameLabel: ex_name_label
    exDeleteBtn:ex_delete_btn
    exUpBtn:ex_up_btn
    exDownBtn: ex_down_btn


    TextInput:
        id: ex_repetitions_round
        multiline:False
        size_hint:(0.25,1)
        padding:(10,10,10,10)

    TextInput:
        size_hint:(0.25,1)
        id: ex_repetitions_ti
        multiline:False
        padding:(10,10,10,10)

    Label:
        size_hint:(0.5,1)
        id: ex_name_label
        text:''


    Button:
        id:ex_delete_btn
        background_normal:''
        background_pressed:''
        background_disabled:''
        background_color:(0,0,1,1)
        padding:(10,10)

        Image:
            source:'data/image/delete.png'

            size: (40,40)
            y: self.parent.y + self.parent.height + 20
            x: self.parent.x + 15
            allow_stretch: False
            keep_ratio: True

    Button:
        id:ex_up_btn
        background_normal:''
        background_pressed:''
        background_disabled:''
        background_color:(0,0,0,0)

        Image:
            source:'data/image/arrow_up.png'
            y: self.parent.y + self.parent.height + 20
            x: self.parent.x + 20
            size: '40dp', '40dp'
            allow_stretch: True
    Button:
        id:ex_down_btn
        background_normal:''
        background_pressed:''
        background_disabled:''
        background_color:(0,0,0,0)

        Image:
            source:'data/image/arrow_down.png'
            y: self.parent.y + self.parent.height + 20
            x: self.parent.x + 15
            size: 40, 40
            allow_stretch: True

如您所见，我对大小值进行了一些实验，但到目前为止还没有结果。感谢帮助！

【参考方案1】：

我通过将这些按钮添加到嵌套网格布局并在那里设置固定列宽来解决它。 我想避免不必要的嵌套布局，但我想不出更清洁的解决方案。 如果有人知道更好的答案，请不要犹豫，发布它，我会保持开放状态。

<EditWorkoutExcerciseRow@GridLayout>
    exRepetitionsRound: ex_repetitions_round
    exRepetitionsText: ex_repetitions_ti
    exNameLabel: ex_name_label
    exDeleteBtn:ex_delete_btn
    exUpBtn:ex_up_btn
    exDownBtn: ex_down_btn


    TextInput:
        id: ex_repetitions_round
        multiline:False
        size_hint:(0.2,1)
        padding:(10,10,10,10)

    TextInput:
        size_hint:(0.2,1)
        id: ex_repetitions_ti
        multiline:False
        padding:(10,10,10,10)

    Label:
        size_hint:(0.3,1)
        id: ex_name_label
        text:''

    GridLayout:
        size_hint:(0.3,1)
        cols:3
        rows:1
        col_default_width:50
        col_force_default:True
        spacing:10,10
        Button:
            id:ex_delete_btn
            background_normal:''
            background_pressed:''
            background_disabled:''
            background_color:(0,0,0,0)
            size:50,50
            Image:
                source:'data/image/delete.png'
                size:(50,50)
                y: self.parent.y
                x: self.parent.x
                allow_stretch: True
                keep_ratio: True
        Button:
            id:ex_up_btn
            background_normal:''
            background_pressed:''
            background_disabled:''
            background_color:(0,0,0,0)
            size:50,50
            Image:
                source:'data/image/arrow_up.png'
                size:(50,50)
                y: self.parent.y
                x: self.parent.x
                allow_stretch: True
                keep_ratio: True


        Button:
            id:ex_down_btn
            background_normal:''
            background_pressed:''
            background_disabled:''
            background_color:(0,0,0,0)
            size:50,50
            Image:
                source:'data/image/arrow_down.png'
                y: self.parent.y
                x: self.parent.x
                size:50,50
                allow_stretch: True