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
7import QtQuick.Layouts
8import QtQuick.Controls as QQC2
9import org.mauikit.controls as Maui
10
11import org.mauikit.calendar 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)
150 onDoubleClicked: 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...)
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 Oct 11 2024 12:08:19 by doxygen 1.12.0 written by Dimitri van Heesch, © 1997-2006

KDE's Doxygen guidelines are available online.