mirror of
https://github.com/zhuzichu520/FluentUI.git
synced 2025-02-02 19:27:38 +08:00
update
This commit is contained in:
parent
7ad8c969da
commit
8337e278ff
@ -9,11 +9,21 @@ Node::Node(QObject *parent)
|
|||||||
}
|
}
|
||||||
|
|
||||||
FluTreeModel::FluTreeModel(QObject *parent)
|
FluTreeModel::FluTreeModel(QObject *parent)
|
||||||
: QAbstractTableModel{parent}
|
: QAbstractItemModel{parent}
|
||||||
{
|
{
|
||||||
dataSourceSize(0);
|
dataSourceSize(0);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
QModelIndex FluTreeModel::parent(const QModelIndex &child) const{
|
||||||
|
return QModelIndex();
|
||||||
|
}
|
||||||
|
|
||||||
|
QModelIndex FluTreeModel::index(int row, int column,const QModelIndex &parent) const{
|
||||||
|
if (!hasIndex(row, column, parent) || parent.isValid())
|
||||||
|
return QModelIndex();
|
||||||
|
return createIndex(row, column, _rows.at(row));
|
||||||
|
}
|
||||||
|
|
||||||
int FluTreeModel::rowCount(const QModelIndex &parent) const {
|
int FluTreeModel::rowCount(const QModelIndex &parent) const {
|
||||||
return _rows.count();
|
return _rows.count();
|
||||||
};
|
};
|
||||||
|
@ -62,7 +62,7 @@ public:
|
|||||||
Node* _parent = nullptr;
|
Node* _parent = nullptr;
|
||||||
};
|
};
|
||||||
|
|
||||||
class FluTreeModel : public QAbstractTableModel
|
class FluTreeModel : public QAbstractItemModel
|
||||||
{
|
{
|
||||||
Q_OBJECT
|
Q_OBJECT
|
||||||
Q_PROPERTY_AUTO(int,dataSourceSize)
|
Q_PROPERTY_AUTO(int,dataSourceSize)
|
||||||
@ -74,6 +74,9 @@ public:
|
|||||||
int columnCount(const QModelIndex &parent = QModelIndex()) const override;
|
int columnCount(const QModelIndex &parent = QModelIndex()) const override;
|
||||||
QVariant data(const QModelIndex &index, int role = Qt::DisplayRole) const override;
|
QVariant data(const QModelIndex &index, int role = Qt::DisplayRole) const override;
|
||||||
QHash<int, QByteArray> roleNames() const override;
|
QHash<int, QByteArray> roleNames() const override;
|
||||||
|
QModelIndex parent(const QModelIndex &child) const override;
|
||||||
|
QModelIndex index(int row, int column,const QModelIndex &parent = QModelIndex()) const override;
|
||||||
|
|
||||||
Q_INVOKABLE void removeRows(int row,int count);
|
Q_INVOKABLE void removeRows(int row,int count);
|
||||||
Q_INVOKABLE void insertRows(int row,QList<Node*> data);
|
Q_INVOKABLE void insertRows(int row,QList<Node*> data);
|
||||||
Q_INVOKABLE QObject* getRow(int row);
|
Q_INVOKABLE QObject* getRow(int row);
|
||||||
|
@ -14,12 +14,9 @@ Item {
|
|||||||
id:control
|
id:control
|
||||||
QtObject {
|
QtObject {
|
||||||
id:d
|
id:d
|
||||||
|
property int dy
|
||||||
property var current
|
property var current
|
||||||
property int dropIndex: -1
|
property int dropIndex: -1
|
||||||
property var hoverItem
|
|
||||||
property int hoverIndex: -1
|
|
||||||
property bool itemPress: false
|
|
||||||
property bool itemDragActive: false
|
|
||||||
property bool isDropTopArea: false
|
property bool isDropTopArea: false
|
||||||
property int dragIndex: -1
|
property int dragIndex: -1
|
||||||
property color hitColor: FluTheme.dark ? FluTheme.primaryColor.lighter : FluTheme.primaryColor.dark
|
property color hitColor: FluTheme.dark ? FluTheme.primaryColor.lighter : FluTheme.primaryColor.dark
|
||||||
@ -42,13 +39,11 @@ Item {
|
|||||||
Item{
|
Item{
|
||||||
signal reused
|
signal reused
|
||||||
signal pooled
|
signal pooled
|
||||||
|
|
||||||
onReused: {
|
onReused: {
|
||||||
console.debug(itemModel.title)
|
|
||||||
}
|
}
|
||||||
onPooled: {
|
onPooled: {
|
||||||
}
|
}
|
||||||
|
|
||||||
property bool isCurrent: d.current === itemModel
|
property bool isCurrent: d.current === itemModel
|
||||||
id:item_container
|
id:item_container
|
||||||
width: {
|
width: {
|
||||||
@ -62,6 +57,9 @@ Item {
|
|||||||
implicitWidth: width
|
implicitWidth: width
|
||||||
implicitHeight: height
|
implicitHeight: height
|
||||||
function toggle(){
|
function toggle(){
|
||||||
|
var pos = FluTools.cursorPos()
|
||||||
|
var viewPos = table_view.mapToGlobal(0,0)
|
||||||
|
d.dy = table_view.contentY + pos.y-viewPos.y
|
||||||
if(itemModel.isExpanded){
|
if(itemModel.isExpanded){
|
||||||
tree_model.collapse(rowIndex)
|
tree_model.collapse(rowIndex)
|
||||||
}else{
|
}else{
|
||||||
@ -87,7 +85,6 @@ Item {
|
|||||||
drag.target:control.draggable ? loader_container : undefined
|
drag.target:control.draggable ? loader_container : undefined
|
||||||
hoverEnabled: true
|
hoverEnabled: true
|
||||||
drag.onActiveChanged: {
|
drag.onActiveChanged: {
|
||||||
d.itemDragActive = drag.active
|
|
||||||
if(drag.active){
|
if(drag.active){
|
||||||
if(itemModel.isExpanded && itemModel.hasChildren()){
|
if(itemModel.isExpanded && itemModel.hasChildren()){
|
||||||
tree_model.collapse(rowIndex)
|
tree_model.collapse(rowIndex)
|
||||||
@ -98,16 +95,14 @@ Item {
|
|||||||
}
|
}
|
||||||
onPressed:
|
onPressed:
|
||||||
(mouse)=>{
|
(mouse)=>{
|
||||||
d.itemPress = true
|
|
||||||
clickPos = Qt.point(mouse.x,mouse.y)
|
clickPos = Qt.point(mouse.x,mouse.y)
|
||||||
console.debug(clickPos)
|
|
||||||
loader_container.itemControl = itemControl
|
loader_container.itemControl = itemControl
|
||||||
loader_container.itemModel = itemModel
|
loader_container.itemModel = itemModel
|
||||||
var cellPosition = item_container.mapToItem(table_view, 0, 0)
|
var cellPosition = item_container.mapToItem(table_view, 0, 0)
|
||||||
loader_container.width = item_container.width
|
loader_container.width = item_container.width
|
||||||
loader_container.height = item_container.height
|
loader_container.height = item_container.height
|
||||||
loader_container.x = cellPosition.x
|
loader_container.x = 0
|
||||||
loader_container.y = cellPosition.y
|
loader_container.y = cellPosition.y + table_view.contentY
|
||||||
}
|
}
|
||||||
onClicked: {
|
onClicked: {
|
||||||
d.current = itemModel
|
d.current = itemModel
|
||||||
@ -117,21 +112,17 @@ Item {
|
|||||||
item_container.toggle()
|
item_container.toggle()
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
onExited: {
|
|
||||||
d.hoverIndex = -1
|
|
||||||
}
|
|
||||||
onPositionChanged:
|
onPositionChanged:
|
||||||
(mouse)=> {
|
(mouse)=> {
|
||||||
|
if(!drag.active){
|
||||||
|
return
|
||||||
|
}
|
||||||
var cellPosition = item_container.mapToItem(table_view, 0, 0)
|
var cellPosition = item_container.mapToItem(table_view, 0, 0)
|
||||||
if(mouse.y+cellPosition.y<0 || mouse.y+cellPosition.y>table_view.height){
|
if(mouse.y+cellPosition.y<0 || mouse.y+cellPosition.y>table_view.height){
|
||||||
d.hoverItem = undefined
|
|
||||||
d.hoverIndex = -1
|
|
||||||
d.dropIndex = -1
|
d.dropIndex = -1
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
if((mouse.x-table_view.contentX)>table_view.width || (mouse.x-table_view.contentX)<0){
|
if((mouse.x-table_view.contentX)>table_view.width || (mouse.x-table_view.contentX)<0){
|
||||||
d.hoverItem = undefined
|
|
||||||
d.hoverIndex = -1
|
|
||||||
d.dropIndex = -1
|
d.dropIndex = -1
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
@ -139,16 +130,6 @@ Item {
|
|||||||
var viewPos = table_view.mapToGlobal(0,0)
|
var viewPos = table_view.mapToGlobal(0,0)
|
||||||
var y = table_view.contentY + pos.y-viewPos.y
|
var y = table_view.contentY + pos.y-viewPos.y
|
||||||
var index = Math.floor(y/30)
|
var index = Math.floor(y/30)
|
||||||
if(item_mouse.pressed){
|
|
||||||
d.hoverItem = undefined
|
|
||||||
d.hoverIndex = -1
|
|
||||||
}else{
|
|
||||||
d.hoverItem = item_container
|
|
||||||
d.hoverIndex = index
|
|
||||||
}
|
|
||||||
if(!drag.active){
|
|
||||||
return
|
|
||||||
}
|
|
||||||
if(tree_model.hitHasChildrenExpanded(index) && y>index*30+15){
|
if(tree_model.hitHasChildrenExpanded(index) && y>index*30+15){
|
||||||
d.dropIndex = index + 1
|
d.dropIndex = index + 1
|
||||||
d.isDropTopArea = true
|
d.isDropTopArea = true
|
||||||
@ -163,21 +144,22 @@ Item {
|
|||||||
}
|
}
|
||||||
onCanceled: {
|
onCanceled: {
|
||||||
loader_container.sourceComponent = undefined
|
loader_container.sourceComponent = undefined
|
||||||
d.itemPress = false
|
loader_container.x = 0
|
||||||
|
loader_container.y = 0
|
||||||
d.dropIndex = -1
|
d.dropIndex = -1
|
||||||
d.dragIndex = -1
|
d.dragIndex = -1
|
||||||
}
|
}
|
||||||
onReleased: {
|
onReleased: {
|
||||||
d.itemPress = false
|
|
||||||
loader_container.sourceComponent = undefined
|
loader_container.sourceComponent = undefined
|
||||||
if(d.dropIndex !== -1){
|
if(d.dropIndex !== -1){
|
||||||
tree_model.dragAnddrop(d.dragIndex,d.dropIndex,d.isDropTopArea)
|
tree_model.dragAnddrop(d.dragIndex,d.dropIndex,d.isDropTopArea)
|
||||||
}
|
}
|
||||||
d.dropIndex = -1
|
d.dropIndex = -1
|
||||||
d.dragIndex = -1
|
d.dragIndex = -1
|
||||||
|
loader_container.x = 0
|
||||||
|
loader_container.y = 0
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
Drag.dragType: Drag.None
|
|
||||||
Drag.active: item_mouse.drag.active
|
Drag.active: item_mouse.drag.active
|
||||||
Rectangle{
|
Rectangle{
|
||||||
id:item_line_drop_tip
|
id:item_line_drop_tip
|
||||||
@ -276,6 +258,9 @@ Item {
|
|||||||
color: {
|
color: {
|
||||||
if(FluTheme.dark){
|
if(FluTheme.dark){
|
||||||
if(isCurrent){
|
if(isCurrent){
|
||||||
|
return Qt.rgba(1,1,1,0.06)
|
||||||
|
}
|
||||||
|
if(item_mouse.containsMouse){
|
||||||
return Qt.rgba(1,1,1,0.03)
|
return Qt.rgba(1,1,1,0.03)
|
||||||
}
|
}
|
||||||
return Qt.rgba(0,0,0,0)
|
return Qt.rgba(0,0,0,0)
|
||||||
@ -283,6 +268,9 @@ Item {
|
|||||||
if(isCurrent){
|
if(isCurrent){
|
||||||
return Qt.rgba(0,0,0,0.06)
|
return Qt.rgba(0,0,0,0.06)
|
||||||
}
|
}
|
||||||
|
if(item_mouse.containsMouse){
|
||||||
|
return Qt.rgba(0,0,0,0.03)
|
||||||
|
}
|
||||||
return Qt.rgba(0,0,0,0)
|
return Qt.rgba(0,0,0,0)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -292,28 +280,26 @@ Item {
|
|||||||
anchors.verticalCenter: parent.verticalCenter
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
anchors.left: parent.left
|
anchors.left: parent.left
|
||||||
anchors.leftMargin: 14 + 30*itemModel.depth
|
anchors.leftMargin: 14 + 30*itemModel.depth
|
||||||
Item{
|
Component{
|
||||||
|
id:com_icon_btn
|
||||||
|
FluIconButton{
|
||||||
opacity: itemModel.hasChildren()
|
opacity: itemModel.hasChildren()
|
||||||
Layout.preferredWidth: 20
|
onClicked: {
|
||||||
Layout.preferredHeight: 20
|
|
||||||
TapHandler{
|
|
||||||
enabled: parent.opacity
|
|
||||||
onSingleTapped: {
|
|
||||||
item_container.toggle()
|
item_container.toggle()
|
||||||
}
|
}
|
||||||
}
|
contentItem:FluIcon{
|
||||||
MouseArea{
|
|
||||||
cursorShape: Qt.PointingHandCursor
|
|
||||||
acceptedButtons: Qt.NoButton
|
|
||||||
anchors.fill: parent
|
|
||||||
}
|
|
||||||
FluIcon{
|
|
||||||
rotation: itemModel.isExpanded?0:-90
|
rotation: itemModel.isExpanded?0:-90
|
||||||
iconSource:FluentIcons.ChevronDown
|
iconSource:FluentIcons.ChevronDown
|
||||||
iconSize: 16
|
iconSize: 16
|
||||||
anchors.centerIn: parent
|
anchors.centerIn: parent
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
Loader{
|
||||||
|
Layout.preferredWidth: 20
|
||||||
|
Layout.preferredHeight: 20
|
||||||
|
sourceComponent: itemModel.hasChildren() ? com_icon_btn : undefined
|
||||||
|
}
|
||||||
Item{
|
Item{
|
||||||
id:item_layout_text
|
id:item_layout_text
|
||||||
Layout.preferredWidth: item_text.implicitWidth+14
|
Layout.preferredWidth: item_text.implicitWidth+14
|
||||||
@ -324,6 +310,9 @@ Item {
|
|||||||
text: itemModel.title
|
text: itemModel.title
|
||||||
anchors.centerIn: parent
|
anchors.centerIn: parent
|
||||||
color:{
|
color:{
|
||||||
|
if(item_mouse.pressed){
|
||||||
|
return FluTheme.dark ? FluColors.Grey80 : FluColors.Grey120
|
||||||
|
}
|
||||||
return FluTheme.dark ? FluColors.White : FluColors.Grey220
|
return FluTheme.dark ? FluColors.White : FluColors.Grey220
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -331,66 +320,13 @@ Item {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
Component{
|
|
||||||
id:com_background
|
|
||||||
Item{
|
|
||||||
Rectangle{
|
|
||||||
radius: 4
|
|
||||||
anchors{
|
|
||||||
fill: parent
|
|
||||||
leftMargin: 6
|
|
||||||
rightMargin: 6
|
|
||||||
}
|
|
||||||
color:{
|
|
||||||
if(FluTheme.dark){
|
|
||||||
if(d.itemPress){
|
|
||||||
return Qt.rgba(1,1,1,0.06)
|
|
||||||
}
|
|
||||||
return Qt.rgba(1,1,1,0.03)
|
|
||||||
}else{
|
|
||||||
if(d.itemPress){
|
|
||||||
return Qt.rgba(0,0,0,0.06)
|
|
||||||
}
|
|
||||||
return Qt.rgba(0,0,0,0.03)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
ScrollView{
|
ScrollView{
|
||||||
id:scroll_view
|
id:scroll_view
|
||||||
anchors.fill: parent
|
anchors.fill: parent
|
||||||
ScrollBar.horizontal.policy: ScrollBar.AlwaysOff
|
ScrollBar.horizontal.policy: ScrollBar.AlwaysOff
|
||||||
ScrollBar.vertical.policy: ScrollBar.AlwaysOff
|
ScrollBar.vertical.policy: ScrollBar.AlwaysOff
|
||||||
Loader{
|
clip: true
|
||||||
id:loader_background
|
ListView{
|
||||||
y:{
|
|
||||||
if(d.hoverItem){
|
|
||||||
var cellPosition = d.hoverItem.mapToItem(table_view, 0, 0)
|
|
||||||
return cellPosition.y
|
|
||||||
}
|
|
||||||
return 0
|
|
||||||
}
|
|
||||||
width: {
|
|
||||||
if(d.hoverItem){
|
|
||||||
return d.hoverItem.width
|
|
||||||
}
|
|
||||||
return 0
|
|
||||||
}
|
|
||||||
height: {
|
|
||||||
if(d.hoverItem){
|
|
||||||
return d.hoverItem.height
|
|
||||||
}
|
|
||||||
return 0
|
|
||||||
}
|
|
||||||
sourceComponent: {
|
|
||||||
if(d.hoverIndex === -1 || d.itemDragActive){
|
|
||||||
return undefined
|
|
||||||
}
|
|
||||||
return com_background
|
|
||||||
}
|
|
||||||
}
|
|
||||||
TableView{
|
|
||||||
id:table_view
|
id:table_view
|
||||||
ScrollBar.horizontal: FluScrollBar{}
|
ScrollBar.horizontal: FluScrollBar{}
|
||||||
ScrollBar.vertical: FluScrollBar{}
|
ScrollBar.vertical: FluScrollBar{}
|
||||||
@ -398,26 +334,54 @@ Item {
|
|||||||
model: tree_model
|
model: tree_model
|
||||||
clip: true
|
clip: true
|
||||||
anchors.fill: parent
|
anchors.fill: parent
|
||||||
onContentYChanged:{
|
contentWidth: contentItem.childrenRect.width
|
||||||
timer_refresh.restart()
|
reuseItems: true
|
||||||
|
removeDisplaced : Transition{
|
||||||
|
ParallelAnimation{
|
||||||
|
NumberAnimation {
|
||||||
|
properties: "y"
|
||||||
|
duration: 167
|
||||||
|
from: d.dy + table_view.height
|
||||||
|
easing.type: Easing.OutCubic
|
||||||
|
}
|
||||||
|
NumberAnimation {
|
||||||
|
properties: "opacity"
|
||||||
|
duration: 300
|
||||||
|
from: 0
|
||||||
|
to: 1
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
add: Transition{
|
||||||
|
ParallelAnimation{
|
||||||
|
NumberAnimation {
|
||||||
|
properties: "y"
|
||||||
|
duration: 167
|
||||||
|
from: d.dy
|
||||||
|
easing.type: Easing.OutCubic
|
||||||
|
}
|
||||||
|
NumberAnimation {
|
||||||
|
properties: "opacity"
|
||||||
|
duration: 300
|
||||||
|
from: 0
|
||||||
|
to: 1
|
||||||
|
}
|
||||||
}
|
}
|
||||||
onWidthChanged: {
|
|
||||||
timer_refresh.restart()
|
|
||||||
}
|
}
|
||||||
delegate: Item {
|
delegate: Item {
|
||||||
id:item_control
|
id:item_control
|
||||||
implicitWidth: item_loader_container.width
|
implicitWidth: item_loader_container.width
|
||||||
implicitHeight: item_loader_container.height
|
implicitHeight: item_loader_container.height
|
||||||
TableView.onReused: {
|
ListView.onReused: {
|
||||||
item_loader_container.item.reused()
|
item_loader_container.item.reused()
|
||||||
}
|
}
|
||||||
TableView.onPooled: {
|
ListView.onPooled: {
|
||||||
item_loader_container.item.pooled()
|
item_loader_container.item.pooled()
|
||||||
}
|
}
|
||||||
Loader{
|
Loader{
|
||||||
property var itemControl: item_control
|
property var itemControl: item_control
|
||||||
property var itemModel: modelData
|
property var itemModel: modelData
|
||||||
property int rowIndex: row
|
property int rowIndex: index
|
||||||
property bool isItemLoader: true
|
property bool isItemLoader: true
|
||||||
id:item_loader_container
|
id:item_loader_container
|
||||||
sourceComponent: com_item_container
|
sourceComponent: com_item_container
|
||||||
@ -435,7 +399,7 @@ Item {
|
|||||||
return tree_model.dataSourceSize
|
return tree_model.dataSourceSize
|
||||||
}
|
}
|
||||||
function visibleCount(){
|
function visibleCount(){
|
||||||
return table_view.rows
|
return table_view.count
|
||||||
}
|
}
|
||||||
function collapse(rowIndex){
|
function collapse(rowIndex){
|
||||||
tree_model.collapse(rowIndex)
|
tree_model.collapse(rowIndex)
|
||||||
|
@ -14,12 +14,9 @@ Item {
|
|||||||
id:control
|
id:control
|
||||||
QtObject {
|
QtObject {
|
||||||
id:d
|
id:d
|
||||||
|
property int dy
|
||||||
property var current
|
property var current
|
||||||
property int dropIndex: -1
|
property int dropIndex: -1
|
||||||
property var hoverItem
|
|
||||||
property int hoverIndex: -1
|
|
||||||
property bool itemPress: false
|
|
||||||
property bool itemDragActive: false
|
|
||||||
property bool isDropTopArea: false
|
property bool isDropTopArea: false
|
||||||
property int dragIndex: -1
|
property int dragIndex: -1
|
||||||
property color hitColor: FluTheme.dark ? FluTheme.primaryColor.lighter : FluTheme.primaryColor.dark
|
property color hitColor: FluTheme.dark ? FluTheme.primaryColor.lighter : FluTheme.primaryColor.dark
|
||||||
@ -42,13 +39,11 @@ Item {
|
|||||||
Item{
|
Item{
|
||||||
signal reused
|
signal reused
|
||||||
signal pooled
|
signal pooled
|
||||||
|
|
||||||
onReused: {
|
onReused: {
|
||||||
console.debug(itemModel.title)
|
|
||||||
}
|
}
|
||||||
onPooled: {
|
onPooled: {
|
||||||
}
|
}
|
||||||
|
|
||||||
property bool isCurrent: d.current === itemModel
|
property bool isCurrent: d.current === itemModel
|
||||||
id:item_container
|
id:item_container
|
||||||
width: {
|
width: {
|
||||||
@ -62,6 +57,9 @@ Item {
|
|||||||
implicitWidth: width
|
implicitWidth: width
|
||||||
implicitHeight: height
|
implicitHeight: height
|
||||||
function toggle(){
|
function toggle(){
|
||||||
|
var pos = FluTools.cursorPos()
|
||||||
|
var viewPos = table_view.mapToGlobal(0,0)
|
||||||
|
d.dy = table_view.contentY + pos.y-viewPos.y
|
||||||
if(itemModel.isExpanded){
|
if(itemModel.isExpanded){
|
||||||
tree_model.collapse(rowIndex)
|
tree_model.collapse(rowIndex)
|
||||||
}else{
|
}else{
|
||||||
@ -87,7 +85,6 @@ Item {
|
|||||||
drag.target:control.draggable ? loader_container : undefined
|
drag.target:control.draggable ? loader_container : undefined
|
||||||
hoverEnabled: true
|
hoverEnabled: true
|
||||||
drag.onActiveChanged: {
|
drag.onActiveChanged: {
|
||||||
d.itemDragActive = drag.active
|
|
||||||
if(drag.active){
|
if(drag.active){
|
||||||
if(itemModel.isExpanded && itemModel.hasChildren()){
|
if(itemModel.isExpanded && itemModel.hasChildren()){
|
||||||
tree_model.collapse(rowIndex)
|
tree_model.collapse(rowIndex)
|
||||||
@ -98,16 +95,14 @@ Item {
|
|||||||
}
|
}
|
||||||
onPressed:
|
onPressed:
|
||||||
(mouse)=>{
|
(mouse)=>{
|
||||||
d.itemPress = true
|
|
||||||
clickPos = Qt.point(mouse.x,mouse.y)
|
clickPos = Qt.point(mouse.x,mouse.y)
|
||||||
console.debug(clickPos)
|
|
||||||
loader_container.itemControl = itemControl
|
loader_container.itemControl = itemControl
|
||||||
loader_container.itemModel = itemModel
|
loader_container.itemModel = itemModel
|
||||||
var cellPosition = item_container.mapToItem(table_view, 0, 0)
|
var cellPosition = item_container.mapToItem(table_view, 0, 0)
|
||||||
loader_container.width = item_container.width
|
loader_container.width = item_container.width
|
||||||
loader_container.height = item_container.height
|
loader_container.height = item_container.height
|
||||||
loader_container.x = cellPosition.x
|
loader_container.x = 0
|
||||||
loader_container.y = cellPosition.y
|
loader_container.y = cellPosition.y + table_view.contentY
|
||||||
}
|
}
|
||||||
onClicked: {
|
onClicked: {
|
||||||
d.current = itemModel
|
d.current = itemModel
|
||||||
@ -117,21 +112,17 @@ Item {
|
|||||||
item_container.toggle()
|
item_container.toggle()
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
onExited: {
|
|
||||||
d.hoverIndex = -1
|
|
||||||
}
|
|
||||||
onPositionChanged:
|
onPositionChanged:
|
||||||
(mouse)=> {
|
(mouse)=> {
|
||||||
|
if(!drag.active){
|
||||||
|
return
|
||||||
|
}
|
||||||
var cellPosition = item_container.mapToItem(table_view, 0, 0)
|
var cellPosition = item_container.mapToItem(table_view, 0, 0)
|
||||||
if(mouse.y+cellPosition.y<0 || mouse.y+cellPosition.y>table_view.height){
|
if(mouse.y+cellPosition.y<0 || mouse.y+cellPosition.y>table_view.height){
|
||||||
d.hoverItem = undefined
|
|
||||||
d.hoverIndex = -1
|
|
||||||
d.dropIndex = -1
|
d.dropIndex = -1
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
if((mouse.x-table_view.contentX)>table_view.width || (mouse.x-table_view.contentX)<0){
|
if((mouse.x-table_view.contentX)>table_view.width || (mouse.x-table_view.contentX)<0){
|
||||||
d.hoverItem = undefined
|
|
||||||
d.hoverIndex = -1
|
|
||||||
d.dropIndex = -1
|
d.dropIndex = -1
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
@ -139,16 +130,6 @@ Item {
|
|||||||
var viewPos = table_view.mapToGlobal(0,0)
|
var viewPos = table_view.mapToGlobal(0,0)
|
||||||
var y = table_view.contentY + pos.y-viewPos.y
|
var y = table_view.contentY + pos.y-viewPos.y
|
||||||
var index = Math.floor(y/30)
|
var index = Math.floor(y/30)
|
||||||
if(item_mouse.pressed){
|
|
||||||
d.hoverItem = undefined
|
|
||||||
d.hoverIndex = -1
|
|
||||||
}else{
|
|
||||||
d.hoverItem = item_container
|
|
||||||
d.hoverIndex = index
|
|
||||||
}
|
|
||||||
if(!drag.active){
|
|
||||||
return
|
|
||||||
}
|
|
||||||
if(tree_model.hitHasChildrenExpanded(index) && y>index*30+15){
|
if(tree_model.hitHasChildrenExpanded(index) && y>index*30+15){
|
||||||
d.dropIndex = index + 1
|
d.dropIndex = index + 1
|
||||||
d.isDropTopArea = true
|
d.isDropTopArea = true
|
||||||
@ -163,21 +144,22 @@ Item {
|
|||||||
}
|
}
|
||||||
onCanceled: {
|
onCanceled: {
|
||||||
loader_container.sourceComponent = undefined
|
loader_container.sourceComponent = undefined
|
||||||
d.itemPress = false
|
loader_container.x = 0
|
||||||
|
loader_container.y = 0
|
||||||
d.dropIndex = -1
|
d.dropIndex = -1
|
||||||
d.dragIndex = -1
|
d.dragIndex = -1
|
||||||
}
|
}
|
||||||
onReleased: {
|
onReleased: {
|
||||||
d.itemPress = false
|
|
||||||
loader_container.sourceComponent = undefined
|
loader_container.sourceComponent = undefined
|
||||||
if(d.dropIndex !== -1){
|
if(d.dropIndex !== -1){
|
||||||
tree_model.dragAnddrop(d.dragIndex,d.dropIndex,d.isDropTopArea)
|
tree_model.dragAnddrop(d.dragIndex,d.dropIndex,d.isDropTopArea)
|
||||||
}
|
}
|
||||||
d.dropIndex = -1
|
d.dropIndex = -1
|
||||||
d.dragIndex = -1
|
d.dragIndex = -1
|
||||||
|
loader_container.x = 0
|
||||||
|
loader_container.y = 0
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
Drag.dragType: Drag.None
|
|
||||||
Drag.active: item_mouse.drag.active
|
Drag.active: item_mouse.drag.active
|
||||||
Rectangle{
|
Rectangle{
|
||||||
id:item_line_drop_tip
|
id:item_line_drop_tip
|
||||||
@ -276,6 +258,9 @@ Item {
|
|||||||
color: {
|
color: {
|
||||||
if(FluTheme.dark){
|
if(FluTheme.dark){
|
||||||
if(isCurrent){
|
if(isCurrent){
|
||||||
|
return Qt.rgba(1,1,1,0.06)
|
||||||
|
}
|
||||||
|
if(item_mouse.containsMouse){
|
||||||
return Qt.rgba(1,1,1,0.03)
|
return Qt.rgba(1,1,1,0.03)
|
||||||
}
|
}
|
||||||
return Qt.rgba(0,0,0,0)
|
return Qt.rgba(0,0,0,0)
|
||||||
@ -283,6 +268,9 @@ Item {
|
|||||||
if(isCurrent){
|
if(isCurrent){
|
||||||
return Qt.rgba(0,0,0,0.06)
|
return Qt.rgba(0,0,0,0.06)
|
||||||
}
|
}
|
||||||
|
if(item_mouse.containsMouse){
|
||||||
|
return Qt.rgba(0,0,0,0.03)
|
||||||
|
}
|
||||||
return Qt.rgba(0,0,0,0)
|
return Qt.rgba(0,0,0,0)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -292,28 +280,26 @@ Item {
|
|||||||
anchors.verticalCenter: parent.verticalCenter
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
anchors.left: parent.left
|
anchors.left: parent.left
|
||||||
anchors.leftMargin: 14 + 30*itemModel.depth
|
anchors.leftMargin: 14 + 30*itemModel.depth
|
||||||
Item{
|
Component{
|
||||||
|
id:com_icon_btn
|
||||||
|
FluIconButton{
|
||||||
opacity: itemModel.hasChildren()
|
opacity: itemModel.hasChildren()
|
||||||
Layout.preferredWidth: 20
|
onClicked: {
|
||||||
Layout.preferredHeight: 20
|
|
||||||
TapHandler{
|
|
||||||
enabled: parent.opacity
|
|
||||||
onSingleTapped: {
|
|
||||||
item_container.toggle()
|
item_container.toggle()
|
||||||
}
|
}
|
||||||
}
|
contentItem:FluIcon{
|
||||||
MouseArea{
|
|
||||||
cursorShape: Qt.PointingHandCursor
|
|
||||||
acceptedButtons: Qt.NoButton
|
|
||||||
anchors.fill: parent
|
|
||||||
}
|
|
||||||
FluIcon{
|
|
||||||
rotation: itemModel.isExpanded?0:-90
|
rotation: itemModel.isExpanded?0:-90
|
||||||
iconSource:FluentIcons.ChevronDown
|
iconSource:FluentIcons.ChevronDown
|
||||||
iconSize: 16
|
iconSize: 16
|
||||||
anchors.centerIn: parent
|
anchors.centerIn: parent
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
Loader{
|
||||||
|
Layout.preferredWidth: 20
|
||||||
|
Layout.preferredHeight: 20
|
||||||
|
sourceComponent: itemModel.hasChildren() ? com_icon_btn : undefined
|
||||||
|
}
|
||||||
Item{
|
Item{
|
||||||
id:item_layout_text
|
id:item_layout_text
|
||||||
Layout.preferredWidth: item_text.implicitWidth+14
|
Layout.preferredWidth: item_text.implicitWidth+14
|
||||||
@ -324,6 +310,9 @@ Item {
|
|||||||
text: itemModel.title
|
text: itemModel.title
|
||||||
anchors.centerIn: parent
|
anchors.centerIn: parent
|
||||||
color:{
|
color:{
|
||||||
|
if(item_mouse.pressed){
|
||||||
|
return FluTheme.dark ? FluColors.Grey80 : FluColors.Grey120
|
||||||
|
}
|
||||||
return FluTheme.dark ? FluColors.White : FluColors.Grey220
|
return FluTheme.dark ? FluColors.White : FluColors.Grey220
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -331,66 +320,13 @@ Item {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
Component{
|
|
||||||
id:com_background
|
|
||||||
Item{
|
|
||||||
Rectangle{
|
|
||||||
radius: 4
|
|
||||||
anchors{
|
|
||||||
fill: parent
|
|
||||||
leftMargin: 6
|
|
||||||
rightMargin: 6
|
|
||||||
}
|
|
||||||
color:{
|
|
||||||
if(FluTheme.dark){
|
|
||||||
if(d.itemPress){
|
|
||||||
return Qt.rgba(1,1,1,0.06)
|
|
||||||
}
|
|
||||||
return Qt.rgba(1,1,1,0.03)
|
|
||||||
}else{
|
|
||||||
if(d.itemPress){
|
|
||||||
return Qt.rgba(0,0,0,0.06)
|
|
||||||
}
|
|
||||||
return Qt.rgba(0,0,0,0.03)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
ScrollView{
|
ScrollView{
|
||||||
id:scroll_view
|
id:scroll_view
|
||||||
anchors.fill: parent
|
anchors.fill: parent
|
||||||
ScrollBar.horizontal.policy: ScrollBar.AlwaysOff
|
ScrollBar.horizontal.policy: ScrollBar.AlwaysOff
|
||||||
ScrollBar.vertical.policy: ScrollBar.AlwaysOff
|
ScrollBar.vertical.policy: ScrollBar.AlwaysOff
|
||||||
Loader{
|
clip: true
|
||||||
id:loader_background
|
ListView{
|
||||||
y:{
|
|
||||||
if(d.hoverItem){
|
|
||||||
var cellPosition = d.hoverItem.mapToItem(table_view, 0, 0)
|
|
||||||
return cellPosition.y
|
|
||||||
}
|
|
||||||
return 0
|
|
||||||
}
|
|
||||||
width: {
|
|
||||||
if(d.hoverItem){
|
|
||||||
return d.hoverItem.width
|
|
||||||
}
|
|
||||||
return 0
|
|
||||||
}
|
|
||||||
height: {
|
|
||||||
if(d.hoverItem){
|
|
||||||
return d.hoverItem.height
|
|
||||||
}
|
|
||||||
return 0
|
|
||||||
}
|
|
||||||
sourceComponent: {
|
|
||||||
if(d.hoverIndex === -1 || d.itemDragActive){
|
|
||||||
return undefined
|
|
||||||
}
|
|
||||||
return com_background
|
|
||||||
}
|
|
||||||
}
|
|
||||||
TableView{
|
|
||||||
id:table_view
|
id:table_view
|
||||||
ScrollBar.horizontal: FluScrollBar{}
|
ScrollBar.horizontal: FluScrollBar{}
|
||||||
ScrollBar.vertical: FluScrollBar{}
|
ScrollBar.vertical: FluScrollBar{}
|
||||||
@ -398,26 +334,54 @@ Item {
|
|||||||
model: tree_model
|
model: tree_model
|
||||||
clip: true
|
clip: true
|
||||||
anchors.fill: parent
|
anchors.fill: parent
|
||||||
onContentYChanged:{
|
contentWidth: contentItem.childrenRect.width
|
||||||
timer_refresh.restart()
|
reuseItems: true
|
||||||
|
removeDisplaced : Transition{
|
||||||
|
ParallelAnimation{
|
||||||
|
NumberAnimation {
|
||||||
|
properties: "y"
|
||||||
|
duration: 167
|
||||||
|
from: d.dy + table_view.height
|
||||||
|
easing.type: Easing.OutCubic
|
||||||
|
}
|
||||||
|
NumberAnimation {
|
||||||
|
properties: "opacity"
|
||||||
|
duration: 300
|
||||||
|
from: 0
|
||||||
|
to: 1
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
add: Transition{
|
||||||
|
ParallelAnimation{
|
||||||
|
NumberAnimation {
|
||||||
|
properties: "y"
|
||||||
|
duration: 167
|
||||||
|
from: d.dy
|
||||||
|
easing.type: Easing.OutCubic
|
||||||
|
}
|
||||||
|
NumberAnimation {
|
||||||
|
properties: "opacity"
|
||||||
|
duration: 300
|
||||||
|
from: 0
|
||||||
|
to: 1
|
||||||
|
}
|
||||||
}
|
}
|
||||||
onWidthChanged: {
|
|
||||||
timer_refresh.restart()
|
|
||||||
}
|
}
|
||||||
delegate: Item {
|
delegate: Item {
|
||||||
id:item_control
|
id:item_control
|
||||||
implicitWidth: item_loader_container.width
|
implicitWidth: item_loader_container.width
|
||||||
implicitHeight: item_loader_container.height
|
implicitHeight: item_loader_container.height
|
||||||
TableView.onReused: {
|
ListView.onReused: {
|
||||||
item_loader_container.item.reused()
|
item_loader_container.item.reused()
|
||||||
}
|
}
|
||||||
TableView.onPooled: {
|
ListView.onPooled: {
|
||||||
item_loader_container.item.pooled()
|
item_loader_container.item.pooled()
|
||||||
}
|
}
|
||||||
Loader{
|
Loader{
|
||||||
property var itemControl: item_control
|
property var itemControl: item_control
|
||||||
property var itemModel: modelData
|
property var itemModel: modelData
|
||||||
property int rowIndex: row
|
property int rowIndex: index
|
||||||
property bool isItemLoader: true
|
property bool isItemLoader: true
|
||||||
id:item_loader_container
|
id:item_loader_container
|
||||||
sourceComponent: com_item_container
|
sourceComponent: com_item_container
|
||||||
@ -435,7 +399,7 @@ Item {
|
|||||||
return tree_model.dataSourceSize
|
return tree_model.dataSourceSize
|
||||||
}
|
}
|
||||||
function visibleCount(){
|
function visibleCount(){
|
||||||
return table_view.rows
|
return table_view.count
|
||||||
}
|
}
|
||||||
function collapse(rowIndex){
|
function collapse(rowIndex){
|
||||||
tree_model.collapse(rowIndex)
|
tree_model.collapse(rowIndex)
|
||||||
|
Loading…
Reference in New Issue
Block a user