부모에 맞게 행의 모든 자식 크기를 동일하게 조정합니다.
-
21-12-2019 - |
문제
내 창에 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
각 버튼에서 다음과 같이 실패합니다. parent.children.count
~이다 undefined
.하나는 사용할 수 있습니다 Component.onCompleted
너비를 설정하려면 모든 것이 이미 준비되어 있지만 더 나은 방법이 있어야 합니다.
옵션이 있나요? Row
자식에게 너비를 적용하는 것은 무엇입니까?아니면 다른 레이아웃 옵션이 있나요?
해결책
개인적으로 이 작업을 수행할 때 반복기와 ListModel 또는 텍스트 배열을 사용하여 얼마나 많은지 쉽게 알 수 있습니다. Button
당신은 그것들을 적절하게 가지고 크기를 조정할 것입니다
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
}
}
}
제휴하지 않습니다 StackOverflow