fix: remove clippingrectangle in favor of passing radius to sub-items
This commit is contained in:
@@ -11,8 +11,8 @@ import qs.Components
|
||||
Item {
|
||||
id: root
|
||||
|
||||
readonly property real nonAnimWidth: view.implicitWidth + clipWrapper.anchors.margins * 2
|
||||
readonly property real nonAnimHeight: tabs.implicitHeight + tabs.anchors.topMargin + view.implicitHeight + clipWrapper.anchors.margins + clipWrapper.anchors.topMargin
|
||||
readonly property real nonAnimWidth: view.implicitWidth + viewWrapper.anchors.margins * 2
|
||||
readonly property real nonAnimHeight: tabs.implicitHeight + tabs.anchors.topMargin + view.implicitHeight + viewWrapper.anchors.margins + viewWrapper.anchors.topMargin
|
||||
|
||||
required property ScreenState screenState
|
||||
|
||||
@@ -74,115 +74,118 @@ Item {
|
||||
anchors.margins: Tokens.padding.small
|
||||
}
|
||||
|
||||
CustomClippingRect {
|
||||
id: clipWrapper
|
||||
Item {
|
||||
id: viewWrapper
|
||||
|
||||
property int radius: Tokens.rounding.extraLarge - anchors.margins
|
||||
|
||||
anchors.top: tabs.bottom
|
||||
anchors.left: parent.left
|
||||
anchors.right: parent.right
|
||||
anchors.bottom: parent.bottom
|
||||
anchors.topMargin: Tokens.spacing.small
|
||||
anchors.margins: Tokens.padding.small
|
||||
radius: Tokens.rounding.extraLarge - anchors.margins
|
||||
clip: true
|
||||
|
||||
Item {
|
||||
id: viewWrapper
|
||||
Flickable {
|
||||
id: view
|
||||
|
||||
readonly property int currentIndex: root.screenState.dashboardTab
|
||||
readonly property Item currentItem: {
|
||||
repeater.count;
|
||||
return repeater.itemAt(currentIndex);
|
||||
}
|
||||
|
||||
anchors.fill: parent
|
||||
|
||||
Flickable {
|
||||
id: view
|
||||
implicitWidth: currentItem?.implicitWidth ?? 0
|
||||
implicitHeight: currentItem?.implicitHeight ?? 0
|
||||
|
||||
readonly property int currentIndex: root.screenState.dashboardTab
|
||||
readonly property Item currentItem: {
|
||||
repeater.count;
|
||||
return repeater.itemAt(currentIndex);
|
||||
}
|
||||
contentX: currentItem?.x ?? 0
|
||||
contentWidth: row.implicitWidth
|
||||
contentHeight: row.implicitHeight
|
||||
|
||||
anchors.fill: parent
|
||||
interactive: false
|
||||
|
||||
implicitWidth: currentItem?.implicitWidth ?? 0
|
||||
implicitHeight: currentItem?.implicitHeight ?? 0
|
||||
onContentXChanged: {
|
||||
if (!moving || !currentItem)
|
||||
return;
|
||||
|
||||
contentX: currentItem?.x ?? 0
|
||||
contentWidth: row.implicitWidth
|
||||
contentHeight: row.implicitHeight
|
||||
const x = contentX - currentItem.x;
|
||||
if (x > currentItem.implicitWidth / 2)
|
||||
root.screenState.dashboardTab = Math.min(root.screenState.dashboardTab + 1, tabs.count - 1);
|
||||
else if (x < -currentItem.implicitWidth / 2)
|
||||
root.screenState.dashboardTab = Math.max(root.screenState.dashboardTab - 1, 0);
|
||||
}
|
||||
|
||||
interactive: false
|
||||
RowLayout {
|
||||
id: row
|
||||
|
||||
onContentXChanged: {
|
||||
if (!moving || !currentItem)
|
||||
return;
|
||||
Repeater {
|
||||
id: repeater
|
||||
|
||||
const x = contentX - currentItem.x;
|
||||
if (x > currentItem.implicitWidth / 2)
|
||||
root.screenState.dashboardTab = Math.min(root.screenState.dashboardTab + 1, tabs.count - 1);
|
||||
else if (x < -currentItem.implicitWidth / 2)
|
||||
root.screenState.dashboardTab = Math.max(root.screenState.dashboardTab - 1, 0);
|
||||
}
|
||||
model: ScriptModel {
|
||||
values: root.dashboardTabs
|
||||
}
|
||||
|
||||
RowLayout {
|
||||
id: row
|
||||
delegate: Loader {
|
||||
id: paneLoader
|
||||
|
||||
Repeater {
|
||||
id: repeater
|
||||
required property int index
|
||||
required property var modelData
|
||||
|
||||
model: ScriptModel {
|
||||
values: root.dashboardTabs
|
||||
}
|
||||
Layout.alignment: Qt.AlignTop
|
||||
|
||||
delegate: Loader {
|
||||
id: paneLoader
|
||||
sourceComponent: modelData.component
|
||||
|
||||
required property int index
|
||||
required property var modelData
|
||||
|
||||
Layout.alignment: Qt.AlignTop
|
||||
|
||||
sourceComponent: modelData.component
|
||||
|
||||
Component.onCompleted: active = Qt.binding(() => {
|
||||
if (index === view.currentIndex)
|
||||
return true;
|
||||
const vx = Math.floor(view.visibleArea.xPosition * view.contentWidth);
|
||||
const vex = Math.floor(vx + view.visibleArea.widthRatio * view.contentWidth);
|
||||
return (vx >= x && vx <= x + implicitWidth) || (vex >= x && vex <= x + implicitWidth);
|
||||
})
|
||||
}
|
||||
Component.onCompleted: active = Qt.binding(() => {
|
||||
if (index === view.currentIndex)
|
||||
return true;
|
||||
const vx = Math.floor(view.visibleArea.xPosition * view.contentWidth);
|
||||
const vex = Math.floor(vx + view.visibleArea.widthRatio * view.contentWidth);
|
||||
return (vx >= x && vx <= x + implicitWidth) || (vex >= x && vex <= x + implicitWidth);
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Component {
|
||||
id: dashComponent
|
||||
Component {
|
||||
id: dashComponent
|
||||
|
||||
Dash {
|
||||
screenState: root.screenState
|
||||
}
|
||||
Dash {
|
||||
screenState: root.screenState
|
||||
radius: viewWrapper.radius
|
||||
}
|
||||
}
|
||||
|
||||
Component {
|
||||
id: weatherComponent
|
||||
Component {
|
||||
id: weatherComponent
|
||||
|
||||
WeatherTab {}
|
||||
WeatherTab {
|
||||
radius: viewWrapper.radius
|
||||
}
|
||||
}
|
||||
|
||||
Component {
|
||||
id: mediaComponent
|
||||
Component {
|
||||
id: mediaComponent
|
||||
|
||||
Media {
|
||||
screenState: root.screenState
|
||||
}
|
||||
Media {
|
||||
screenState: root.screenState
|
||||
radius: viewWrapper.radius
|
||||
}
|
||||
}
|
||||
|
||||
Component {
|
||||
id: procsComponent
|
||||
Component {
|
||||
id: procsComponent
|
||||
|
||||
ProcessesTab {}
|
||||
ProcessesTab {
|
||||
radius: viewWrapper.radius
|
||||
}
|
||||
}
|
||||
|
||||
Behavior on contentX {
|
||||
Anim {
|
||||
type: Anim.DefaultEffects
|
||||
}
|
||||
Behavior on contentX {
|
||||
Anim {
|
||||
type: Anim.DefaultEffects
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user