Changeset View
Changeset View
Standalone View
Standalone View
applets/colorpicker/package/contents/ui/main.qml
| Show First 20 Lines • Show All 183 Lines • ▼ Show 20 Line(s) | 176 | PlasmaComponents.ToolButton { | |||
|---|---|---|---|---|---|
| 184 | Rectangle { | 184 | Rectangle { | ||
| 185 | id: colorCircle | 185 | id: colorCircle | ||
| 186 | anchors.centerIn: parent | 186 | anchors.centerIn: parent | ||
| 187 | // try to match the color-picker icon in size | 187 | // try to match the color-picker icon in size | ||
| 188 | width: units.roundToIconSize(pickerIcon.width) * 0.75 | 188 | width: units.roundToIconSize(pickerIcon.width) * 0.75 | ||
| 189 | height: units.roundToIconSize(pickerIcon.height) * 0.75 | 189 | height: units.roundToIconSize(pickerIcon.height) * 0.75 | ||
| 190 | radius: width / 2 | 190 | radius: width / 2 | ||
| 191 | color: root.recentColor | 191 | color: root.recentColor | ||
| 192 | | ||||
| 193 | function luminance(color) { | ||||
| 194 | if (!color) { | ||||
| 195 | return 0; | ||||
| 196 | } | ||||
| 197 | | ||||
| 198 | // formula for luminance according to https://www.w3.org/TR/2008/REC-WCAG20-20081211/#relativeluminancedef | ||||
| 199 | | ||||
| 200 | var a = [color.r, color.g, color.b].map(function (v) { | ||||
| 201 | return (v <= 0.03928) ? v / 12.92 : | ||||
| 202 | Math.pow( ((v + 0.055) / 1.055), 2.4 ); | ||||
| 203 | }); | ||||
| 204 | | ||||
| 205 | return a[0] * 0.2126 + a[1] * 0.7152 + a[2] * 0.0722; | ||||
| 206 | } | ||||
| 207 | | ||||
| 208 | border { | ||||
| 209 | color: theme.textColor | ||||
| 210 | width: { | ||||
| 211 | var contrast = luminance(theme.viewBackgroundColor) / luminance(colorCircle.color) + 0.05; | ||||
| 212 | | ||||
| 213 | // show border only if there's too little contrast to the surrounding view | ||||
| 214 | if (contrast > 3) { | ||||
| 215 | return 0; | ||||
| 216 | } else { | ||||
| 217 | return Math.round(Math.max(units.devicePixelRatio, width / 20)); | ||||
| 218 | } | ||||
| 219 | } | ||||
| 220 | } | ||||
| 192 | } | 221 | } | ||
| 193 | } | 222 | } | ||
| 194 | } | 223 | } | ||
| 195 | } | 224 | } | ||
| 196 | 225 | | |||
| 197 | Plasmoid.fullRepresentation: GridView { | 226 | Plasmoid.fullRepresentation: GridView { | ||
| 198 | id: fullRoot | 227 | id: fullRoot | ||
| 199 | 228 | | |||
| ▲ Show 20 Lines • Show All 119 Lines • Show Last 20 Lines | |||||