Changeset View
Changeset View
Standalone View
Standalone View
src/qml/MediaTrackDelegate.qml
| Show First 20 Lines • Show All 259 Lines • ▼ Show 20 Line(s) | 204 | ColumnLayout { | |||
|---|---|---|---|---|---|
| 260 | } | 260 | } | ||
| 261 | } | 261 | } | ||
| 262 | 262 | | |||
| 263 | Loader { | 263 | Loader { | ||
| 264 | id: hoverLoader | 264 | id: hoverLoader | ||
| 265 | active: false | 265 | active: false | ||
| 266 | 266 | | |||
| 267 | Layout.alignment: Qt.AlignVCenter | Qt.AlignRight | 267 | Layout.alignment: Qt.AlignVCenter | Qt.AlignRight | ||
| 268 | Layout.rightMargin: 10 | ||||
| 268 | 269 | | |||
| 269 | z: 1 | 270 | z: 1 | ||
| 270 | opacity: 0 | 271 | opacity: 0 | ||
| 271 | 272 | | |||
| 272 | sourceComponent: Row { | 273 | sourceComponent: Row { | ||
| 273 | anchors.centerIn: parent | 274 | anchors.centerIn: parent | ||
| 274 | 275 | | |||
| 275 | Controls1.ToolButton { | 276 | Controls1.ToolButton { | ||
| ▲ Show 20 Lines • Show All 71 Lines • ▼ Show 20 Line(s) | 347 | PropertyChanges { | |||
| 347 | target: hoverLoader | 348 | target: hoverLoader | ||
| 348 | active: false | 349 | active: false | ||
| 349 | } | 350 | } | ||
| 350 | PropertyChanges { | 351 | PropertyChanges { | ||
| 351 | target: hoverLoader | 352 | target: hoverLoader | ||
| 352 | opacity: 0.0 | 353 | opacity: 0.0 | ||
| 353 | } | 354 | } | ||
| 354 | PropertyChanges { | 355 | PropertyChanges { | ||
| 356 | target: ratingWidget | ||||
| 357 | hoverWidgetOpacity: 0.0 | ||||
| 358 | } | ||||
| 359 | PropertyChanges { | ||||
| 355 | target: rowRoot | 360 | target: rowRoot | ||
| 356 | color: (isAlternateColor ? myPalette.alternateBase : myPalette.base) | 361 | color: (isAlternateColor ? myPalette.alternateBase : myPalette.base) | ||
| 357 | } | 362 | } | ||
| 358 | }, | 363 | }, | ||
| 359 | State { | 364 | State { | ||
| 360 | name: 'hoveredOrSelected' | 365 | name: 'hoveredOrSelected' | ||
| 361 | when: hoverArea.containsMouse || mediaTrack.activeFocus | 366 | when: hoverArea.containsMouse || mediaTrack.activeFocus | ||
| 362 | PropertyChanges { | 367 | PropertyChanges { | ||
| 363 | target: hoverLoader | 368 | target: hoverLoader | ||
| 364 | active: true | 369 | active: true | ||
| 365 | } | 370 | } | ||
| 366 | PropertyChanges { | 371 | PropertyChanges { | ||
| 367 | target: hoverLoader | 372 | target: hoverLoader | ||
| 368 | opacity: 1.0 | 373 | opacity: 1.0 | ||
| 369 | } | 374 | } | ||
| 370 | PropertyChanges { | 375 | PropertyChanges { | ||
| 376 | target: ratingWidget | ||||
| 377 | hoverWidgetOpacity: 1.0 | ||||
| 378 | } | ||||
| 379 | PropertyChanges { | ||||
| 371 | target: rowRoot | 380 | target: rowRoot | ||
| 372 | color: myPalette.mid | 381 | color: myPalette.mid | ||
| 373 | } | 382 | } | ||
| 374 | } | 383 | } | ||
| 375 | ] | 384 | ] | ||
| 376 | 385 | | |||
| 377 | transitions: [ | 386 | transitions: [ | ||
| 378 | Transition { | 387 | Transition { | ||
| 379 | to: 'hoveredOrSelected' | 388 | to: 'hoveredOrSelected' | ||
| 380 | SequentialAnimation { | 389 | SequentialAnimation { | ||
| 381 | PropertyAction { | 390 | PropertyAction { | ||
| 382 | properties: "active" | 391 | properties: "active" | ||
| 383 | } | 392 | } | ||
| 384 | ParallelAnimation { | 393 | ParallelAnimation { | ||
| 385 | NumberAnimation { | 394 | NumberAnimation { | ||
| 386 | properties: "opacity" | 395 | properties: "opacity, hoverWidgetOpacity" | ||
| 387 | easing.type: Easing.InOutQuad | 396 | easing.type: Easing.InOutQuad | ||
| 388 | duration: 250 | 397 | duration: 250 | ||
| 389 | } | 398 | } | ||
| 390 | ColorAnimation { | 399 | ColorAnimation { | ||
| 391 | properties: "color" | 400 | properties: "color" | ||
| 392 | duration: 250 | 401 | duration: 250 | ||
| 393 | } | 402 | } | ||
| 394 | } | 403 | } | ||
| 395 | } | 404 | } | ||
| 396 | }, | 405 | }, | ||
| 397 | Transition { | 406 | Transition { | ||
| 398 | to: 'notSelected' | 407 | to: 'notSelected' | ||
| 399 | SequentialAnimation { | 408 | SequentialAnimation { | ||
| 400 | ParallelAnimation { | 409 | ParallelAnimation { | ||
| 401 | NumberAnimation { | 410 | NumberAnimation { | ||
| 402 | properties: "opacity" | 411 | properties: "opacity, hoverWidgetOpacity" | ||
| 403 | easing.type: Easing.InOutQuad | 412 | easing.type: Easing.InOutQuad | ||
| 404 | duration: 250 | 413 | duration: 250 | ||
| 405 | } | 414 | } | ||
| 406 | ColorAnimation { | 415 | ColorAnimation { | ||
| 407 | properties: "color" | 416 | properties: "color" | ||
| 408 | duration: 250 | 417 | duration: 250 | ||
| 409 | } | 418 | } | ||
| 410 | } | 419 | } | ||
| 411 | PropertyAction { | 420 | PropertyAction { | ||
| 412 | properties: "active" | 421 | properties: "active" | ||
| 413 | } | 422 | } | ||
| 414 | } | 423 | } | ||
| 415 | } | 424 | } | ||
| 416 | ] | 425 | ] | ||
| 417 | } | 426 | } | ||