2

我试图在我的窗口中放置 5 个按钮，并排成一行，每个按钮应该具有相同的宽度，同时占据父级中的所有可用空间。这是我正在尝试的方式（失败）：

Row {
      id: toolbar
      width: 300
      height: 80

      Button {
        text: "left"
      }

      Button {
        text: "right"
      }

      Button {
        text: "tab"
      }

      Button {
        text: "home"
      }

      Button {
        text: "end"
      }
}

在此示例中，Button项目不会调整大小以适合其父项。我希望每个人都Button获得其父母宽度的 1/5。显然，使用Row是不够的。

此外，使用：

width: parent.width / parent.children.count

在每个 Button 中都失败了，parent.children.count就像undefined. 当一切都准备好时，可以使用Component.onCompleted设置宽度，但必须有更好的方法。

是否有一个选项Row对其子项强制使用宽度？或者还有什么其他布局选项？

4

1 回答 1

1

Button就我个人而言，这样做时，我会使用 Repeater 和 ListModel 或文本数组，这样您就可以轻松知道要拥有多少个并正确调整它们的大小

ListModel {
    id: modelButtons
    ListElement { buttonText: "left" }
    ListElement { buttonText: "right" }
    ListElement { buttonText: "tab" }
    ListElement { buttonText: "home" }
    ListElement { buttonText: "end" }
}

Row {
    id: toolbar
    width: 300
    height: 80

    Repeater {
        id: repeaterButton
        model: modelButtons
        delegate: Button {
            width: toolbar.width / repeaterButton.model.count
            text: buttonText
        }
    }
}
于 2014-04-13T09:56:24.603 回答