QT/QML - nie działa dopasowanie tekstu do okna

0

Witam wszystkich

Mam prosty programik ktory wyswietla godzine i date. Ogolnie wszystko dziala, dopoki nie wylacze daty i ponownie jej nie wlacze. Po tej operacji godzina nie dopasowuje sie automatycznie.
W kodzie zaznaczylem znakami >> i << o ktora pozycje w menu kontekstowym chodzi. Gdzie lezy problem?

import QtQuick 2.15
import QtQuick.Window 2.15
import QtQuick.Controls 1.4
//https://doc.qt.io/qt-5/qml-qtqml-date.html
Window
{
    id: mainWindow
    width: 640
    height: 480
    visible: true
    title: qsTr("QML Clock")

    property string czas_string: "Godzina"
    property string data_string: "Data"

    MouseArea
    {
        anchors.fill: parent
        acceptedButtons: Qt.LeftButton | Qt.RightButton | Qt.MiddleButton

        onClicked:
        {
            if (mouse.button == Qt.RightButton)
            {
                menu.popup()
//                console.log("Prawy")
            }
            else if (mouse.button == Qt.LeftButton)
            {
//                console.log("Lewy")
            }
            else
            {
//                console.log("Inny")
            }
        }

        Menu
        {
            id: menu
            MenuItem
            {

                checkable: true
                text: qsTr("Usuń obramowanie")
                shortcut: "Ctrl+B"
                onTriggered:
                {
                    if (checked == true)
                    {
                        flags = flags | Qt.FramelessWindowHint
                        text = "Przywróć obramowanie"
                    }
                    else
                    {
                        flags = flags & ~Qt.FramelessWindowHint
                        text = "Usuń obramowanie"
                    }
                }
            }
            MenuItem
            {
                id: naWierzchu
                checkable: true
                text: "Zawsze na wierzchu"
                shortcut: "Ctrl+T"
                onTriggered:
                {
                    if (checked == true)
                    {
                        flags = flags | Qt.WindowStaysOnTopHint
                        text = "Zawsze na wierzchu"
                    }
                    else
                    {
                        flags = flags & ~Qt.WindowStaysOnTopHint
                        text = "Zawsze na wierzchu"
                    }
                }
            }
            MenuSeparator { }
>>>>>>> MenuItem <<<<<<<<
            {
                checkable: true
                text: "Usun Datę"
//                shortcut: "Ctrl+D"

                onTriggered:
                {
                    if (checked == true)
                    {
                        text = "Usun datę"

                        dateLabel.visible = false
                        timeLabel.width = mainWindow.width
                        timeLabel.height = mainWindow.height
                    }
                    else
                    {
                        text = "Pokaż datę"

                        dateLabel.visible = true
                        timeLabel.width = mainWindow.width
                        timeLabel.height = mainWindow.height/2
                    }
                }
            }
            MenuSeparator { }
            MenuItem
            {
                text: "Zamknij progrm"
                shortcut: "Ctrl+Q"
                onTriggered: Qt.quit()
            }
        }
    }
    function timeChanged()
    {
        var data = new Date;

        czas_string = data.toLocaleString(Qt.locale("pl_PL"), "h:mm:ss");
        data_string = data.toLocaleString(Qt.locale("pl_PL"), "yyyy-MM-dd\ndddd");
    }
    Timer
    {
        interval: 1000; running: true; repeat: true
        onTriggered: mainWindow.timeChanged()
    }

    Text
    {
        x: 0
        y: 0
        id: timeLabel
        text: qsTr(czas_string)
        horizontalAlignment: Text.AlignHCenter
        verticalAlignment: Text.AlignVCenter
        width: mainWindow.width
        height: mainWindow.height/2
        font.pointSize: 400
        minimumPointSize: 8
        fontSizeMode: Text.Fit
    }
    Text
    {
        x: 0
        y: mainWindow.height/2
        id: dateLabel
        text: qsTr(data_string)
        horizontalAlignment: Text.AlignHCenter
        verticalAlignment: Text.AlignVCenter
        width: mainWindow.width
        height: mainWindow.height/2
        font.pointSize: 400
        minimumPointSize: 8
        fontSizeMode: Text.Fit
    }
}

1

Większość problemów rozwiązało dodanie funkcji onHeightChanged i onWidthChanged. Poniże cały kod

import QtQuick 2.15
import QtQuick.Window 2.15
import QtQuick.Controls 1.4
//https://doc.qt.io/qt-5/qml-qtqml-date.html
Window
{
    id: mainWindow
    width: 640
    height: 480
    visible: true
    title: qsTr("QML Clock")

    property bool onlyTime: false

    onWidthChanged:
    {
        if (onlyTime == false)
        {
            //Pokazuje czas i date
            timeLabel.width = width
            dateLabel.width = timeLabel.width

            timeLabel.x = 0
            dateLabel.x = 0

            timeLabel.horizontalAlignment = Text.AlignHCenter
            timeLabel.verticalAlignment = Text.AlignVCenter

            dateLabel.horizontalAlignment = Text.AlignHCenter
            dateLabel.verticalAlignment = Text.AlignVCenter
        }
        else
        {
            //Pokazuje tylko czas
            timeLabel.width = width
            dateLabel.width = timeLabel.width
            timeLabel.x = 0
            dateLabel.x = 0

            timeLabel.horizontalAlignment = Text.AlignHCenter
            timeLabel.verticalAlignment = Text.AlignVCenter

            dateLabel.horizontalAlignment = Text.AlignHCenter
            dateLabel.verticalAlignment = Text.AlignVCenter
        }
    }


    onHeightChanged:
    {
        if (onlyTime == false)
        {
            //Pokazuje czas i date
            timeLabel.height = height/2
            dateLabel.height = timeLabel.height

            timeLabel.y = 0
//            dateLabel.y = y/2

            timeLabel.horizontalAlignment = Text.AlignHCenter
            timeLabel.verticalAlignment = Text.AlignVCenter

            dateLabel.horizontalAlignment = Text.AlignHCenter
            dateLabel.verticalAlignment = Text.AlignVCenter
        }
        else
        {
            //Pokazuje tylko czas
            timeLabel.height = height
//            dateLabel.height = timeLabel.height

            timeLabel.y = 0
//            dateLabel.y = y/2

            timeLabel.horizontalAlignment = Text.AlignHCenter
            timeLabel.verticalAlignment = Text.AlignVCenter

//            dateLabel.horizontalAlignment = Text.AlignHCenter
//            dateLabel.verticalAlignment = Text.AlignVCenter

        }


    }

    property string czas_string: "Godzina"
    property string data_string: "Data"

    MouseArea
    {
        anchors.fill: parent
        acceptedButtons: Qt.LeftButton | Qt.RightButton | Qt.MiddleButton

        onClicked:
        {
            if (mouse.button == Qt.RightButton)
            {
                menu.popup()
//                console.log("Prawy")
            }
            else if (mouse.button == Qt.LeftButton)
            {
//                console.log("Lewy")
            }
            else
            {
//                console.log("Inny")
            }
        }

        Menu
        {
            id: menu
            MenuItem
            {
                checkable: true
                checked: true
                text: qsTr("Obramowanie")
                shortcut: "Ctrl+B"
                onTriggered:
                {
                    if (checked == true)
                    {
                        flags = flags & ~Qt.FramelessWindowHint
                        text = "Obramowanie"
                    }
                    else
                    {
                        flags = flags | Qt.FramelessWindowHint
                        text = "Obramowanie"
                    }
                }
            }
            MenuItem
            {
                id: naWierzchu
                checkable: true
                checked: false
                text: "Zawsze na wierzchu"
                shortcut: "Ctrl+T"
                onTriggered:
                {
                    if (checked == true)
                    {
                        flags = flags | Qt.WindowStaysOnTopHint
                        text = "Zawsze na wierzchu"
                    }
                    else
                    {
                        flags = flags & ~Qt.WindowStaysOnTopHint
                        text = "Zawsze na wierzchu"
                    }
                }
            }
            MenuSeparator { }
            MenuItem
            {
                checkable: true
                checked: true
                text: "Data"
//                shortcut: "Ctrl+D"

                onTriggered:
                {
                    if (checked == true)
                    {
                        text = "Data"

                        dateLabel.visible = true
                        timeLabel.width = mainWindow.width
                        timeLabel.height = mainWindow.height/2

                        mainWindow.width = timeLabel.width
                        mainWindow.height = timeLabel.height

                        onlyTime = false
                    }
                    else
                    {
                        text = "Data"

                        dateLabel.visible = false
                        timeLabel.width = mainWindow.width
                        timeLabel.height = mainWindow.height

                        mainWindow.width = timeLabel.width
                        mainWindow.height = timeLabel.height

                        onlyTime = true
                    }
                }
            }
            MenuSeparator { }
            MenuItem
            {
                text: "Zamknij progrm"
                shortcut: "Ctrl+Q"
                onTriggered: Qt.quit()
            }
        }
    }
    function timeChanged()
    {
        var data = new Date;

        czas_string = data.toLocaleString(Qt.locale("pl_PL"), "h:mm:ss");
        data_string = data.toLocaleString(Qt.locale("pl_PL"), "yyyy-MM-dd\ndddd");
    }
    Timer
    {
        interval: 1000; running: true; repeat: true
        onTriggered: mainWindow.timeChanged()
    }

    Text
    {
        x: 0
        y: 0
        id: timeLabel
        text: qsTr(czas_string)
        horizontalAlignment: Text.AlignHCenter
        verticalAlignment: Text.AlignVCenter
        width: mainWindow.width
        height: mainWindow.height/2
        font.pointSize: 400
        minimumPointSize: 8
        fontSizeMode: Text.Fit
//        anchors.centerIn: parent
    }
    Text
    {
        x: 0
        y: mainWindow.height/2
        id: dateLabel
        text: qsTr(data_string)
        horizontalAlignment: Text.AlignHCenter
        verticalAlignment: Text.AlignVCenter
        width: mainWindow.width
        height: mainWindow.height/2
        font.pointSize: 400
        minimumPointSize: 8
        fontSizeMode: Text.Fit
//        anchors.centerIn: parent
    }
}
0

@Paweleczek:
Ty powinieneś doczytać jak się używa QML-a!
Twoje rozwiązanie jest zaprzeczeniem sensu QML
Powinno być coś w tym stylu:

    Text
    {
        id: timeLabel
        text: qsTr("Godzina") // qsTr(czas_string) - to też było źle i psuło internacjonalizację
        horizontalAlignment: Text.AlignHCenter
        verticalAlignment: Text.AlignVCenter
        minimumPointSize: 8
        fontSizeMode: Text.Fit
        anchors.fill: parent // albo coś innego co opisze twoje oczekiwania gdzie i jak wielki ma być ten tekst
    }

Cały sens QML polega na tym, że możesz opisać relację między elementami UI i obliczenia dotyczące pozycji i rozmiaru są robione logiką QML, która jest dla ciebie nieistotnym detalem implementacyjnym.

0

anchors.fill: parent - Jesli dobrze pamietam, to cos podobnego probowalem, to mi sie data i czas nakladaly na siebie.
Co do qsTr(), to robie ten program dla siebie, wiec obsluga jezykow jest dla mnie malo wazna. Ten qsTr byl wrzucony przez qtcreatora, wiec tak przy okazji dodalem zmienna. Widziadłem, ze to nie dziala, ale nie byl to moj priorytet, wiec zostawilem na obecna chwile.

0

Jak wywalilem te funkcje o ktorych pisalem i dodalem do obu obiektow Text, ta linie o ktorej pisales (anchors.fill: parent), to tak jak pisalem, data i czas sie nakladaja na siebie. Jak chcesz, to Ci moge podeslac caly kod i sprobuj naprawic to co ja zrobilem, choc tak naprawde, to ten QML, to jest caly program.

screenshot-20201105175911.png

0

anchors.fill: parent to był tylko przykład, bo nie wiem co dokładnie chcesz uzyskać
Jak już zamieszczać zdjęcie to tego co chcesz uzyskać

Alternatywny przykład https://tinyurl.com/y6359rx6

Generalnie za pomocą anchors masz wyrazić jaka ma być pozycja elementów, wtedy wszystko będzie się pozycjonowało samo bez względu na rozmiar.

0

Chce takie cos uzyskac.
screenshot-20201105183157.png
i takie cos
screenshot-20201105183205.png

Jak juz takie cos mam, to chcialbym, zeby przy zmianie rozmiaru okna, automatycznie sie dopasowal tekst w przypadku czasu i godziny. Czas i data sa to osobne labelki, zeby moc usunac, lub ukryc labelke z data.

Do tego dochodzi jeszcze menu kontekstowe, ale z tym nie mam problemu. Byc moze nie jest to zrobione tak jak powinno byc, ale dziala. Jesli masz jakies sugestie do innych czesci kodu, to takze chetnie wyslucham.

0

Ok, wydaje sie ciekawe. Nie sprawdzilem tego jeszcze, ale jestes pewien, ze czcionka bedzie sie dopasowywac do rozmiaru okna? Ktora linia odpowiada za dopasowanie czcionki do rozmiaru okna?

0

Nie będzie, rozmiar fonta jest wpisany na sztywno (font.pixelSize). Dynamiczna jest tylko pozycja, regulowana przez ColumnLayout.

Żeby mieć dynamiczny rozmiar fonta, należy ustawić odpowiedni fontSizeMode.

0

Wrzucilem ten kod do mojego programu i nadal nie dziala zmiana rozmiaru.
Dorzucilem pozniej te trzy linie do kazdego obiektu Text i nadal nie dziala.

                font.pointSize: 400
                minimumPointSize: 8
                fontSizeMode: Text.Fit
0

Jaki masz textFormat? Jak Ci automatycznie, z jakiegoś powodu, wykrywa RichText, to fontSizeMode zostanie zignorowane (bo koliduje z możliwością ustawiania wielkości fonta w samym tekście).

0

Nie ustawialem zadnego textformat.

1 użytkowników online, w tym zalogowanych: 0, gości: 1