Tegu foliojn

Kirigami.OverlaySheet estas simpla komponanto, kiun vi povas uzi por kompletigi la enhavon montratan sur la paĝo de aplikaĵo. Ili estas dizajnitaj por montri longan, vertikalan enhavon kaj povas akomodi enhavon pli longe ol la aplika fenestro mem.

Ili povas esti forĵetitaj klakante aŭ frapetante ekster sia areo aŭ klakante la 'x' piktogramon sur la kaplinioj de folioj.

Lernado pri la folio

Por uzi tegmentan folion, ni devus krei ĝin ene de la Kirigami Paĝo, en kiu ni volas, ke ĝi aperu.

import QtQuick 2.15
import QtQuick.Controls 2.15 as Controls
import QtQuick.Layouts 1.15
import org.kde.kirigami 2.20 as Kirigami

Kirigami.Page {
    id: page
    Layout.fillWidth: true

    Kirigami.OverlaySheet {
        id: mySheet
        Controls.Label {
            Layout.fillWidth: true
            wrapMode: Text.WordWrap
            text: "Weeeeee, overlay sheet!"
        }
    }
}

Supermetitaj folioj venas kun metodoj, kiujn ni povas uzi por malfermi() aŭ fermi() ilin kiel ni vidas. taŭga. Defaŭlte tegmentaj folioj estas kaŝitaj, do almenaŭ ni devos uzi la metodon open().

Controls.Button {
    text: "Open mySheet"
    onClicked: mySheet.open()
}

Kiam estas malfermita, ĉi tiu tegmentofolio aperos centrita vertikale kaj horizontale ene de sia gepaĝo. Horizontale ĝi estos limigita de sia gepatro eĉ se la larĝo de ĝia enhavo superas tiun de sia gepatro. Se la vertikala longo de la folio superas tiun de sia patro, tiam la folio estos montrata ekde sia supra pozicio, kaj estos rulebla.

Ĉiea folio

Se vi volas montri la folion kiel ĉiean folion—tiu kiu etendiĝas tra la tuta larĝo de la aplikaĵo, sendepende de la paĝo al kiu ĝi estas infano—ni devas kopii nian tegmentfolion al la tegaĵo de nia aplika fenestro. Ni povas fari tion per la parent propreco.

Kirigami.OverlaySheet {
    id: mySheet

    parent: applicationWindow().overlay

    Controls.Label {
        Layout.fillWidth: true
        wrapMode: Text.WordWrap
        text: "Weeeeee, overlay sheet!"
    }
}

Fiksa grandeco

Folio estas avida kaj prenos la maksimuman kvanton de disponebla larĝo en paĝo se necese. Ni povas eviti ĉi tion specifante implicitWidth aŭ [Layout.preferredWidth](https://doc .qt.io/qt-6/qml-qtquick-layouts-layout.html#preferredWidth-attached-prop) por ĝiaj infanaj elementoj, kiuj limigos kiom la folio kreskos larĝe.

Kirigami.OverlaySheet {
    id: mySheet
    Controls.Label {
        Layout.preferredWidth: Kirigami.Units.gridUnit * 25
        wrapMode: Text.WordWrap
        text: "Weeeeee, overlay sheet! I'm so excited!! WEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEE WEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEE WEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEE WEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEE WEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEE!!!!!"
    }
}

Kapoj kaj piedlinioj

Supermetitaj folioj venas defaŭlte kun kapo kiu enhavas nur butonon por fermi nian superkovritan foliojn. Ni povas aldoni Kirigami.Heading kiel titolon en nia header por faciligi al uzantoj kompreni por kio estas la folio. . Ĉi tio estas farita per agordo header por enhavi nian titolon.

Kirigami.OverlaySheet {
    id: mySheet

    header: Kirigami.Heading {
        text: "My Overlay Sheet"
    }

    Controls.Label {
        Layout.fillWidth: true
        wrapMode: Text.WordWrap
        text: "Weeeeee, overlay sheet!"
    }
}

Ni ankaŭ povas provizi nian superkovritan folion per piedpiedaĵo . Piedoj en supermetitaj folioj estas sufiĉe flekseblaj, sed plej ofte ili estas uzataj por provizi superkovrajn foliojn per ia rapida interaga enigo simila al tio provizita de modalaj dialogoj (ekz. butonoj por "Apliki", "Ok", " Nuligi", "Fermi", ktp.)

Piedoj estas agordita en la sama maniero kiel kaplinioj:

Kirigami.OverlaySheet {
    id: mySheet

    header: Kirigami.Heading {
        text: "My Overlay Sheet"
    }

    footer: Controls.DialogButtonBox {
        standardButtons: DialogButtonBox.Close
        onRejected: mySheet.close()
    }

    Controls.Label {
        Layout.fillWidth: true
        wrapMode: Text.WordWrap
        text: "Weeeeee, overlay sheet!"
    }
}

Uzante delegitajn/modelajn vidojn

Ĉar tegmentaj folioj estas dizajnitaj por montri vertikalan enhavon, ili povas esti speciale utilaj kiam ili estas uzataj kune kun komponantoj kiel ListViews . Kiam oni montras enhavon pli longan ol la aplikaĵa fenestro mem, la supermetita folio fariĝas rulebla:

Kirigami.OverlaySheet {
    id: mySheet

    ListView {
        model: 100
        implicitWidth: Kirigami.Units.gridUnit * 30
        delegate: Kirigami.BasicListItem {
            label: "Item in sheet " + modelData
        }
    }
}