SearchField.qml 5.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137
  1. // Copyright (C) 2025 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. pragma ComponentBehavior: Bound
  5. import QtQuick
  6. import QtQuick.Window
  7. import QtQuick.Controls.impl
  8. import QtQuick.Templates as T
  9. import QtQuick.Controls.Material
  10. import QtQuick.Controls.Material.impl
  11. T.SearchField {
  12. id: control
  13. implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset,
  14. implicitContentWidth + leftPadding + rightPadding)
  15. implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset,
  16. implicitContentHeight + topPadding + bottomPadding,
  17. searchIndicator.implicitIndicatorHeight + topPadding + bottomPadding,
  18. clearIndicator.implicitIndicatorHeight + topPadding + bottomPadding)
  19. leftPadding: padding + (control.mirrored || !searchIndicator.indicator || !searchIndicator.indicator.visible ? 0 : searchIndicator.indicator.width + spacing)
  20. rightPadding: padding + (control.mirrored || !clearIndicator.indicator || !clearIndicator.indicator.visible ? 0 : clearIndicator.indicator.width + spacing)
  21. delegate: MenuItem {
  22. width: ListView.view.width
  23. text: model[control.textRole]
  24. font.weight: control.currentIndex === index ? Font.DemiBold : Font.Normal
  25. highlighted: control.highlightedIndex === index
  26. hoverEnabled: control.hoverEnabled
  27. Material.foreground: control.currentIndex === index ? ListView.view.contentItem.Material.accent : ListView.view.contentItem.Material.foreground
  28. required property var model
  29. required property int index
  30. }
  31. searchIndicator.indicator: Item {
  32. x: !control.mirrored ? 10 : control.width - width - 10
  33. y: control.topPadding
  34. height: control.availableHeight
  35. width: height / 2
  36. ColorImage {
  37. x: (parent.width - width) / 2
  38. y: (parent.height - height) / 2
  39. source: "qrc:/qt-project.org/imports/QtQuick/Controls/Material/images/search-magnifier.png"
  40. color: control.enabled ? control.Material.foreground : control.Material.hintTextColor
  41. }
  42. }
  43. clearIndicator.indicator: Item {
  44. x: control.mirrored ? 10 : control.width - width - 10
  45. y: control.topPadding
  46. height: control.availableHeight
  47. width: height / 2
  48. visible: control.text.length > 0
  49. ColorImage {
  50. x: (parent.width - width) / 2
  51. y: (parent.height - height) / 2
  52. source: "qrc:/qt-project.org/imports/QtQuick/Controls/Material/images/close_circle.png"
  53. color: control.enabled ? control.Material.foreground : control.Material.hintTextColor
  54. }
  55. }
  56. contentItem: T.TextField {
  57. // implicitWidth: Math.max(contentWidth, placeholder.implicitWidth) + leftPadding + rightPadding
  58. implicitHeight: contentHeight + topPadding + bottomPadding
  59. leftPadding: Material.textFieldHorizontalPadding
  60. rightPadding: Material.textFieldHorizontalPadding
  61. topPadding: Material.textFieldVerticalPadding
  62. bottomPadding: Material.textFieldVerticalPadding
  63. // If we're clipped, set topInset to half the height of the placeholder text to avoid it being clipped.
  64. topInset: clip ? placeholder.height / 2 : 0
  65. text: control.text
  66. color: control.enabled ? control.Material.foreground : control.Material.hintTextColor
  67. selectionColor: control.Material.accentColor
  68. selectedTextColor: control.Material.primaryHighlightedTextColor
  69. verticalAlignment: Text.AlignVCenter
  70. ContextMenu.menu: TextEditingContextMenu {
  71. editor: parent
  72. }
  73. cursorDelegate: CursorDelegate { }
  74. }
  75. background: MaterialTextContainer {
  76. implicitWidth: 160
  77. implicitHeight: control.Material.textFieldHeight
  78. outlineColor: (enabled && control.hovered) ? control.Material.primaryTextColor : control.Material.hintTextColor
  79. focusedOutlineColor: control.Material.accentColor
  80. controlHasActiveFocus: control.activeFocus
  81. controlHasText: true
  82. horizontalPadding: control.Material.textFieldHorizontalPadding
  83. }
  84. popup: T.Popup {
  85. y: control.height
  86. width: control.width
  87. height: contentItem.implicitHeight > 0 ? Math.min(contentItem.implicitHeight + verticalPadding * 2, control.Window.height - control.y - control.height - control.padding) : 0
  88. topMargin: 10
  89. bottomMargin: 10
  90. verticalPadding: 10
  91. contentItem: ListView {
  92. clip: true
  93. implicitHeight: contentHeight
  94. model: control.delegateModel
  95. currentIndex: control.highlightedIndex
  96. highlightMoveDuration: 0
  97. T.ScrollIndicator.vertical: ScrollIndicator { }
  98. }
  99. background: Rectangle {
  100. radius: 5
  101. color: control.Material.dialogColor
  102. layer.enabled: control.enabled > 0
  103. layer.effect: RoundedElevationEffect {
  104. elevation: 4
  105. roundedScale: Material.ExtraSmallScale
  106. }
  107. }
  108. }
  109. }