HueSaturation.qml 5.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187
  1. // Copyright (C) 2020 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 Qt5Compat.GraphicalEffects.private
  6. /*!
  7. \qmltype HueSaturation
  8. \inqmlmodule Qt5Compat.GraphicalEffects
  9. \since QtGraphicalEffects 1.0
  10. \inherits QtQuick2::Item
  11. \ingroup qtgraphicaleffects-color
  12. \brief Alters the source item colors in the HSL color space.
  13. HueSaturation is similar to the \l Colorize effect, but the hue and
  14. saturation property values are handled differently. The HueSaturation effect
  15. always shifts the hue, saturation, and lightness from the original, instead
  16. of setting them.
  17. \table
  18. \header
  19. \li Source
  20. \li Effect applied
  21. \row
  22. \li \image Original_bug.png
  23. \li \image HueSaturation_bug.png
  24. \endtable
  25. \section1 Example
  26. The following example shows how to apply the effect.
  27. \snippet HueSaturation-example.qml example
  28. */
  29. Item {
  30. id: rootItem
  31. /*!
  32. This property defines the source item that provides the source pixels
  33. for the effect.
  34. \note It is not supported to let the effect include itself, for
  35. instance by setting source to the effect's parent.
  36. */
  37. property variant source: 0
  38. /*!
  39. This property defines the hue value which is added to the source hue
  40. value.
  41. The value ranges from -1.0 (decrease) to 1.0 (increase). By default, the
  42. property is set to \c 0.0 (no change).
  43. \table
  44. \header
  45. \li Output examples with different hue values
  46. \li
  47. \li
  48. \row
  49. \li \image HueSaturation_hue1.png
  50. \li \image HueSaturation_hue2.png
  51. \li \image HueSaturation_hue3.png
  52. \row
  53. \li \b { hue: -0.3 }
  54. \li \b { hue: 0.0 }
  55. \li \b { hue: 0.3 }
  56. \row
  57. \li \l saturation: 0
  58. \li \l saturation: 0
  59. \li \l saturation: 0
  60. \row
  61. \li \l lightness: 0
  62. \li \l lightness: 0
  63. \li \l lightness: 0
  64. \endtable
  65. */
  66. property real hue: 0.0
  67. /*!
  68. This property defines the saturation value value which is added to the
  69. source saturation value.
  70. The value ranges from -1.0 (decrease) to 1.0 (increase). By default, the
  71. property is set to \c 0.0 (no change).
  72. \table
  73. \header
  74. \li Output examples with different saturation values
  75. \li
  76. \li
  77. \row
  78. \li \image HueSaturation_saturation1.png
  79. \li \image HueSaturation_saturation2.png
  80. \li \image HueSaturation_saturation3.png
  81. \row
  82. \li \b { saturation: -0.8 }
  83. \li \b { saturation: 0.0 }
  84. \li \b { saturation: 1.0 }
  85. \row
  86. \li \l hue: 0
  87. \li \l hue: 0
  88. \li \l hue: 0
  89. \row
  90. \li \l lightness: 0
  91. \li \l lightness: 0
  92. \li \l lightness: 0
  93. \endtable
  94. */
  95. property real saturation: 0.0
  96. /*!
  97. This property defines the lightness value which is added to the source
  98. saturation value.
  99. The value ranges from -1.0 (decrease) to 1.0 (increase). By default, the
  100. property is set to \c 0.0 (no change).
  101. \table
  102. \header
  103. \li Output examples with different lightness values
  104. \li
  105. \li
  106. \row
  107. \li \image HueSaturation_lightness1.png
  108. \li \image HueSaturation_lightness2.png
  109. \li \image HueSaturation_lightness3.png
  110. \row
  111. \li \b { lightness: -0.5 }
  112. \li \b { lightness: 0.0 }
  113. \li \b { lightness: 0.5 }
  114. \row
  115. \li \l hue: 0
  116. \li \l hue: 0
  117. \li \l hue: 0
  118. \row
  119. \li \l saturation: 0
  120. \li \l saturation: 0
  121. \li \l saturation: 0
  122. \endtable
  123. */
  124. property real lightness: 0.0
  125. /*!
  126. This property allows the effect output pixels to be cached in order to
  127. improve the rendering performance.
  128. Every time the source or effect properties are changed, the pixels in
  129. the cache must be updated. Memory consumption is increased, because an
  130. extra buffer of memory is required for storing the effect output.
  131. It is recommended to disable the cache when the source or the effect
  132. properties are animated.
  133. By default, the property is set to \c false.
  134. */
  135. property bool cached: false
  136. SourceProxy {
  137. id: sourceProxy
  138. input: rootItem.source
  139. interpolation: input && input.smooth ? SourceProxy.LinearInterpolation : SourceProxy.NearestInterpolation
  140. }
  141. ShaderEffectSource {
  142. id: cacheItem
  143. anchors.fill: parent
  144. visible: rootItem.cached
  145. smooth: true
  146. sourceItem: shaderItem
  147. live: true
  148. hideSource: visible
  149. }
  150. ShaderEffect {
  151. id: shaderItem
  152. property variant source: sourceProxy.output
  153. property variant hsl: Qt.vector3d(rootItem.hue, rootItem.saturation, rootItem.lightness)
  154. anchors.fill: parent
  155. fragmentShader: "qrc:/qt-project.org/imports/Qt5Compat/GraphicalEffects/shaders_ng/huesaturation.frag.qsb"
  156. }
  157. }