DelayButton.qml 2.8 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485
  1. // Copyright (C) 2017 The Qt Company Ltd.
  2. // SPDX-License-Identifier: LicenseRef-Qt-Commercial OR LGPL-3.0-only OR GPL-2.0-only OR GPL-3.0-only
  3. // Qt-Security score:significant reason:default
  4. import QtQuick
  5. import QtQuick.Templates as T
  6. import QtQuick.Controls.impl
  7. import QtQuick.Controls.Material
  8. import QtQuick.Controls.Material.impl
  9. T.DelayButton {
  10. id: control
  11. implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset,
  12. implicitContentWidth + leftPadding + rightPadding)
  13. implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset,
  14. implicitContentHeight + topPadding + bottomPadding)
  15. topInset: 6
  16. bottomInset: 6
  17. padding: 12
  18. horizontalPadding: padding - 4
  19. Material.elevation: control.down ? 8 : 2
  20. transition: Transition {
  21. NumberAnimation {
  22. duration: control.delay * (control.pressed ? 1.0 - control.progress : 0.3 * control.progress)
  23. }
  24. }
  25. contentItem: Text {
  26. text: control.text
  27. font: control.font
  28. color: !control.enabled ? control.Material.hintTextColor : control.Material.foreground
  29. horizontalAlignment: Text.AlignHCenter
  30. verticalAlignment: Text.AlignVCenter
  31. elide: Text.ElideRight
  32. }
  33. // TODO: Add a proper ripple/ink effect for mouse/touch input and focus state
  34. background: Rectangle {
  35. implicitWidth: 64
  36. implicitHeight: control.Material.buttonHeight
  37. radius: 2
  38. color: control.Material.buttonColor(control.Material.theme, control.Material.background,
  39. control.Material.accent, control.enabled, false /*flat*/, false /*highlighted*/, false /*checked*/)
  40. PaddedRectangle {
  41. y: parent.height - 4
  42. width: parent.width
  43. height: 4
  44. radius: 2
  45. topPadding: -2
  46. clip: true
  47. color: control.checked && control.enabled ? control.Material.accentColor : control.Material.secondaryTextColor
  48. PaddedRectangle {
  49. width: parent.width * control.progress
  50. height: 4
  51. radius: 2
  52. topPadding: -2
  53. rightPadding: Math.max(-2, width - parent.width)
  54. clip: true
  55. color: control.Material.accentColor
  56. }
  57. }
  58. layer.enabled: control.enabled && color.a > 0 && !control.flat
  59. layer.effect: ElevationEffect {
  60. elevation: control.Material.elevation
  61. }
  62. Ripple {
  63. clipRadius: 2
  64. width: parent.width
  65. height: parent.height
  66. pressed: control.pressed
  67. anchor: control
  68. active: enabled && (control.down || control.visualFocus || control.hovered)
  69. color: control.Material.rippleColor
  70. }
  71. }
  72. }