Changeset View
Changeset View
Standalone View
Standalone View
src/qmlcontrols/kcmcontrols/qml/GridDelegate.qml
| Show First 20 Lines • Show All 110 Lines • ▼ Show 20 Line(s) | 66 | Rectangle { | |||
|---|---|---|---|---|---|
| 111 | 111 | | |||
| 112 | Rectangle { | 112 | Rectangle { | ||
| 113 | anchors.fill: thumbnailArea | 113 | anchors.fill: thumbnailArea | ||
| 114 | visible: actionsRow.children.length > 0 | 114 | visible: actionsRow.children.length > 0 | ||
| 115 | opacity: Kirigami.Settings.isMobile || delegate.hovered || (actionsScope.focus) ? 1 : 0 | 115 | opacity: Kirigami.Settings.isMobile || delegate.hovered || (actionsScope.focus) ? 1 : 0 | ||
| 116 | radius: Kirigami.Units.smallSpacing | 116 | radius: Kirigami.Units.smallSpacing | ||
| 117 | color: Kirigami.Settings.isMobile ? "transparent" : Qt.rgba(1, 1, 1, 0.2) | 117 | color: Kirigami.Settings.isMobile ? "transparent" : Qt.rgba(1, 1, 1, 0.2) | ||
| 118 | 118 | | |||
| 119 | Kirigami.Theme.inherit: false | | |||
| 120 | Kirigami.Theme.colorSet: Kirigami.Theme.Complementary | | |||
| 121 | | ||||
| 122 | Behavior on opacity { | 119 | Behavior on opacity { | ||
| 123 | PropertyAnimation { | 120 | PropertyAnimation { | ||
| 124 | duration: Kirigami.Units.longDuration | 121 | duration: Kirigami.Units.longDuration | ||
| 125 | easing.type: Easing.OutQuad | 122 | easing.type: Easing.OutQuad | ||
| 126 | } | 123 | } | ||
| 127 | } | 124 | } | ||
| 128 | 125 | | |||
| 129 | Rectangle { | | |||
| 130 | visible: actionsRow.children.length > 1 | | |||
| 131 | anchors { | | |||
| 132 | left: parent.left | | |||
| 133 | top: actionsScope.top | | |||
| 134 | right: parent.right | | |||
| 135 | bottom: parent.bottom | | |||
| 136 | } | | |||
| 137 | gradient: Gradient { | | |||
| 138 | GradientStop { position: 0.0; color: "transparent" } | | |||
| 139 | GradientStop { position: 1.0; color: Qt.rgba(0, 0, 0, 0.4) } | | |||
| 140 | } | | |||
| 141 | } | | |||
| 142 | FocusScope { | 126 | FocusScope { | ||
| 143 | id: actionsScope | 127 | id: actionsScope | ||
| 128 | | ||||
| 144 | anchors { | 129 | anchors { | ||
| 145 | right: parent.right | 130 | right: parent.right | ||
| 131 | rightMargin: Kirigami.Units.smallSpacing | ||||
| 146 | bottom: parent.bottom | 132 | bottom: parent.bottom | ||
| 133 | bottomMargin: Kirigami.Units.smallSpacing | ||||
| 147 | } | 134 | } | ||
| 148 | width: actionsRow.width | 135 | width: actionsRow.width | ||
| 149 | height: actionsRow.height | 136 | height: actionsRow.height | ||
| 137 | | ||||
| 150 | RowLayout { | 138 | RowLayout { | ||
| 151 | id: actionsRow | 139 | id: actionsRow | ||
| 152 | 140 | | |||
| 153 | Repeater { | 141 | Repeater { | ||
| 154 | model: delegate.actions | 142 | model: delegate.actions | ||
| 155 | delegate: Controls.ToolButton { | 143 | delegate: Controls.Button { | ||
| 156 | Kirigami.Icon { | 144 | icon.name: modelData.iconName | ||
| 157 | Kirigami.Theme.inherit: false | | |||
| 158 | Kirigami.Theme.colorSet: Kirigami.Theme.Complementary | | |||
| 159 | anchors.centerIn: parent | | |||
| 160 | width: Kirigami.Units.iconSizes.smallMedium | | |||
| 161 | height: width | | |||
| 162 | source: modelData.iconName | | |||
| 163 | } | | |||
| 164 | activeFocusOnTab: focus || delegate.focus | 145 | activeFocusOnTab: focus || delegate.focus | ||
| 165 | onClicked: modelData.trigger() | 146 | onClicked: { | ||
| 147 | delegate.clicked() | ||||
leinir: Just came across having both a function called on clicking the thumbnail (using the onClicked… | |||||
This was a deliberate choice, to make sure that the delegate got selected when one of its buttons got clicked. But yeah selected may not necessarily require clicked, so maybe it wasn't the best way of doing it. If you can think of a better way to ensure that, then by all means, please don't hesitate to send a patch! ngraham: This was a deliberate choice, to make sure that the delegate got selected when one of its… | |||||
Right! That makes sense, yes - i'll try and work out if we can't get that done with a few less side effects :) leinir: Right! That makes sense, yes - i'll try and work out if we can't get that done with a few less… | |||||
| 148 | modelData.trigger() | ||||
| 149 | } | ||||
| 166 | enabled: modelData.enabled | 150 | enabled: modelData.enabled | ||
| 167 | visible: modelData.visible | 151 | visible: modelData.visible | ||
| 168 | //NOTE: there aren't any global settings where to take "official" tooltip timeouts | 152 | //NOTE: there aren't any global settings where to take "official" tooltip timeouts | ||
| 169 | Controls.ToolTip.delay: 1000 | 153 | Controls.ToolTip.delay: 1000 | ||
| 170 | Controls.ToolTip.timeout: 5000 | 154 | Controls.ToolTip.timeout: 5000 | ||
| 171 | Controls.ToolTip.visible: (Kirigami.Settings.isMobile ? pressed : hovered) && modelData.tooltip.length > 0 | 155 | Controls.ToolTip.visible: (Kirigami.Settings.isMobile ? pressed : hovered) && modelData.tooltip.length > 0 | ||
| 172 | Controls.ToolTip.text: modelData.tooltip | 156 | Controls.ToolTip.text: modelData.tooltip | ||
| 173 | } | 157 | } | ||
| Show All 32 Lines | |||||
Just came across having both a function called on clicking the thumbnail (using the onClicked handler) and on actions being triggered, and both now get triggered at the same time. Was this a deliberate choice? I can of course work around it by not using the onClicked handler and just putting a click handler into the thumbnail delegate, but it seems like this is the sort of thing the GridDelegate is supposed to avoid :) (for my purposes: clicking the thumbnail opens a page with detailed information about the item represented by the thumbnail, and clicking the action causes things to be done to the item without opening that page).