Warning, /frameworks/kirigami/examples/imagecolorstest.qml is written in an unsupported language. File is not indexed.

0001 import QtQuick
0002 import QtQuick.Layouts
0003 import QtQuick.Controls as Controls
0004 import org.kde.kirigami as Kirigami
0005 
0006 RowLayout {
0007     id: root
0008 
0009     width: 500
0010     height: 500
0011 
0012     property var icons: ["desktop", "firefox", "vlc", "blender", "applications-games", "blinken", "adjustlevels", "adjustrgb", "cuttlefish", "folder-games", "applications-network", "multimedia-player", "applications-utilities", "accessories-dictionary", "calligraflow", "calligrakrita", "view-left-close","calligraauthor"]
0013     property int i
0014 
0015     Kirigami.ImageColors {
0016         id: palette
0017         source: icon.source
0018     }
0019     Kirigami.ImageColors {
0020         id: imgPalette
0021         source: image
0022     }
0023 
0024     ColumnLayout {
0025         Rectangle {
0026             Layout.preferredWidth: 200
0027             Layout.preferredHeight: 200
0028             z: -1
0029             color: palette.dominantContrast
0030             Kirigami.Icon {
0031                 id: icon
0032                 anchors.centerIn: parent
0033                 width: 128
0034                 height: 128
0035                 source: "desktop"
0036             }
0037         }
0038         Rectangle {
0039             Layout.preferredWidth: 30
0040             Layout.preferredHeight: 30
0041             color: palette.average
0042         }
0043         Controls.Button {
0044             text: "Next"
0045             onClicked: {
0046                 i = (i + 1) % icons.length
0047                 icon.source = icons[i]
0048                // palette.update()
0049             }
0050         }
0051 
0052         Repeater {
0053             model: palette.palette
0054             delegate: RowLayout {
0055                 Layout.fillWidth: true
0056                 Rectangle {
0057                     implicitWidth: 10 + 300 * modelData.ratio
0058                     implicitHeight: 30
0059                     color: modelData.color
0060                 }
0061                 Item {
0062                     Layout.fillWidth: true
0063                 }
0064                 Rectangle {
0065                     color: modelData.contrastColor
0066                     implicitWidth: 30
0067                     implicitHeight: 30
0068                 }
0069             }
0070         }
0071     }
0072     Item {
0073         Layout.preferredWidth: 500
0074         Layout.preferredHeight: 500 / (image.sourceSize.width / image.sourceSize.height)
0075         Image {
0076             id: image
0077             source: "https://source.unsplash.com/random"
0078             anchors.fill: parent
0079             onStatusChanged: imgPalette.update()
0080         }
0081         ColumnLayout {
0082             Controls.Button {
0083                 text: "Update"
0084                 onClicked: {
0085                     image.source = "https://source.unsplash.com/random#" + (new Date()).getMilliseconds()
0086                 }
0087             }
0088             Repeater {
0089                 model: imgPalette.palette
0090                 delegate: RowLayout {
0091                     Layout.fillWidth: true
0092                     Rectangle {
0093                         implicitWidth: 10 + 300 * modelData.ratio
0094                         implicitHeight: 30
0095                         color: modelData.color
0096                     }
0097                     Item {
0098                         Layout.fillWidth: true
0099                     }
0100                     Rectangle {
0101                         color: modelData.contrastColor
0102                         implicitWidth: 30
0103                         implicitHeight: 30
0104                     }
0105                 }
0106             }
0107         }
0108         Item {
0109             width: 300
0110             height: 150
0111             Kirigami.Theme.backgroundColor: imgPalette.background
0112             Kirigami.Theme.textColor: imgPalette.foreground
0113             Kirigami.Theme.highlightColor: imgPalette.highlight
0114 
0115             anchors {
0116                 bottom: parent.bottom
0117                 right: parent.right
0118             }
0119 
0120             Rectangle {
0121                 anchors.fill: parent
0122                 opacity: 0.8
0123                 color: Kirigami.Theme.backgroundColor
0124             }
0125             ColumnLayout {
0126                 anchors.centerIn: parent
0127                 RowLayout {
0128                     Rectangle {
0129                         Layout.alignment: Qt.AlignCenter
0130                         implicitWidth: 10
0131                         implicitHeight: 10
0132                         color: Kirigami.Theme.highlightColor
0133                     }
0134                     Controls.Label {
0135                         text: "Lorem Ipsum dolor sit amet"
0136                         color: Kirigami.Theme.textColor
0137                     }
0138                 }
0139                 RowLayout {
0140                     Controls.TextField {
0141                         Kirigami.Theme.inherit: true
0142                         text: "text"
0143                     }
0144                     Controls.Button {
0145                         Kirigami.Theme.inherit: true
0146                         text: "Ok"
0147                     }
0148                 }
0149             }
0150         }
0151     }
0152 }