MonitorExtruderConfiguration.qml 2.6 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788
  1. // Copyright (c) 2019 Ultimaker B.V.
  2. // Cura is released under the terms of the LGPLv3 or higher.
  3. import QtQuick 2.2
  4. import QtQuick.Controls 2.0
  5. import UM 1.3 as UM
  6. import Cura 1.6 as Cura
  7. /**
  8. * This component comprises a colored extruder icon, the material name, and the
  9. * print core name. It is used by the MonitorPrinterConfiguration component with
  10. * a sibling instance as well as a MonitorBuildplateConfiguration instance.
  11. *
  12. * NOTE: For most labels, a fixed height with vertical alignment is used to make
  13. * layouts more deterministic (like the fixed-size textboxes used in original
  14. * mock-ups). This is also a stand-in for CSS's 'line-height' property. Denoted
  15. * with '// FIXED-LINE-HEIGHT:'.
  16. */
  17. Item
  18. {
  19. // The material color
  20. property alias color: extruderIcon.materialColor
  21. // The extruder position
  22. property int position
  23. // The material name
  24. property alias material: materialLabel.text
  25. // The print core name (referred to as hotendID in Python)
  26. property alias printCore: printCoreLabel.text
  27. // Height is 2 x 18px labels, plus 4px spacing between them
  28. height: 40 * screenScaleFactor // TODO: Theme!
  29. width: childrenRect.width
  30. opacity: material != "" && material != "Empty" && position >= 0 ? 1 : 0.4
  31. Cura.ExtruderIcon
  32. {
  33. id: extruderIcon
  34. materialColor: UM.Theme.getColor("monitor_skeleton_loading")
  35. anchors.verticalCenter: parent.verticalCenter
  36. }
  37. Rectangle
  38. {
  39. id: materialLabelWrapper
  40. anchors
  41. {
  42. left: extruderIcon.right
  43. leftMargin: UM.Theme.getSize("default_margin").width
  44. verticalCenter: extruderIcon.verticalCenter
  45. }
  46. color: materialLabel.visible > 0 ? "transparent" : UM.Theme.getColor("monitor_skeleton_loading")
  47. height: childrenRect.height
  48. width: Math.max(materialLabel.contentWidth, 60 * screenScaleFactor) // TODO: Theme!
  49. radius: 2 * screenScaleFactor // TODO: Theme!
  50. Label
  51. {
  52. id: materialLabel
  53. anchors.top: parent.top
  54. color: UM.Theme.getColor("text")
  55. elide: Text.ElideRight
  56. font: UM.Theme.getFont("default") // 12pt, regular
  57. text: ""
  58. visible: text !== ""
  59. renderType: Text.NativeRendering
  60. }
  61. Label
  62. {
  63. id: printCoreLabel
  64. anchors.top: materialLabel.bottom
  65. color: UM.Theme.getColor("text")
  66. elide: Text.ElideRight
  67. font: UM.Theme.getFont("default_bold") // 12pt, bold
  68. text: ""
  69. visible: text !== ""
  70. renderType: Text.NativeRendering
  71. }
  72. }
  73. }