How to make a calendar window

Mikeeeeee

Hi!
How to make a calendar window?
This not work, because I use QtQuick.Controls 2.12

IntruderExcluder

Use calendar from labs module.

Mikeeeeee

This post is deleted!

Mikeeeeee

I connected the module Qt.labs.calendar 1.0 and do this:

    Calendar   {
        x: 23
        y: 154
        width: 340
        height: 355
    }

But the calendar does not accept width, height and coordinates. What to do? How to use this calendar?

IntruderExcluder

Use MonthGrid to customize calendar appearance.

Mikeeeeee

Thanks, it's working. But how to fasten the backlight and buttons to the right days?

IntruderExcluder

Set custom delegate to your grid. There are some useful options.

Mikeeeeee

If so add a delegate, ceases to display the calendar. Please tell me why how to fix it?

    MonthGrid {
        id: mothGrid1
        month: Calendar.December
        year: 2019
        x: 23
        y: 154
        width: 340
        height: 355
        //locale: Qt.locale("en_US")

        delegate: Item {
            MouseArea{
                anchors.fill: parent
                //onClicked: console.log("day = " )
            }
        }
    }

IntruderExcluder

import QtQuick 2.11
import QtQuick.Window 2.11
import Qt.labs.calendar 1.0
import QtQuick.Templates 2.2 as T

Window {
    visible: true
    width: 640
    height: 480
    title: qsTr("Hello World")

    MonthGrid {
        id: mg
        anchors.centerIn: parent
        month: Calendar.December
        year: 2019
        delegate: T.ItemDelegate {
            id: control
            implicitWidth:  40
            implicitHeight: 40
            hoverEnabled: true
            contentItem: Item {
                Text {
                    anchors.centerIn: parent
                    text: model.date.getDate()
                    color: model.month === mg.month ? "black" : "darkgrey"
                }
            }
            background: Rectangle {
                color: "plum"
                visible: control.hovered && model.month === mg.month
            }
            onClicked: console.log("DAY:", model.date)
        }
    }
}