From 6352986e31c77964a82714c18adbfb88833840b3 Mon Sep 17 00:00:00 2001 From: Christian Mollekopf Date: Sun, 19 Aug 2018 11:21:29 +0200 Subject: ListView for calendars so we can deal with many calendars --- views/calendar/main.qml | 84 +++++++++++++++++++++++++++++++++ views/calendar/qml/View.qml | 112 +++++++++++++++++++++++--------------------- 2 files changed, 142 insertions(+), 54 deletions(-) diff --git a/views/calendar/main.qml b/views/calendar/main.qml index bf7179b7..11eff6c8 100644 --- a/views/calendar/main.qml +++ b/views/calendar/main.qml @@ -142,6 +142,90 @@ ApplicationWindow { resource: "caldavresource", name: "Test Calendar2", color: "#f67400" + }, + { + id: "calendar3", + resource: "caldavresource", + name: "Test Calendar3 Loooooooooooooooooooooooooooooong Name", + color: "#f67400" + }, + { + id: "calendar4", + resource: "caldavresource", + name: "Test Calendar4", + color: "#f67400" + }, + { + id: "calendar5", + resource: "caldavresource", + name: "Test Calendar5", + color: "#f67400" + }, + { + id: "calendar6", + resource: "caldavresource", + name: "Test Calendar6", + color: "#f67400" + }, + { + id: "calendar7", + resource: "caldavresource", + name: "Test Calendar7", + color: "#f67400" + }, + { + id: "calendar8", + resource: "caldavresource", + name: "Test Calendar8", + color: "#f67400" + }, + { + id: "calendar9", + resource: "caldavresource", + name: "Test Calendar9", + color: "#f67400" + }, + { + id: "calendar10", + resource: "caldavresource", + name: "Test Calendar 10", + color: "#f67400" + }, + { + id: "calendar11", + resource: "caldavresource", + name: "Test Calendar11", + color: "#f67400" + }, + { + id: "calendar12", + resource: "caldavresource", + name: "Test Calendar12", + color: "#f67400" + }, + { + id: "calendar13", + resource: "caldavresource", + name: "Test Calendar13", + color: "#f67400" + }, + { + id: "calendar14", + resource: "caldavresource", + name: "Test Calendar14", + color: "#f67400" + }, + { + id: "calendar15", + resource: "caldavresource", + name: "Test Calendar15", + color: "#f67400" + }, + { + id: "calendar16", + resource: "caldavresource", + name: "Test Calendar16", + color: "#f67400" }], } TestStore.setup(initialState) diff --git a/views/calendar/qml/View.qml b/views/calendar/qml/View.qml index 0ef87e65..3aa1398d 100644 --- a/views/calendar/qml/View.qml +++ b/views/calendar/qml/View.qml @@ -59,48 +59,52 @@ RowLayout { } Rectangle { + anchors { + top: parent.top + bottom: parent.bottom + } width: Kube.Units.gridUnit * 10 - Layout.fillHeight: parent.height color: Kube.Colors.darkBackgroundColor - Kube.PositiveButton { - id: newEventButton - objectName: "newEventButton" - + Column { + id: topLayout anchors { top: parent.top left: parent.left right: parent.right margins: Kube.Units.largeSpacing } - focus: true - text: qsTr("New Event") - onClicked: {} - } + Kube.PositiveButton { + id: newEventButton + objectName: "newEventButton" - Column { - anchors { - top: newEventButton.bottom - left: newEventButton.left - topMargin: Kube.Units.largeSpacing + anchors { + left: parent.left + right: parent.right + } + focus: true + text: qsTr("New Event") + onClicked: {} } - - width: parent.width - spacing: Kube.Units.smallSpacing - DateView { + anchors { + left: parent.left + right: parent.right + } date: root.currentDate } - } ColumnLayout { + //Grow from the button but don't go over topLayout anchors { bottom: parent.bottom - left: newEventButton.left + left: topLayout.left right: parent.right bottomMargin: Kube.Units.largeSpacing + rightMargin: Kube.Units.largeSpacing } + height: Math.min(implicitHeight, parent.height - (topLayout.y + topLayout.height) - Kube.Units.largeSpacing) spacing: Kube.Units.largeSpacing @@ -109,7 +113,6 @@ RowLayout { anchors { left: parent.left right: parent.right - rightMargin: Kube.Units.largeSpacing } selectedDate: root.selectedDate onSelectedDateChanged: { @@ -118,44 +121,45 @@ RowLayout { } } - Column { + Kube.ListView { + Layout.fillHeight: true + Layout.preferredHeight: contentHeight + Layout.minimumHeight: Kube.Units.gridUnit anchors { left: parent.left right: parent.right } spacing: Kube.Units.smallSpacing - Repeater { - model: Kube.CheckableEntityModel { - id: calendarModel - type: "calendar" - roles: ["name", "color"] - } - delegate: Item { - width: parent.width - Kube.Units.largeSpacing - height: Kube.Units.gridUnit - RowLayout { - anchors.fill: parent - spacing: Kube.Units.smallSpacing - Kube.CheckBox { - opacity: 0.9 - checked: !model.checked - onToggled: model.checked = !checked - } - Kube.Label { - Layout.fillWidth: true - text: model.name - color: Kube.Colors.highlightedTextColor - elide: Text.ElideRight - clip: true - } - Rectangle { - anchors.verticalCenter: parent.verticalCenter - width: Kube.Units.gridUnit - height: width - radius: width / 2 - color: model.color - opacity: 0.9 - } + model: Kube.CheckableEntityModel { + id: calendarModel + type: "calendar" + roles: ["name", "color"] + } + delegate: Item { + width: parent.width + height: Kube.Units.gridUnit + RowLayout { + anchors.fill: parent + spacing: Kube.Units.smallSpacing + Kube.CheckBox { + opacity: 0.9 + checked: !model.checked + onToggled: model.checked = !checked + } + Kube.Label { + Layout.fillWidth: true + text: model.name + color: Kube.Colors.highlightedTextColor + elide: Text.ElideRight + clip: true + } + Rectangle { + anchors.verticalCenter: parent.verticalCenter + width: Kube.Units.gridUnit + height: width + radius: width / 2 + color: model.color + opacity: 0.9 } } } -- cgit v1.2.3