Unable to horizontally center items in ColumnLayout - qt

Question

Trying to center items in a ColumnLayout (nested into a StackLayout) but doesn't seem to work.
The StackLayout contains also a Canvas which I used to verify that Layout.fillWidth: true is working as expected. So I assume also the ColumnLayout is filling width (i.e. the problem is not the outer StackLayout), although I cannot understand what problem it has.
import QtQuick 2.15
import QtQuick.Window 2.15
import QtQuick.Controls 2.15
import QtQuick.Layouts 1.3
Window {
id: mainWindow
width: 340
height: 380
visible: true
title: qsTr("Hello")
TabBar {
id: tabBar
width: parent.width
TabButton {text: "Layout"}
TabButton {text: "Canvas"}
}
StackLayout {
anchors.fill: parent
anchors.topMargin: tabBar.height
currentIndex: tabBar.currentIndex
ColumnLayout {
Layout.fillWidth: true
spacing: 10
Label {
Layout.alignment: Qt.AlignCenter
text: "Regular buttons:"
}
RowLayout {
Layout.alignment: Qt.AlignCenter
spacing: 10
Button {text: "Normal"}
Button {text: "Highlighted"; highlighted: true}
DelayButton {text: "Delay"}
}
Label {
Layout.alignment: Qt.AlignCenter
text: "Checkboxes:"
}
RowLayout {
Layout.alignment: Qt.AlignCenter
spacing: 10
CheckBox {text: "Checkbox 1"}
CheckBox {text: "Checkbox 2"}
}
Label {
Layout.alignment: Qt.AlignCenter
text: "Radiobuttons:"
}
RowLayout {
Layout.alignment: Qt.AlignCenter
spacing: 10
RadioButton {text: "Radiobutton 1"}
RadioButton {text: "Radiobutton 2"}
}
Label {
Layout.alignment: Qt.AlignCenter
text: "Miscellaneous:"
}
Switch {
Layout.alignment: Qt.AlignCenter
text: "Switch"
}
}
Canvas {
Layout.fillWidth: true
Layout.fillHeight: true
Layout.maximumHeight: 100
Layout.margins: 2
onPaint: {
var ctx = getContext('2d')
ctx.reset()
ctx.strokeStyle = 'black'
ctx.lineWidth = 2
ctx.beginPath()
ctx.moveTo(0, 0)
ctx.lineTo(width, height)
ctx.stroke()
ctx.beginPath()
ctx.moveTo(width, 0)
ctx.lineTo(0, height)
ctx.stroke()
}
}
}
}