amass/FluentUI
1
0
Fork 0
mirror of https://github.com/zhuzichu520/FluentUI.git synced 2025-01-23 04:14:35 +08:00
Code Issues Packages Projects Releases Wiki Activity

update

Browse Source
This commit is contained in:
朱子楚\zhuzi 2024-03-17 15:56:24 +08:00
parent c4cf4c13b8
commit 3cc615318a
2 changed files with 639 additions and 538 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

587
src/Qt5/imports/FluentUI/Controls/FluTableView.qml
View File

@ -20,16 +20,19 @@ Rectangle {
onColumnSourceChanged: { onColumnSourceChanged: {
if(columnSource.length!==0){ if(columnSource.length!==0){
var columns= [] var columns= []
var header_rows = {} var columnsData = []
var headerRow = {}
columnSource.forEach(function(item){ columnSource.forEach(function(item){
var column = Qt.createQmlObject('import Qt.labs.qmlmodels 1.0;TableModelColumn{}',table_model); var column = Qt.createQmlObject('import Qt.labs.qmlmodels 1.0;TableModelColumn{}',table_model);
column.display = item.dataIndex column.display = item.dataIndex
columnsData.push(item)
columns.push(column) columns.push(column)
header_rows[item.dataIndex] = item.title headerRow[item.dataIndex] = item.title
}) })
d.columns_data = columnsData
table_model.columns = columns table_model.columns = columns
header_model.columns = columns header_column_model.columns = columns
d.header_rows = [header_rows] header_column_model.rows = [headerRow]
} }
} }
QtObject{ QtObject{
@ -38,15 +41,15 @@ Rectangle {
property int rowHoverIndex: -1 property int rowHoverIndex: -1
property int defaultItemWidth: 100 property int defaultItemWidth: 100
property int defaultItemHeight: 42 property int defaultItemHeight: 42
property var header_rows:[] property var columns_data: []
property var editDelegate property var editDelegate
property var editPosition property var editPosition
function getEditDelegate(column){ function getEditDelegate(column){
var obj =columnSource[column].editDelegate var obj =d.columns_data[column].editDelegate
if(obj){ if(obj){
return obj return obj
} }
if(columnSource[column].editMultiline === true){ if(d.columns_data[column].editMultiline === true){
return com_edit_multiline return com_edit_multiline
} }
return com_edit return com_edit
@ -60,6 +63,14 @@ Rectangle {
id:table_model id:table_model
TableModelColumn {} TableModelColumn {}
} }
TableModel{
id:header_column_model
TableModelColumn {}
}
TableModel{
id:header_row_model
TableModelColumn { display: "rowIndex" }
}
FluTableSortProxyModel{ FluTableSortProxyModel{
id:table_sort_model id:table_sort_model
model: table_model model: table_model
@ -69,7 +80,7 @@ Rectangle {
FluTextBox{ FluTextBox{
id:text_box id:text_box
text: String(display) text: String(display)
readOnly: true === columnSource[column].readOnly readOnly: true === d.columns_data[column].readOnly
Component.onCompleted: { Component.onCompleted: {
forceActiveFocus() forceActiveFocus()
selectAll() selectAll()
@ -100,7 +111,7 @@ Rectangle {
FluMultilineTextBox { FluMultilineTextBox {
id:text_box id:text_box
text: display text: display
readOnly: true === columnSource[column].readOnly readOnly: true === d.columns_data[column].readOnly
verticalAlignment: TextInput.AlignVCenter verticalAlignment: TextInput.AlignVCenter
Component.onCompleted: { Component.onCompleted: {
forceActiveFocus() forceActiveFocus()
@ -164,14 +175,164 @@ Rectangle {
} }
} }
} }
Component{
id:com_table_delegate
MouseArea{
id:item_table_mouse
property var rowObject : control.getRow(row)
property var itemModel: model
property bool editVisible: {
if(d.editPosition === undefined){
return false
}
if(d.editPosition._key === rowObject._key && d.editPosition.column === column){
return true
}
return false
}
hoverEnabled: true
onEntered: {
d.rowHoverIndex = row
}
onWidthChanged: {
if(editVisible){
updateEditPosition()
}
}
onHeightChanged: {
if(editVisible){
updateEditPosition()
}
}
onXChanged: {
if(editVisible){
updateEditPosition()
}
}
onYChanged: {
if(editVisible){
updateEditPosition()
}
}
function updateEditPosition(){
var obj = {}
obj._key = rowObject._key
obj.column = column
obj.row = row
obj.x = item_table_mouse.x
obj.y = item_table_mouse.y + 1
obj.width = item_table_mouse.width
obj.height = item_table_mouse.height - 2
d.editPosition = obj
}
Rectangle{
id:item_table
anchors.fill: parent
property point position: Qt.point(column,row)
property bool isRowSelected: {
if(rowObject === null)
return false
if(d.current){
return rowObject._key === d.current._key
}
return false
}
color:{
if(item_table.isRowSelected){
return control.selectedColor
}
if(d.rowHoverIndex === row || item_table.isRowSelected){
return FluTheme.dark ? Qt.rgba(1,1,1,0.06) : Qt.rgba(0,0,0,0.06)
}
return (row%2!==0) ? control.color : (FluTheme.dark ? Qt.rgba(1,1,1,0.015) : Qt.rgba(0,0,0,0.015))
}
MouseArea{
anchors.fill: parent
acceptedButtons: Qt.LeftButton
onPressed:{
closeEditor()
}
onCanceled: {
}
onReleased: {
}
onDoubleClicked:{
if(typeof(display) == "object"){
return
}
d.editDelegate = d.getEditDelegate(column)
updateEditPosition()
loader_edit.display = display
}
onClicked:
(event)=>{
d.current = rowObject
closeEditor()
event.accepted = true
}
}
FluLoader{
property var model: itemModel
property var display: itemModel.display
property int row: item_table.position.y
property int column: item_table.position.x
property bool isObject: typeof(display) == "object"
property var options: {
if(isObject){
return display.options
}
return {}
}
anchors.fill: parent
sourceComponent: {
if(isObject){
return display.comId
}
return com_text
}
}
Item{
anchors.fill: parent
visible: item_table.isRowSelected
Rectangle{
width: 1
height: parent.height
anchors.left: parent.left
color: control.selectedBorderColor
visible: column === 0
}
Rectangle{
width: 1
height: parent.height
anchors.right: parent.right
color: control.selectedBorderColor
visible: column === control.columns-1
}
Rectangle{
width: parent.width
height: 1
anchors.top: parent.top
color: control.selectedBorderColor
}
Rectangle{
width: parent.width
height: 1
anchors.bottom: parent.bottom
color: control.selectedBorderColor
}
}
}
}
}
MouseArea{ MouseArea{
id:layout_mouse_table id:layout_mouse_table
hoverEnabled: true hoverEnabled: true
anchors.left: header_vertical.right anchors{
anchors.top: header_horizontal.bottom left: header_vertical.right
anchors.right: parent.right top: header_horizontal.bottom
anchors.bottom: parent.bottom right: parent.right
bottom: parent.bottom
}
onExited: { onExited: {
d.rowHoverIndex = -1 d.rowHoverIndex = -1
} }
@ -205,153 +366,7 @@ Rectangle {
onRowsChanged: { onRowsChanged: {
closeEditor() closeEditor()
} }
delegate: MouseArea{ delegate: com_table_delegate
id:item_table_mouse
property var rowObject : control.getRow(row)
property var itemModel: model
property bool editVisible: {
if(d.editPosition === undefined){
return false
}
if(d.editPosition._key === rowObject._key && d.editPosition.column === column){
return true
}
return false
}
hoverEnabled: true
onEntered: {
d.rowHoverIndex = row
}
onWidthChanged: {
if(editVisible){
updateEditPosition()
}
}
onHeightChanged: {
if(editVisible){
updateEditPosition()
}
}
onXChanged: {
if(editVisible){
updateEditPosition()
}
}
onYChanged: {
if(editVisible){
updateEditPosition()
}
}
function updateEditPosition(){
var obj = {}
obj._key = rowObject._key
obj.column = column
obj.row = row
obj.x = item_table_mouse.x
obj.y = item_table_mouse.y + 1
obj.width = item_table_mouse.width
obj.height = item_table_mouse.height - 2
d.editPosition = obj
}
Rectangle{
id:item_table
anchors.fill: parent
property point position: Qt.point(column,row)
property bool isRowSelected: {
if(rowObject === null)
return false
if(d.current){
return rowObject._key === d.current._key
}
return false
}
color:{
if(item_table.isRowSelected){
return control.selectedColor
}
if(d.rowHoverIndex === row || item_table.isRowSelected){
return FluTheme.dark ? Qt.rgba(1,1,1,0.06) : Qt.rgba(0,0,0,0.06)
}
return (row%2!==0) ? control.color : (FluTheme.dark ? Qt.rgba(1,1,1,0.015) : Qt.rgba(0,0,0,0.015))
}
MouseArea{
anchors.fill: parent
acceptedButtons: Qt.LeftButton
onPressed:{
closeEditor()
}
onCanceled: {
}
onReleased: {
}
onDoubleClicked:{
if(typeof(display) == "object"){
return
}
d.editDelegate = d.getEditDelegate(column)
updateEditPosition()
loader_edit.display = display
}
onClicked:
(event)=>{
d.current = rowObject
closeEditor()
event.accepted = true
}
}
FluLoader{
property var model: itemModel
property var display: itemModel.display
property int row: item_table.position.y
property int column: item_table.position.x
property bool isObject: typeof(display) == "object"
property var options: {
if(isObject){
return display.options
}
return {}
}
anchors.fill: parent
sourceComponent: {
if(isObject){
return display.comId
}
return com_text
}
}
Item{
anchors.fill: parent
visible: item_table.isRowSelected
Rectangle{
width: 1
height: parent.height
anchors.left: parent.left
color: control.selectedBorderColor
visible: column === 0
}
Rectangle{
width: 1
height: parent.height
anchors.right: parent.right
color: control.selectedBorderColor
visible: column === control.columns-1
}
Rectangle{
width: parent.width
height: 1
anchors.top: parent.top
color: control.selectedBorderColor
}
Rectangle{
width: parent.width
height: 1
anchors.bottom: parent.bottom
color: control.selectedBorderColor
}
}
}
}
FluLoader{ FluLoader{
id:loader_edit id:loader_edit
property var tableView: control property var tableView: control
@ -373,7 +388,7 @@ Rectangle {
onEditTextChaged: onEditTextChaged:
(text)=>{ (text)=>{
var obj = control.getRow(row) var obj = control.getRow(row)
obj[columnSource[column].dataIndex] = text obj[d.columns_data[column].dataIndex] = text
control.setRow(row,obj) control.setRow(row,obj)
} }
width: { width: {
@ -402,86 +417,16 @@ Rectangle {
} }
z:999 z:999
} }
} }
} }
Component{ Component{
id:com_handle id:com_column_header_delegate
Item {} Rectangle{
}
Component{
id:com_column_text
FluText {
id: column_text
text: modelData
anchors.fill: parent
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
}
}
FluScrollBar {
id:scroll_bar_h
anchors{
left: layout_mouse_table.left
right: layout_mouse_table.right
bottom: layout_mouse_table.bottom
}
}
FluScrollBar {
id:scroll_bar_v
anchors{
top: layout_mouse_table.top
bottom: layout_mouse_table.bottom
right: layout_mouse_table.right
}
}
TableModel{
id:header_model
rows: d.header_rows
TableModelColumn {}
}
TableView {
id: header_horizontal
model: header_model
syncDirection: Qt.Horizontal
anchors{
left: header_vertical.right
right: parent.right
top: parent.top
}
visible: control.horizonalHeaderVisible
height: visible ? Math.max(1, contentHeight) : 0
boundsBehavior: Flickable.StopAtBounds
clip: true
ScrollBar.horizontal:scroll_bar_h
columnWidthProvider: function(column) {
var columnObject = columnSource[column]
var width = columnObject.width
if(width){
return width
}
var minimumWidth = columnObject.minimumWidth
if(minimumWidth){
return minimumWidth
}
return d.defaultItemWidth
}
onContentXChanged:{
timer_horizontal_force_layout.restart()
}
Timer{
id:timer_horizontal_force_layout
interval: 50
onTriggered: {
header_horizontal.forceLayout()
}
}
delegate: Rectangle {
id:column_item_control id:column_item_control
readonly property real cellPadding: 8 readonly property real cellPadding: 8
property bool canceled: false property bool canceled: false
property int columnIndex: column property int columnIndex: column
readonly property var columnObject : columnSource[column] readonly property var columnObject : d.columns_data[column]
implicitWidth: { implicitWidth: {
return (item_column_loader.item && item_column_loader.item.implicitWidth) + (cellPadding * 2) return (item_column_loader.item && item_column_loader.item.implicitWidth) + (cellPadding * 2)
} }
@ -506,6 +451,7 @@ Rectangle {
width: 1 width: 1
height: parent.height height: parent.height
anchors.left: parent.left anchors.left: parent.left
visible: column !== 0
color:"#00000000" color:"#00000000"
} }
Rectangle{ Rectangle{
@ -601,39 +547,9 @@ Rectangle {
} }
} }
} }
TableModel{ Component{
id:model_rows id:com_row_header_delegate
TableModelColumn { display: "rowIndex" } Rectangle{
}
TableView {
id: header_vertical
boundsBehavior: Flickable.StopAtBounds
anchors.top: layout_mouse_table.top
anchors.left: parent.left
visible: control.verticalHeaderVisible
implicitWidth: visible ? Math.max(1, contentWidth) : 0
implicitHeight: syncView ? syncView.height : 0
syncDirection: Qt.Vertical
syncView: table_view
clip: true
model: model_rows
Connections{
target: table_model
function onRowCountChanged(){
model_rows.rows = Array.from({length: table_model.rows.length}, (_, i) => ({rowIndex:i+1}));
}
}
onContentYChanged:{
timer_vertical_force_layout.restart()
}
Timer{
id:timer_vertical_force_layout
interval: 50
onTriggered: {
header_vertical.forceLayout()
}
}
delegate: Rectangle{
id:item_control id:item_control
readonly property real cellPadding: 8 readonly property real cellPadding: 8
property bool canceled: false property bool canceled: false
@ -646,6 +562,7 @@ Rectangle {
width: parent.width width: parent.width
height: 1 height: 1
anchors.top: parent.top anchors.top: parent.top
visible: row !== 0
color:"#00000000" color:"#00000000"
} }
Rectangle{ Rectangle{
@ -743,6 +660,140 @@ Rectangle {
} }
} }
} }
Component{
id:com_column_text
FluText {
id: column_text
text: modelData
anchors.fill: parent
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
}
}
Item{
id: header_vertical_column
anchors{
top: header_horizontal.top
bottom: header_horizontal.bottom
left: parent.left
right: header_vertical.right
}
Rectangle{
border.color: control.borderColor
width: parent.width
height: 1
anchors.top: parent.top
color:"#00000000"
}
Rectangle{
border.color: control.borderColor
width: parent.width
height: 1
anchors.bottom: parent.bottom
color:"#00000000"
}
Rectangle{
border.color: control.borderColor
width: 1
height: parent.height
anchors.left: parent.left
color:"#00000000"
}
Rectangle{
border.color: control.borderColor
width: 1
height: parent.height
anchors.right: parent.right
color:"#00000000"
}
}
TableView {
id: header_horizontal
model: header_column_model
anchors{
left: header_vertical.right
right: layout_mouse_table.right
top: parent.top
}
visible: control.horizonalHeaderVisible
height: visible ? Math.max(1, contentHeight) : 0
boundsBehavior: Flickable.StopAtBounds
clip: true
ScrollBar.horizontal:scroll_bar_h
columnWidthProvider: function(column) {
var columnObject = d.columns_data[column]
var width = columnObject.width
if(width){
return width
}
var minimumWidth = columnObject.minimumWidth
if(minimumWidth){
return minimumWidth
}
return d.defaultItemWidth
}
onContentXChanged:{
timer_horizontal_force_layout.restart()
}
Timer{
id:timer_horizontal_force_layout
interval: 50
onTriggered: {
header_horizontal.forceLayout()
}
}
delegate: com_column_header_delegate
}
TableView {
id: header_vertical
boundsBehavior: Flickable.StopAtBounds
anchors{
top: layout_mouse_table.top
left: parent.left
}
visible: control.verticalHeaderVisible
implicitWidth: visible ? Math.max(1, contentWidth) : 0
implicitHeight: syncView ? syncView.height : 0
syncDirection: Qt.Vertical
syncView: table_view
clip: true
model: header_row_model
Connections{
target: table_model
function onRowCountChanged(){
header_row_model.rows = Array.from({length: table_model.rows.length}, (_, i) => ({rowIndex:i+1}))
}
}
onContentYChanged:{
timer_vertical_force_layout.restart()
}
Timer{
id:timer_vertical_force_layout
interval: 50
onTriggered: {
header_vertical.forceLayout()
}
}
delegate: com_row_header_delegate
}
FluScrollBar {
id:scroll_bar_h
anchors{
left: layout_mouse_table.left
right: parent.right
bottom: layout_mouse_table.bottom
}
z:999
}
FluScrollBar {
id:scroll_bar_v
anchors{
top: layout_mouse_table.top
bottom: layout_mouse_table.bottom
right: parent.right
}
z:999
}
function closeEditor(){ function closeEditor(){
d.editPosition = undefined d.editPosition = undefined
d.editDelegate = undefined d.editDelegate = undefined

590
src/Qt6/imports/FluentUI/Controls/FluTableView.qml
View File

@ -5,7 +5,6 @@ import QtQuick.Layouts
import Qt.labs.qmlmodels import Qt.labs.qmlmodels
import FluentUI import FluentUI
Rectangle { Rectangle {
property var columnSource property var columnSource
property var dataSource property var dataSource
@ -22,16 +21,19 @@ Rectangle {
onColumnSourceChanged: { onColumnSourceChanged: {
if(columnSource.length!==0){ if(columnSource.length!==0){
var columns= [] var columns= []
var header_rows = {} var columnsData = []
var headerRow = {}
columnSource.forEach(function(item){ columnSource.forEach(function(item){
var column = Qt.createQmlObject('import Qt.labs.qmlmodels 1.0;TableModelColumn{}',table_model); var column = Qt.createQmlObject('import Qt.labs.qmlmodels 1.0;TableModelColumn{}',table_model);
column.display = item.dataIndex column.display = item.dataIndex
columnsData.push(item)
columns.push(column) columns.push(column)
header_rows[item.dataIndex] = item.title headerRow[item.dataIndex] = item.title
}) })
d.columns_data = columnsData
table_model.columns = columns table_model.columns = columns
header_model.columns = columns header_column_model.columns = columns
d.header_rows = [header_rows] header_column_model.rows = [headerRow]
} }
} }
QtObject{ QtObject{
@ -40,15 +42,15 @@ Rectangle {
property int rowHoverIndex: -1 property int rowHoverIndex: -1
property int defaultItemWidth: 100 property int defaultItemWidth: 100
property int defaultItemHeight: 42 property int defaultItemHeight: 42
property var header_rows:[] property var columns_data: []
property var editDelegate property var editDelegate
property var editPosition property var editPosition
function getEditDelegate(column){ function getEditDelegate(column){
var obj =columnSource[column].editDelegate var obj =d.columns_data[column].editDelegate
if(obj){ if(obj){
return obj return obj
} }
if(columnSource[column].editMultiline === true){ if(d.columns_data[column].editMultiline === true){
return com_edit_multiline return com_edit_multiline
} }
return com_edit return com_edit
@ -62,6 +64,14 @@ Rectangle {
id:table_model id:table_model
TableModelColumn {} TableModelColumn {}
} }
TableModel{
id:header_column_model
TableModelColumn {}
}
TableModel{
id:header_row_model
TableModelColumn { display: "rowIndex" }
}
FluTableSortProxyModel{ FluTableSortProxyModel{
id:table_sort_model id:table_sort_model
model: table_model model: table_model
@ -71,7 +81,7 @@ Rectangle {
FluTextBox{ FluTextBox{
id:text_box id:text_box
text: String(display) text: String(display)
readOnly: true === columnSource[column].readOnly readOnly: true === d.columns_data[column].readOnly
Component.onCompleted: { Component.onCompleted: {
forceActiveFocus() forceActiveFocus()
selectAll() selectAll()
@ -102,7 +112,7 @@ Rectangle {
FluMultilineTextBox { FluMultilineTextBox {
id:text_box id:text_box
text: display text: display
readOnly: true === columnSource[column].readOnly readOnly: true === d.columns_data[column].readOnly
verticalAlignment: TextInput.AlignVCenter verticalAlignment: TextInput.AlignVCenter
Component.onCompleted: { Component.onCompleted: {
forceActiveFocus() forceActiveFocus()
@ -142,7 +152,7 @@ Rectangle {
id:com_text id:com_text
FluText { FluText {
id:item_text id:item_text
text: display text: String(display)
elide: Text.ElideRight elide: Text.ElideRight
wrapMode: Text.WrapAnywhere wrapMode: Text.WrapAnywhere
anchors{ anchors{
@ -166,14 +176,164 @@ Rectangle {
} }
} }
} }
Component{
id:com_table_delegate
MouseArea{
id:item_table_mouse
property var rowObject : control.getRow(row)
property var itemModel: model
property bool editVisible: {
if(d.editPosition === undefined){
return false
}
if(d.editPosition._key === rowObject._key && d.editPosition.column === column){
return true
}
return false
}
hoverEnabled: true
onEntered: {
d.rowHoverIndex = row
}
onWidthChanged: {
if(editVisible){
updateEditPosition()
}
}
onHeightChanged: {
if(editVisible){
updateEditPosition()
}
}
onXChanged: {
if(editVisible){
updateEditPosition()
}
}
onYChanged: {
if(editVisible){
updateEditPosition()
}
}
function updateEditPosition(){
var obj = {}
obj._key = rowObject._key
obj.column = column
obj.row = row
obj.x = item_table_mouse.x
obj.y = item_table_mouse.y + 1
obj.width = item_table_mouse.width
obj.height = item_table_mouse.height - 2
d.editPosition = obj
}
Rectangle{
id:item_table
anchors.fill: parent
property point position: Qt.point(column,row)
property bool isRowSelected: {
if(rowObject === null)
return false
if(d.current){
return rowObject._key === d.current._key
}
return false
}
color:{
if(item_table.isRowSelected){
return control.selectedColor
}
if(d.rowHoverIndex === row || item_table.isRowSelected){
return FluTheme.dark ? Qt.rgba(1,1,1,0.06) : Qt.rgba(0,0,0,0.06)
}
return (row%2!==0) ? control.color : (FluTheme.dark ? Qt.rgba(1,1,1,0.015) : Qt.rgba(0,0,0,0.015))
}
MouseArea{
anchors.fill: parent
acceptedButtons: Qt.LeftButton
onPressed:{
closeEditor()
}
onCanceled: {
}
onReleased: {
}
onDoubleClicked:{
if(typeof(display) == "object"){
return
}
d.editDelegate = d.getEditDelegate(column)
updateEditPosition()
loader_edit.display = display
}
onClicked:
(event)=>{
d.current = rowObject
closeEditor()
event.accepted = true
}
}
FluLoader{
property var model: itemModel
property var display: itemModel.display
property int row: item_table.position.y
property int column: item_table.position.x
property bool isObject: typeof(display) == "object"
property var options: {
if(isObject){
return display.options
}
return {}
}
anchors.fill: parent
sourceComponent: {
if(isObject){
return display.comId
}
return com_text
}
}
Item{
anchors.fill: parent
visible: item_table.isRowSelected
Rectangle{
width: 1
height: parent.height
anchors.left: parent.left
color: control.selectedBorderColor
visible: column === 0
}
Rectangle{
width: 1
height: parent.height
anchors.right: parent.right
color: control.selectedBorderColor
visible: column === control.columns-1
}
Rectangle{
width: parent.width
height: 1
anchors.top: parent.top
color: control.selectedBorderColor
}
Rectangle{
width: parent.width
height: 1
anchors.bottom: parent.bottom
color: control.selectedBorderColor
}
}
}
}
}
MouseArea{ MouseArea{
id:layout_mouse_table id:layout_mouse_table
hoverEnabled: true hoverEnabled: true
anchors.left: header_vertical.right anchors{
anchors.top: header_horizontal.bottom left: header_vertical.right
anchors.right: parent.right top: header_horizontal.bottom
anchors.bottom: parent.bottom right: parent.right
bottom: parent.bottom
}
onExited: { onExited: {
d.rowHoverIndex = -1 d.rowHoverIndex = -1
} }
@ -207,153 +367,7 @@ Rectangle {
onRowsChanged: { onRowsChanged: {
closeEditor() closeEditor()
} }
delegate: MouseArea{ delegate: com_table_delegate
id:item_table_mouse
property var rowObject : control.getRow(row)
property var itemModel: model
property bool editVisible: {
if(d.editPosition === undefined){
return false
}
if(d.editPosition._key === rowObject._key && d.editPosition.column === column){
return true
}
return false
}
hoverEnabled: true
onEntered: {
d.rowHoverIndex = row
}
onWidthChanged: {
if(editVisible){
updateEditPosition()
}
}
onHeightChanged: {
if(editVisible){
updateEditPosition()
}
}
onXChanged: {
if(editVisible){
updateEditPosition()
}
}
onYChanged: {
if(editVisible){
updateEditPosition()
}
}
function updateEditPosition(){
var obj = {}
obj._key = rowObject._key
obj.column = column
obj.row = row
obj.x = item_table_mouse.x
obj.y = item_table_mouse.y + 1
obj.width = item_table_mouse.width
obj.height = item_table_mouse.height - 2
d.editPosition = obj
}
Rectangle{
id:item_table
anchors.fill: parent
property point position: Qt.point(column,row)
property bool isRowSelected: {
if(rowObject === null)
return false
if(d.current){
return rowObject._key === d.current._key
}
return false
}
color:{
if(item_table.isRowSelected){
return control.selectedColor
}
if(d.rowHoverIndex === row || item_table.isRowSelected){
return FluTheme.dark ? Qt.rgba(1,1,1,0.06) : Qt.rgba(0,0,0,0.06)
}
return (row%2!==0) ? control.color : (FluTheme.dark ? Qt.rgba(1,1,1,0.015) : Qt.rgba(0,0,0,0.015))
}
MouseArea{
anchors.fill: parent
acceptedButtons: Qt.LeftButton
onPressed:{
closeEditor()
}
onCanceled: {
}
onReleased: {
}
onDoubleClicked:{
if(typeof(display) == "object"){
return
}
d.editDelegate = d.getEditDelegate(column)
updateEditPosition()
loader_edit.display = display
}
onClicked:
(event)=>{
d.current = rowObject
closeEditor()
event.accepted = true
}
}
FluLoader{
property var model: itemModel
property var display: itemModel.display
property int row: item_table.position.y
property int column: item_table.position.x
property bool isObject: typeof(display) == "object"
property var options: {
if(isObject){
return display.options
}
return {}
}
anchors.fill: parent
sourceComponent: {
if(isObject){
return display.comId
}
return com_text
}
}
Item{
anchors.fill: parent
visible: item_table.isRowSelected
Rectangle{
width: 1
height: parent.height
anchors.left: parent.left
color: control.selectedBorderColor
visible: column === 0
}
Rectangle{
width: 1
height: parent.height
anchors.right: parent.right
color: control.selectedBorderColor
visible: column === control.columns-1
}
Rectangle{
width: parent.width
height: 1
anchors.top: parent.top
color: control.selectedBorderColor
}
Rectangle{
width: parent.width
height: 1
anchors.bottom: parent.bottom
color: control.selectedBorderColor
}
}
}
}
FluLoader{ FluLoader{
id:loader_edit id:loader_edit
property var tableView: control property var tableView: control
@ -375,7 +389,7 @@ Rectangle {
onEditTextChaged: onEditTextChaged:
(text)=>{ (text)=>{
var obj = control.getRow(row) var obj = control.getRow(row)
obj[columnSource[column].dataIndex] = text obj[d.columns_data[column].dataIndex] = text
control.setRow(row,obj) control.setRow(row,obj)
} }
width: { width: {
@ -404,86 +418,16 @@ Rectangle {
} }
z:999 z:999
} }
} }
} }
Component{ Component{
id:com_handle id:com_column_header_delegate
Item {} Rectangle{
}
Component{
id:com_column_text
FluText {
id: column_text
text: modelData
anchors.fill: parent
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
}
}
FluScrollBar {
id:scroll_bar_h
anchors{
left: layout_mouse_table.left
right: layout_mouse_table.right
bottom: layout_mouse_table.bottom
}
}
FluScrollBar {
id:scroll_bar_v
anchors{
top: layout_mouse_table.top
bottom: layout_mouse_table.bottom
right: layout_mouse_table.right
}
}
TableModel{
id:header_model
rows: d.header_rows
TableModelColumn {}
}
TableView {
id: header_horizontal
model: header_model
syncDirection: Qt.Horizontal
anchors{
left: header_vertical.right
right: parent.right
top: parent.top
}
visible: control.horizonalHeaderVisible
height: visible ? Math.max(1, contentHeight) : 0
boundsBehavior: Flickable.StopAtBounds
clip: true
ScrollBar.horizontal:scroll_bar_h
columnWidthProvider: function(column) {
var columnObject = columnSource[column]
var width = columnObject.width
if(width){
return width
}
var minimumWidth = columnObject.minimumWidth
if(minimumWidth){
return minimumWidth
}
return d.defaultItemWidth
}
onContentXChanged:{
timer_horizontal_force_layout.restart()
}
Timer{
id:timer_horizontal_force_layout
interval: 50
onTriggered: {
header_horizontal.forceLayout()
}
}
delegate: Rectangle {
id:column_item_control id:column_item_control
readonly property real cellPadding: 8 readonly property real cellPadding: 8
property bool canceled: false property bool canceled: false
property int columnIndex: column property int columnIndex: column
readonly property var columnObject : columnSource[column] readonly property var columnObject : d.columns_data[column]
implicitWidth: { implicitWidth: {
return (item_column_loader.item && item_column_loader.item.implicitWidth) + (cellPadding * 2) return (item_column_loader.item && item_column_loader.item.implicitWidth) + (cellPadding * 2)
} }
@ -508,6 +452,7 @@ Rectangle {
width: 1 width: 1
height: parent.height height: parent.height
anchors.left: parent.left anchors.left: parent.left
visible: column !== 0
color:"#00000000" color:"#00000000"
} }
Rectangle{ Rectangle{
@ -603,39 +548,9 @@ Rectangle {
} }
} }
} }
TableModel{ Component{
id:model_rows id:com_row_header_delegate
TableModelColumn { display: "rowIndex" } Rectangle{
}
TableView {
id: header_vertical
boundsBehavior: Flickable.StopAtBounds
anchors.top: layout_mouse_table.top
anchors.left: parent.left
visible: control.verticalHeaderVisible
implicitWidth: visible ? Math.max(1, contentWidth) : 0
implicitHeight: syncView ? syncView.height : 0
syncDirection: Qt.Vertical
syncView: table_view
clip: true
model: model_rows
Connections{
target: table_model
function onRowCountChanged(){
model_rows.rows = Array.from({length: table_model.rows.length}, (_, i) => ({rowIndex:i+1}));
}
}
onContentYChanged:{
timer_vertical_force_layout.restart()
}
Timer{
id:timer_vertical_force_layout
interval: 50
onTriggered: {
header_vertical.forceLayout()
}
}
delegate: Rectangle{
id:item_control id:item_control
readonly property real cellPadding: 8 readonly property real cellPadding: 8
property bool canceled: false property bool canceled: false
@ -648,6 +563,7 @@ Rectangle {
width: parent.width width: parent.width
height: 1 height: 1
anchors.top: parent.top anchors.top: parent.top
visible: row !== 0
color:"#00000000" color:"#00000000"
} }
Rectangle{ Rectangle{
@ -745,6 +661,140 @@ Rectangle {
} }
} }
} }
Component{
id:com_column_text
FluText {
id: column_text
text: modelData
anchors.fill: parent
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
}
}
Item{
id: header_vertical_column
anchors{
top: header_horizontal.top
bottom: header_horizontal.bottom
left: parent.left
right: header_vertical.right
}
Rectangle{
border.color: control.borderColor
width: parent.width
height: 1
anchors.top: parent.top
color:"#00000000"
}
Rectangle{
border.color: control.borderColor
width: parent.width
height: 1
anchors.bottom: parent.bottom
color:"#00000000"
}
Rectangle{
border.color: control.borderColor
width: 1
height: parent.height
anchors.left: parent.left
color:"#00000000"
}
Rectangle{
border.color: control.borderColor
width: 1
height: parent.height
anchors.right: parent.right
color:"#00000000"
}
}
TableView {
id: header_horizontal
model: header_column_model
anchors{
left: header_vertical.right
right: layout_mouse_table.right
top: parent.top
}
visible: control.horizonalHeaderVisible
height: visible ? Math.max(1, contentHeight) : 0
boundsBehavior: Flickable.StopAtBounds
clip: true
ScrollBar.horizontal:scroll_bar_h
columnWidthProvider: function(column) {
var columnObject = d.columns_data[column]
var width = columnObject.width
if(width){
return width
}
var minimumWidth = columnObject.minimumWidth
if(minimumWidth){
return minimumWidth
}
return d.defaultItemWidth
}
onContentXChanged:{
timer_horizontal_force_layout.restart()
}
Timer{
id:timer_horizontal_force_layout
interval: 50
onTriggered: {
header_horizontal.forceLayout()
}
}
delegate: com_column_header_delegate
}
TableView {
id: header_vertical
boundsBehavior: Flickable.StopAtBounds
anchors{
top: layout_mouse_table.top
left: parent.left
}
visible: control.verticalHeaderVisible
implicitWidth: visible ? Math.max(1, contentWidth) : 0
implicitHeight: syncView ? syncView.height : 0
syncDirection: Qt.Vertical
syncView: table_view
clip: true
model: header_row_model
Connections{
target: table_model
function onRowCountChanged(){
header_row_model.rows = Array.from({length: table_model.rows.length}, (_, i) => ({rowIndex:i+1}))
}
}
onContentYChanged:{
timer_vertical_force_layout.restart()
}
Timer{
id:timer_vertical_force_layout
interval: 50
onTriggered: {
header_vertical.forceLayout()
}
}
delegate: com_row_header_delegate
}
FluScrollBar {
id:scroll_bar_h
anchors{
left: layout_mouse_table.left
right: parent.right
bottom: layout_mouse_table.bottom
}
z:999
}
FluScrollBar {
id:scroll_bar_v
anchors{
top: layout_mouse_table.top
bottom: layout_mouse_table.bottom
right: parent.right
}
z:999
}
function closeEditor(){ function closeEditor(){
d.editPosition = undefined d.editPosition = undefined
d.editDelegate = undefined d.editDelegate = undefined