MauiKit Calendar

DayGridView.qml
1// Copyright (C) 2018 Michael Bohlender, <bohlender@kolabsys.com>
2// Copyright (C) 2018 Christian Mollekopf, <mollekopf@kolabsys.com>
3// SPDX-FileCopyrightText: 2021 Claudio Cambra <claudio.cambra@gmail.com>
4// SPDX-License-Identifier: GPL-2.0-or-later
5
6import QtQuick 2.15
7import QtQuick.Layouts 1.15
8import QtQuick.Controls 2.15 as QQC2
9import org.mauikit.controls 1.3 as Maui
10
11import org.mauikit.calendar 1.0 as Kalendar
12import "dateutils.js" as DateUtils
13import "labelutils.js" as LabelUtils
14
15QQC2.Pane
16{
17 id: root
18
19 property var openOccurrence
20 property var model
21
22 property int daysToShow: daysPerRow * 6
23 property int daysPerRow: 7
24 property double weekHeaderWidth: root.showWeekNumbers ? Maui.Style.units.gridUnit * 1.5 : 0
25 property date currentDate
26
27 property int currentDay: currentDate ? currentDate.getDate() : null
28 property int currentMonth: currentDate ? currentDate.getMonth() : null
29 property int currentYear: currentDate ? currentDate.getFullYear() : null
30
31 property date startDate
32
33 property bool paintGrid: true
34 property bool showDayIndicator: true
35
36 property Component dayHeaderDelegate
37 property Component weekHeaderDelegate
38
39 property int month
40 property alias bgLoader: backgroundLoader.item
41 property bool isCurrentView: true
42 property bool dragDropEnabled: true
43 property bool showWeekNumbers : false
44
45 //Internal
46 property int numberOfLinesShown: 0
47 property int numberOfRows: (daysToShow / daysPerRow)
48
49 property int dayWidth: (root.showWeekNumbers ?
50 ((width - weekHeaderWidth) / daysPerRow) - spacing : // No spacing on right, spacing in between weekheader and monthgrid
51 (width - rightPadding - leftPadding - weekHeaderWidth - (spacing * (daysPerRow - 1))) / daysPerRow) // No spacing on left or right of month grid when no week header
52
53 property int dayHeight: ((height - topPadding - bottomPadding - bgLoader.dayLabelsBar.height) / numberOfRows) - spacing
54
55 readonly property bool isDark: KalendarUiUtils.darkMode
56 // readonly property int mode: Kalendar.KalendarApplication.Event
57
58 // implicitHeight: (numberOfRows > 1 ? Maui.Style.units.gridUnit * 10 * numberOfRows : numberOfLinesShown * Maui.Style.units.gridUnit) + bgLoader.dayLabelsBar.height +topPadding + bottomPadding
59 // height: implicitHeight
60 readonly property bool isWide : dayWidth > Maui.Style.units.gridUnit * 5
61
62 padding: Maui.Style.space.medium
63 spacing: Maui.Style.space.small
64 background: null
65
66 signal dateClicked(var date)
67 signal dateDoubleClicked(var date)
68
69 contentItem: Loader
70 {
71 id: backgroundLoader
72 asynchronous: !root.isCurrentView
73 sourceComponent: Column
74 {
75 id: rootBackgroundColumn
76 spacing: root.spacing
77
78 property alias dayLabelsBar: dayLabelsBarComponent
79 Kalendar.DayLabelsBar
80 {
81 id: dayLabelsBarComponent
82 delegate: root.dayHeaderDelegate
83 startDate: root.startDate
84 dayWidth: root.dayWidth
85 daysToShow: root.daysPerRow
86 spacing: root.spacing
87 anchors.leftMargin: root.showWeekNumbers ? weekHeaderWidth + root.spacing : 0
88 anchors.left: parent.left
89 anchors.right: parent.right
90 }
91
92 Repeater
93 {
94 model: root.numberOfRows
95
96 //One row => one week
97 Item
98 {
99 width: parent.width
100 height: root.dayHeight
101 clip: true
102
103 RowLayout
104 {
105 width: parent.width
106 height: parent.height
107 spacing: root.spacing
108
109 Loader
110 {
111 id: weekHeader
112 sourceComponent: root.weekHeaderDelegate
113 property date startDate: DateUtils.addDaysToDate(root.startDate, index * 7)
114 Layout.preferredWidth: weekHeaderWidth
115 Layout.fillHeight: true
116 active: root.showWeekNumbers
117 visible: root.showWeekNumbers
118 }
119
120 Item
121 {
122 id: dayDelegate
123 Layout.fillWidth: true
124 Layout.fillHeight: true
125 property date startDate: DateUtils.addDaysToDate(root.startDate, index * 7)
126
127 //Grid
128 Row
129 {
130 spacing: root.spacing
131 height: parent.height
132
133 Repeater
134 {
135 id: gridRepeater
136 model: root.daysPerRow
137
138 QQC2.Button
139 {
140 id: gridItem
141 Maui.Theme.colorSet: Maui.Theme.View
142 Maui.Theme.inherit: false
143
144 height: root.dayHeight
145 width: root.dayWidth
146 enabled: root.daysToShow > 1
147 visible: root.showDayIndicator
148 padding: Maui.Style.space.small
149 onClicked: root.dateClicked(gridItem.date)
150onDoubleClicked: root.dateDoubleClicked(gridItem.date)
151
152 property date gridSquareDate: date
153 property date date: DateUtils.addDaysToDate(dayDelegate.startDate, modelData)
154 property int day: date.getDate()
155 property int month: date.getMonth()
156 property int year: date.getFullYear()
157 property bool isToday: day === root.currentDay && month === root.currentMonth && year === root.currentYear
158 property bool isCurrentMonth: month === root.month
159
160 background: Rectangle
161 {
162 visible: gridItem.isCurrentMonth
163 color: gridItem.isToday ? Maui.Theme.activeBackgroundColor :
164 gridItem.hovered ? Maui.Theme.hoverColor : Maui.Theme.alternateBackgroundColor
165 radius: Maui.Style.radiusV
166 }
167
168 contentItem: ColumnLayout
169 {
170 spacing: Maui.Style.space.medium
171 RowLayout
172 {
173 id: dayNumberLayout
174 Layout.fillWidth: true
175 visible: root.showDayIndicator
176
177
178 QQC2.Label
179 {
180 Layout.alignment: Qt.AlignLeft | Qt.AlignTop
181 text: i18n("Today")
182 renderType: Text.QtRendering
183 color: Maui.Theme.highlightedTextColor
184 visible: gridItem.isToday && root.isWide
185 font.bold: root.isWide
186 font.weight: root.isWide ? Font.Bold : Font.Normal
187 font.pointSize: root.isWide ? Maui.Style.fontSizes.big : Maui.Style.fontSizes.small
188 }
189
190 QQC2.Label
191 {
192 Layout.alignment: gridItem.width > Maui.Style.units.gridUnit * 5 ? Qt.AlignRight | Qt.AlignTop : Qt.AlignCenter
193
194 text: gridItem.date.toLocaleDateString(Qt.locale(), gridItem.day == 1 && root.isWide ? "d MMM" : "d")
195 renderType: Text.QtRendering
196 horizontalAlignment: Qt.AlignHCenter
197
198 color: gridItem.isToday ?
199 Maui.Theme.highlightedTextColor :
200 (!gridItem.isCurrentMonth ? Maui.Theme.disabledTextColor : Maui.Theme.textColor)
201 font.bold: root.isWide
202 font.weight: root.isWide ? Font.Bold : Font.Normal
203 font.pointSize: root.isWide ? Maui.Style.fontSizes.big : Maui.Style.fontSizes.small
204
205 }
206 }
207
208
209 Flow
210 {
211 width: parent.width
212 Layout.alignment: Qt.AlignBottom
213 Layout.fillWidth: true
214 Layout.fillHeight: true
215 spacing: Maui.Style.space.tiny
216 clip: true
217
218 Repeater
219 {
220 model: Kalendar.IncidenceOccurrenceModel
221 {
222 start: gridItem.date
223 length: 0
224 calendar: Kalendar.CalendarManager.calendar
225 filter: Kalendar.Filter
226 }
227
228
229
230
231 delegate: Rectangle
232 {
233 radius: height
234 height: 10
235 width: height
236 color: randomColor(150)
237
238 function randomColor(brightness){
239 function randomChannel(brightness){
240 var r = 255-brightness;
241 var n = 0|((Math.random() * r) + brightness);
242 var s = n.toString(16);
243 return (s.length==1) ? '0'+s : s;
244 }
245 return '#' + randomChannel(brightness) + randomChannel(brightness) + randomChannel(brightness);
246 }
247
248 }
249 }
250 }
251
252 }
253
254 }
255 }
256 }
257 }
258 }
259 }
260 }
261 }
262 }
263
264 // Loader {
265 // id: foregroundLoader
266 // anchors.fill: parent
267 // asynchronous: !root.isCurrentView
268 // sourceComponent: Column {
269 // id: rootForegroundColumn
270 // spacing: root.spacing
271 // anchors {
272 // fill: parent
273 // topMargin: root.bgLoader.dayLabelsBar.height + root.spacing
274 // leftMargin: root.showWeekNumbers ? weekHeaderWidth + root.spacing : 0
275 // }
276
277 // //Weeks
278 // Repeater {
279 // model: root.model
280 // //One row => one week
281 // Item {
282 // width: parent.width
283 // height: root.dayHeight
284 // clip: true
285 // RowLayout {
286 // width: parent.width
287 // height: parent.height
288 // spacing: root.spacing
289 // Item {
290 // id: dayDelegate
291 // Layout.fillWidth: true
292 // Layout.fillHeight: true
293 // property date startDate: periodStartDate
294
295 // ListView {
296 // id: linesRepeater
297
298 // anchors {
299 // fill: parent
300 // // Offset for date
301 // topMargin: root.showDayIndicator ? Kirigami.Units.gridUnit + Kirigami.Units.largeSpacing * 1.5 : 0
302 // rightMargin: spacing
303 // }
304
305 // // DO NOT use a ScrollView as a bug causes this to crash randomly.
306 // // So we instead make the ListView act like a ScrollView on desktop. No crashing now!
307 // flickableDirection: Flickable.VerticalFlick
308 // boundsBehavior: Kirigami.Settings.isMobile ? Flickable.DragAndOvershootBounds : Flickable.StopAtBounds
309 // QQC2.ScrollBar.vertical: QQC2.ScrollBar {}
310
311 // clip: true
312 // spacing: root.listViewSpacing
313
314 // DayMouseArea {
315 // id: listViewMenu
316 // anchors.fill: parent
317 // z: -1
318
319 // function useGridSquareDate(type, root, globalPos) {
320 // for(var i in root.children) {
321 // var child = root.children[i];
322 // var localpos = child.mapFromGlobal(globalPos.x, globalPos.y);
323
324 // if(child.contains(localpos) && child.gridSquareDate) {
325 // KalendarUiUtils.setUpAdd(type, child.gridSquareDate);
326 // } else {
327 // useGridSquareDate(type, child, globalPos);
328 // }
329 // }
330 // }
331
332 // onAddNewIncidence: useGridSquareDate(type, applicationWindow().contentItem, this.mapToGlobal(clickX, clickY))
333 // onDeselect: KalendarUiUtils.appMain.incidenceInfoDrawer.close()
334 // }
335
336 // model: incidences
337 // onCountChanged: {
338 // root.numberOfLinesShown = count
339 // }
340
341 // delegate: Item {
342 // id: line
343 // height: Kirigami.Units.gridUnit + Kirigami.Units.smallSpacing
344
345 // //Incidences
346 // Repeater {
347 // id: incidencesRepeater
348 // model: modelData
349
350 // DayGridViewIncidenceDelegate {
351 // id: incidenceDelegate
352 // dayWidth: root.dayWidth
353 // height: line.height
354 // parentViewSpacing: root.spacing
355 // horizontalSpacing: linesRepeater.spacing
356 // openOccurrenceId: root.openOccurrence ? root.openOccurrence.incidenceId : ""
357 // isDark: root.isDark
358 // dragDropEnabled: root.dragDropEnabled
359 // }
360 // }
361 // }
362 // }
363 // }
364 // }
365 // }
366 // }
367 // }
368 // }
369}
start
Q_SCRIPTABLE Q_NOREPLY void start()
i18n
QString i18n(const char *text, const TYPE &arg...)
Qt::AlignHCenter
AlignHCenter
QtConcurrent::filter
QFuture< void > filter(QThreadPool *pool, Sequence &sequence, KeepFunctor &&filterFunction)
This file is part of the KDE documentation.
Documentation copyright © 1996-2024 The KDE developers.
Generated on Fri May 17 2024 11:50:32 by doxygen 1.10.0 written by Dimitri van Heesch, © 1997-2006

KDE's Doxygen guidelines are available online.