mirror of
https://github.com/zhuzichu520/FluentUI.git
synced 2024-11-30 07:03:46 +08:00
update
This commit is contained in:
zhuzichu
parent
dff77d3d4f
commit
cb7d2097f2
@ -10,7 +10,7 @@ FluContentPage{
|
||||
title:"TableView"
|
||||
|
||||
Component.onCompleted: {
|
||||
loadData(1,2000)
|
||||
loadData(1,1000)
|
||||
}
|
||||
|
||||
function loadData(page,count){
|
||||
@ -40,7 +40,10 @@ FluContentPage{
|
||||
name: getRandomName(),
|
||||
age:getRandomAge(),
|
||||
address: getRandomAddresses(),
|
||||
nickname: getRandomNickname()
|
||||
nickname: getRandomNickname(),
|
||||
height:40,
|
||||
minimumHeight:40,
|
||||
maximumHeight:200
|
||||
})
|
||||
}
|
||||
table_view.dataSource = dataSource
|
||||
@ -79,8 +82,8 @@ FluContentPage{
|
||||
title: '姓名',
|
||||
dataIndex: 'name',
|
||||
width:100,
|
||||
minimumWidth:50
|
||||
|
||||
minimumWidth:80,
|
||||
maximumWidth:200
|
||||
},
|
||||
{
|
||||
title: '年龄',
|
||||
@ -93,12 +96,16 @@ FluContentPage{
|
||||
{
|
||||
title: '住址',
|
||||
dataIndex: 'address',
|
||||
width:200
|
||||
width:200,
|
||||
minimumWidth:100,
|
||||
maximumWidth:250
|
||||
},
|
||||
{
|
||||
title: '别名',
|
||||
dataIndex: 'nickname',
|
||||
width:100
|
||||
width:100,
|
||||
minimumWidth:80,
|
||||
maximumWidth:200
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
@ -2,6 +2,7 @@
|
||||
#include <QGuiApplication>
|
||||
#include <QClipboard>
|
||||
#include <QUuid>
|
||||
#include <QCursor>
|
||||
|
||||
FluTools* FluTools::m_instance = nullptr;
|
||||
|
||||
@ -78,3 +79,11 @@ int FluTools::qtMinor(){
|
||||
void FluTools::setQuitOnLastWindowClosed(bool val){
|
||||
qApp->setQuitOnLastWindowClosed(val);
|
||||
}
|
||||
|
||||
void FluTools::setOverrideCursor(Qt::CursorShape shape){
|
||||
qApp->setOverrideCursor(QCursor(shape));
|
||||
}
|
||||
|
||||
void FluTools::restoreOverrideCursor(){
|
||||
qApp->restoreOverrideCursor();
|
||||
}
|
||||
|
||||
@ -54,6 +54,10 @@ public:
|
||||
|
||||
Q_INVOKABLE int qtMinor();
|
||||
|
||||
Q_INVOKABLE void setOverrideCursor(Qt::CursorShape shape);
|
||||
|
||||
Q_INVOKABLE void restoreOverrideCursor();
|
||||
|
||||
};
|
||||
|
||||
#endif // FLUTOOLS_H
|
||||
|
||||
@ -15,14 +15,23 @@ Rectangle {
|
||||
var com_column = Qt.createComponent("FluTableModelColumn.qml")
|
||||
if (com_column.status === Component.Ready) {
|
||||
var columns= []
|
||||
var header_rows = {}
|
||||
columnSource.forEach(function(item){
|
||||
var column = com_column.createObject(table_model,{display:item.dataIndex});
|
||||
columns.push(column)
|
||||
header_rows[item.dataIndex] = item.title
|
||||
})
|
||||
table_model.columns = columns
|
||||
header_model.columns = columns
|
||||
console.debug(JSON.stringify(header_rows))
|
||||
d.header_rows = [header_rows]
|
||||
}
|
||||
}
|
||||
}
|
||||
QtObject{
|
||||
id:d
|
||||
property var header_rows:[]
|
||||
}
|
||||
onDataSourceChanged: {
|
||||
table_model.clear()
|
||||
dataSource.forEach(function(item){
|
||||
@ -57,7 +66,6 @@ Rectangle {
|
||||
anchors.bottom: parent.bottom
|
||||
ScrollBar.horizontal.policy: ScrollBar.AlwaysOff
|
||||
ScrollBar.vertical.policy: ScrollBar.AlwaysOff
|
||||
|
||||
TableView {
|
||||
id:table_view
|
||||
ListModel{
|
||||
@ -66,21 +74,11 @@ Rectangle {
|
||||
boundsBehavior: Flickable.StopAtBounds
|
||||
ScrollBar.horizontal: FluScrollBar{}
|
||||
ScrollBar.vertical: FluScrollBar{}
|
||||
selectionModel: ItemSelectionModel {}
|
||||
selectionModel: ItemSelectionModel {
|
||||
id:selection_model
|
||||
}
|
||||
columnWidthProvider: function(column) {
|
||||
var w
|
||||
var minimumWidth = columnSource[column].minimumWidth
|
||||
var maximumWidth = columnSource[column].maximumWidth
|
||||
if(FluTools.qtMajor()>=6 && FluTools.qtMinor()>=5){
|
||||
w = explicitColumnWidth(column)
|
||||
if (w >= 0){
|
||||
if(!minimumWidth){
|
||||
minimumWidth = 100
|
||||
}
|
||||
if(!maximumWidth){
|
||||
maximumWidth = 65535
|
||||
}
|
||||
w = Math.min(Math.max(minimumWidth, w),maximumWidth)
|
||||
var w = columnSource[column].width
|
||||
if(column === item_loader.column){
|
||||
item_loader.width = w
|
||||
}
|
||||
@ -93,42 +91,20 @@ Rectangle {
|
||||
}
|
||||
return w
|
||||
}
|
||||
return implicitColumnWidth(column)
|
||||
}else{
|
||||
w = implicitColumnWidth(column)
|
||||
if(!minimumWidth){
|
||||
minimumWidth = 100
|
||||
}
|
||||
if(!maximumWidth){
|
||||
maximumWidth = 65535
|
||||
}
|
||||
return Math.min(Math.max(minimumWidth, w),maximumWidth)
|
||||
}
|
||||
}
|
||||
rowHeightProvider: function(row) {
|
||||
var h
|
||||
if(FluTools.qtMajor()>=6 && FluTools.qtMinor()>=5){
|
||||
h = explicitRowHeight(row)
|
||||
if (h >= 0){
|
||||
h = Math.max(40, h)
|
||||
var h = table_model.getRow(row).height
|
||||
if(row === item_loader.row){
|
||||
item_loader.height = h
|
||||
}
|
||||
if(row === item_loader.row-1){
|
||||
var cellItem = table_view.itemAtCell(item_loader.column, item_loader.row)
|
||||
let cellItem = table_view.itemAtCell(item_loader.column, item_loader.row)
|
||||
if(cellItem){
|
||||
var cellPosition = cellItem.mapToItem(scroll_table, 0, 0)
|
||||
let cellPosition = cellItem.mapToItem(scroll_table, 0, 0)
|
||||
item_loader.y = table_view.contentY + cellPosition.y
|
||||
}
|
||||
}
|
||||
return h
|
||||
}
|
||||
return implicitRowHeight(row)
|
||||
}else{
|
||||
h = implicitRowHeight(row)
|
||||
return Math.max(40, h)
|
||||
}
|
||||
}
|
||||
model: table_model
|
||||
clip: true
|
||||
delegate: Rectangle {
|
||||
@ -217,27 +193,161 @@ Rectangle {
|
||||
}
|
||||
}
|
||||
SelectionRectangle {
|
||||
target: table_view
|
||||
target: {
|
||||
if(item_loader.sourceComponent){
|
||||
return null
|
||||
}
|
||||
return table_view
|
||||
}
|
||||
bottomRightHandle:com_handle
|
||||
topLeftHandle: com_handle
|
||||
}
|
||||
FluHorizontalHeaderView {
|
||||
TableView {
|
||||
id: header_horizontal
|
||||
textRole: "title"
|
||||
model: columnSource
|
||||
model: TableModel{
|
||||
id:header_model
|
||||
rows: d.header_rows
|
||||
}
|
||||
syncDirection: Qt.Horizontal
|
||||
anchors.left: scroll_table.left
|
||||
anchors.top: parent.top
|
||||
implicitWidth: syncView ? syncView.width : 0
|
||||
implicitHeight: Math.max(1, contentHeight)
|
||||
syncView: table_view
|
||||
boundsBehavior: Flickable.StopAtBounds
|
||||
clip: true
|
||||
delegate: Rectangle {
|
||||
readonly property real cellPadding: 8
|
||||
readonly property var obj : columnSource[column]
|
||||
implicitWidth: column_text.implicitWidth + (cellPadding * 2)
|
||||
implicitHeight: Math.max(header_horizontal.height, column_text.implicitHeight + (cellPadding * 2))
|
||||
color:FluTheme.dark ? Qt.rgba(50/255,50/255,50/255,1) : Qt.rgba(247/255,247/255,247/255,1)
|
||||
border.color: FluTheme.dark ? "#252525" : "#e4e4e4"
|
||||
FluText {
|
||||
id: column_text
|
||||
text: display
|
||||
width: parent.width
|
||||
height: parent.height
|
||||
font.bold: true
|
||||
horizontalAlignment: Text.AlignHCenter
|
||||
verticalAlignment: Text.AlignVCenter
|
||||
}
|
||||
FluVerticalHeaderView {
|
||||
TapHandler{
|
||||
onDoubleTapped: {
|
||||
selection_model.clear()
|
||||
for(var i=0;i<=table_view.rows;i++){
|
||||
selection_model.select(table_view.index(i,column),ItemSelectionModel.Select)
|
||||
}
|
||||
}
|
||||
}
|
||||
MouseArea{
|
||||
property point clickPos: "0,0"
|
||||
height: parent.height
|
||||
width: 4
|
||||
anchors.right: parent.right
|
||||
acceptedButtons: Qt.LeftButton
|
||||
visible: !(obj.width === obj.maximumWidth && obj.width === obj.maximumWidth)
|
||||
cursorShape: Qt.SplitHCursor
|
||||
preventStealing: true
|
||||
propagateComposedEvents: true
|
||||
onPressed :
|
||||
(mouse)=>{
|
||||
FluTools.setOverrideCursor(Qt.SplitHCursor)
|
||||
clickPos = Qt.point(mouse.x, mouse.y)
|
||||
}
|
||||
onReleased:{
|
||||
FluTools.restoreOverrideCursor()
|
||||
}
|
||||
onPositionChanged:
|
||||
(mouse)=>{
|
||||
var delta = Qt.point(mouse.x - clickPos.x, mouse.y - clickPos.y)
|
||||
var minimumWidth = obj.minimumWidth
|
||||
var maximumWidth = obj.maximumWidth
|
||||
if(!minimumWidth){
|
||||
minimumWidth = 100
|
||||
}
|
||||
if(!maximumWidth){
|
||||
maximumWidth = 65535
|
||||
}
|
||||
obj.width = Math.min(Math.max(minimumWidth, obj.width + delta.x),maximumWidth)
|
||||
table_view.forceLayout()
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
TableView {
|
||||
id: header_vertical
|
||||
boundsBehavior: Flickable.StopAtBounds
|
||||
anchors.top: scroll_table.top
|
||||
anchors.left: parent.left
|
||||
implicitWidth: Math.max(1, contentWidth)
|
||||
implicitHeight: syncView ? syncView.height : 0
|
||||
syncDirection: Qt.Vertical
|
||||
syncView: table_view
|
||||
clip: true
|
||||
model: TableModel{
|
||||
TableModelColumn {}
|
||||
rows: {
|
||||
if(dataSource)
|
||||
return dataSource
|
||||
return []
|
||||
}
|
||||
}
|
||||
delegate: Rectangle{
|
||||
readonly property real cellPadding: 8
|
||||
readonly property var obj : table_model.getRow(row)
|
||||
implicitWidth: Math.max(header_vertical.width, row_text.implicitWidth + (cellPadding * 2))
|
||||
implicitHeight: row_text.implicitHeight + (cellPadding * 2)
|
||||
color:FluTheme.dark ? Qt.rgba(50/255,50/255,50/255,1) : Qt.rgba(247/255,247/255,247/255,1)
|
||||
border.color: FluTheme.dark ? "#252525" : "#e4e4e4"
|
||||
FluText{
|
||||
id:row_text
|
||||
anchors.centerIn: parent
|
||||
text: row + 1
|
||||
}
|
||||
TapHandler{
|
||||
onDoubleTapped: {
|
||||
selection_model.clear()
|
||||
for(var i=0;i<=columnSource.length;i++){
|
||||
selection_model.select(table_view.index(row,i),ItemSelectionModel.Select)
|
||||
}
|
||||
}
|
||||
}
|
||||
MouseArea{
|
||||
property point clickPos: "0,0"
|
||||
height: 4
|
||||
width: parent.width
|
||||
anchors.bottom: parent.bottom
|
||||
acceptedButtons: Qt.LeftButton
|
||||
cursorShape: Qt.SplitVCursor
|
||||
preventStealing: true
|
||||
visible: !(obj.height === obj.minimumHeight && obj.width === obj.maximumHeight)
|
||||
propagateComposedEvents: true
|
||||
onPressed :
|
||||
(mouse)=>{
|
||||
FluTools.setOverrideCursor(Qt.SplitVCursor)
|
||||
clickPos = Qt.point(mouse.x, mouse.y)
|
||||
}
|
||||
onReleased:{
|
||||
FluTools.restoreOverrideCursor()
|
||||
}
|
||||
onPositionChanged:
|
||||
(mouse)=>{
|
||||
var delta = Qt.point(mouse.x - clickPos.x, mouse.y - clickPos.y)
|
||||
var minimumHeight = obj.minimumHeight
|
||||
var maximumHeight = obj.maximumHeight
|
||||
if(!minimumHeight){
|
||||
minimumHeight = 40
|
||||
}
|
||||
if(!maximumHeight){
|
||||
maximumHeight = 65535
|
||||
}
|
||||
obj.height = Math.min(Math.max(minimumHeight, obj.height + delta.y),maximumHeight)
|
||||
table_model.setRow(row,obj)
|
||||
table_view.forceLayout()
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function closeEditor(){
|
||||
@ -245,4 +355,3 @@ Rectangle {
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
Loading…
Reference in New Issue
Block a user