QML-TableView: Center CheckBox in Cell
-
wrote on 8 Dec 2015, 07:33 last edited by
Hy!
I have some troubles by creating a table view. I want to create a table, wich contains a checkbox, but I have no idea how to center this checkbox in the cell.
TableView { width: parent.width height: parent.height-50 id: alarmTableInt style : TableViewStyle { textColor: pallete.textColor } model: prjCont.model //model: tmodel rowDelegate: Rectangle { id: row height: pallete.table_RowHeight width: parent.width color: styleData.alternate ? pallete.bgColor : pallete.altBgColor border.color: styleData.selected ? pallete.selectedTextColor : row.color border.width: styleData.selected ? 1 : 0 } headerDelegate: Rectangle { height: 25 Text { anchors.fill: parent text: styleData.value renderType: Text.NativeRendering color: pallete.textColor verticalAlignment: Text.AlignVCenter horizontalAlignment: Text.AlignHCenter } border.width: 1 border.color: pallete.textColor color: pallete.altBgColor } . . . TableViewColumn { id: checkedCol role: "checked" title: "checked" width: 50 delegate: CheckBox { anchors.fill: parent checked: styleData.value enabled: true onClicked: { var srcIndex = prjCont.model.mapToSource(prjCont.model.index(styleData.row,0)); prjCont.model.getEntry(srcIndex.row).checked = !prjCont.model.getEntry(styleData.row).checked; console.debug("row in Table " + styleData.row + " mapToSource " + srcIndex.row ); console.debug("-got: " + prjCont.model.getEntry(srcIndex.row).checked); } } }
maybe someone has an idea how to center "checked" in the cell.
best regards
Harry -
Hy!
I have some troubles by creating a table view. I want to create a table, wich contains a checkbox, but I have no idea how to center this checkbox in the cell.
TableView { width: parent.width height: parent.height-50 id: alarmTableInt style : TableViewStyle { textColor: pallete.textColor } model: prjCont.model //model: tmodel rowDelegate: Rectangle { id: row height: pallete.table_RowHeight width: parent.width color: styleData.alternate ? pallete.bgColor : pallete.altBgColor border.color: styleData.selected ? pallete.selectedTextColor : row.color border.width: styleData.selected ? 1 : 0 } headerDelegate: Rectangle { height: 25 Text { anchors.fill: parent text: styleData.value renderType: Text.NativeRendering color: pallete.textColor verticalAlignment: Text.AlignVCenter horizontalAlignment: Text.AlignHCenter } border.width: 1 border.color: pallete.textColor color: pallete.altBgColor } . . . TableViewColumn { id: checkedCol role: "checked" title: "checked" width: 50 delegate: CheckBox { anchors.fill: parent checked: styleData.value enabled: true onClicked: { var srcIndex = prjCont.model.mapToSource(prjCont.model.index(styleData.row,0)); prjCont.model.getEntry(srcIndex.row).checked = !prjCont.model.getEntry(styleData.row).checked; console.debug("row in Table " + styleData.row + " mapToSource " + srcIndex.row ); console.debug("-got: " + prjCont.model.getEntry(srcIndex.row).checked); } } }
maybe someone has an idea how to center "checked" in the cell.
best regards
Harrywrote on 8 Dec 2015, 07:43 last edited byI have allready tried:
delegate: CheckBox { //anchors.fill: parent checked: styleData.value enabled: true width: parent.width height: pallete.table_RowHeight anchors.centerIn: parent
Allso "x:" and "y:" doesn't work
-
wrote on 8 Dec 2015, 09:15 last edited by
with
delegate: CheckBox { checked: styleData.value enabled: true anchors.baseline: parent.verticalCenter
the checkbox is vertical centered in the cell, but i have no idea how to do this for vertical and horizontal center
-
wrote on 13 Oct 2016, 09:11 last edited by
I "solved"this problem by putting the checkbox in a separate QML file, and set the left margin to almost half of the parent width.
anchors.left: parent.left anchors.lefMargin: parent.width/2 - 6 // assuming the checkbox is about 12 pixels