todo list

This commit is contained in:
end-4
2025-04-17 12:31:51 +02:00
parent d6914a4ea2
commit 4db72d941e
11 changed files with 249 additions and 74 deletions
@@ -6,29 +6,120 @@ import QtQuick.Controls
import QtQuick.Layouts
Item {
id: root
required property var taskList;
property int todoListItemSpacing: 5
property int todoListItemPadding: 8
Flickable {
Flickable { // Scrolled window
anchors.fill: parent
contentHeight: column.height
contentHeight: columnLayout.height
clip: true
ColumnLayout {
id: column
id: columnLayout
width: parent.width
spacing: 0
Repeater {
model: taskList
delegate: Rectangle {
delegate: Item {
id: todoItem
property bool pendingDoneToggle: false
property bool pendingDelete: false
Layout.fillWidth: true
width: parent.width
height: 40
color: Appearance.colors.colLayer2
radius: Appearance.rounding.small
Text {
text: modelData.content
anchors.verticalCenter: parent.verticalCenter
implicitHeight: todoItemRectangle.implicitHeight + todoListItemSpacing
height: implicitHeight
clip: true
// Behavior on implicitHeight {
// NumberAnimation {
// duration: Appearance.animation.elementDecel.duration
// easing.type: Appearance.animation.elementDecel.type
// }
// }
function startAction() {
todoItem.implicitHeight = 0
actionTimer.start()
}
Timer {
id: actionTimer
interval: Appearance.animation.elementDecelFast.duration + ConfigOptions.hacks.arbitraryRaceConditionDelay
repeat: false
onTriggered: {
if (todoItem.pendingDelete) {
Todo.deleteItem(modelData.originalIndex)
} else if (todoItem.pendingDoneToggle) {
if (!modelData.done) Todo.markDone(modelData.originalIndex)
else Todo.markUnfinished(modelData.originalIndex)
}
}
}
Rectangle {
id: todoItemRectangle
anchors.left: parent.left
anchors.leftMargin: 8
anchors.right: parent.right
anchors.bottom: parent.bottom
implicitHeight: todoContentRowLayout.implicitHeight + todoListItemPadding * 2
color: Appearance.colors.colLayer2
radius: Appearance.rounding.small
ColumnLayout {
id: todoContentRowLayout
anchors.left: parent.left
anchors.right: parent.right
StyledText {
Layout.fillWidth: true // Needed for wrapping
Layout.leftMargin: 10
Layout.rightMargin: 10
Layout.topMargin: todoListItemPadding
id: todoContentText
text: modelData.content
wrapMode: Text.Wrap
}
RowLayout {
Layout.leftMargin: 10
Layout.rightMargin: 10
Item {
Layout.fillWidth: true
}
// layoutDirection: Qt.RightToLeft
TodoItemActionButton {
Layout.fillWidth: false
onClicked: {
todoItem.pendingDoneToggle = true
todoItem.startAction()
// if (!modelData.done) Todo.markDone(modelData.originalIndex)
// else Todo.markUnfinished(modelData.originalIndex)
}
contentItem: MaterialSymbol {
anchors.centerIn: parent
horizontalAlignment: Text.AlignHCenter
text: modelData.done ? "remove_done" : "check"
font.pixelSize: Appearance.font.pixelSize.larger
color: Appearance.colors.colOnLayer1
}
}
TodoItemActionButton {
Layout.fillWidth: false
onClicked: {
todoItem.pendingDelete = true
todoItem.startAction()
// Todo.deleteItem(modelData.originalIndex)
}
contentItem: MaterialSymbol {
anchors.centerIn: parent
horizontalAlignment: Text.AlignHCenter
text: "delete_forever"
font.pixelSize: Appearance.font.pixelSize.larger
color: Appearance.colors.colOnLayer1
}
}
}
}
}
}
}
@@ -0,0 +1,46 @@
import "root:/modules/common"
import "root:/modules/common/widgets"
import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
Button {
id: button
property string buttonText: ""
property string tooltipText: ""
implicitHeight: 30
implicitWidth: implicitHeight
Behavior on implicitWidth {
SmoothedAnimation {
velocity: Appearance.animation.elementDecel.velocity
}
}
background: Rectangle {
anchors.fill: parent
radius: Appearance.rounding.full
color: (button.down) ? Appearance.colors.colLayer2Active : (button.hovered ? Appearance.colors.colLayer2Hover : Appearance.transparentize(Appearance.colors.colLayer2, 1))
Behavior on color {
ColorAnimation {
duration: Appearance.animation.elementDecel.duration
easing.type: Appearance.animation.elementDecel.type
}
}
}
contentItem: StyledText {
text: buttonText
horizontalAlignment: Text.AlignHCenter
font.pixelSize: Appearance.font.pixelSize.larger
color: Appearance.colors.colOnLayer1
}
StyledToolTip {
content: tooltipText
extraVisibleCondition: tooltipText.length > 0
}
}
@@ -36,7 +36,7 @@ Item {
delegate: StyledTabButton {
selected: (index == currentTab)
buttonText: modelData.name
// buttonIcon: modelData.icon
buttonIcon: modelData.icon
}
}
}
@@ -71,10 +71,14 @@ Item {
// To Do tab
TaskList {
taskList: Todo.list.filter(item => !item.done)
taskList: Todo.list
.map(function(item, i) { return Object.assign({}, item, {originalIndex: i}); })
.filter(function(item) { return !item.done; })
}
TaskList {
taskList: Todo.list.filter(item => item.done)
taskList: Todo.list
.map(function(item, i) { return Object.assign({}, item, {originalIndex: i}); })
.filter(function(item) { return item.done; })
}
}