How to remove shadow from comboBox in QML?

Question

Programming

Good day :)
I'm trying to customize comboBox. A question. Is it possible to remove the shadow from behind in the styles or in the comboBox settings themselves, otherwise it looks very terrible within my interface.
Thanks in advance.

ComboBox {
  id: box
  
  property color backgroundColor : "white"
  property color accentColor : "green"
  
  currentIndex: 2
  activeFocusOnPress: true
  style: ComboBoxStyle {
    id: comboBox
    background: Rectangle{
      id: rectCategory
      border.width: 1
      border.color: accentColor
      color: backgroundColor
      
      Canvas {
        id: arrow
        width: parent.height
        height: parent.height
        antialiasing: true
        
        anchors.right: parent.right
        
        property color strokeStyle: accentColor
        property color fillStyle: control.hovered ? accentColor : backgroundColor
        property int lineWidth: 1
        property bool fill: false
        property bool stroke: true
        
        onFillStyleChanged: requestPaint();
        onStrokeStyleChanged: requestPaint();
        
        onPaint: {
          var ctx = arrow.getContext('2d');
          var originX = 0
          var originY = 0
          ctx.save();
          ctx.clearRect(0, 0, arrow.width, arrow.height);
          ctx.translate(originX, originX);
          ctx.globalAlpha = arrow.alpha;
          ctx.strokeStyle = arrow.strokeStyle;
          ctx.fillStyle = arrow.fillStyle;
          ctx.lineWidth = arrow.lineWidth;
          
          ctx.beginPath();
          
          ctx.moveTo(arrow.width/4,arrow.height/4);
          ctx.lineTo(3*arrow.width/4,arrow.height/4);
          ctx.lineTo(2*arrow.width/4,3*arrow.height/4);
          ctx.lineTo(arrow.width/4,arrow.height/4);
          
          ctx.closePath();
          
          ctx.fill();
          ctx.stroke();
          ctx.restore();
        }
        Behavior on fillStyle
        {
          ColorAnimation {
            duration: 250
            easing.type: Easing.InOutQuad
          }
        }
      }
      
    }
    label: Text {
      verticalAlignment: Text.AlignVCenter
      horizontalAlignment: Text.AlignHCenter
      font.pointSize: 15
      font.family: "Courier"
      font.capitalization: Font.SmallCaps
      color: accentColor
      text: control.currentText
    }
    
    // drop-down customization here
    property Component __dropDownStyle: MenuStyle {
      
      __maxPopupHeight: 200
      __menuItemType: "comboboxitem"
      __backgroundColor: "transparent"
      
      frame:
        Rectangle {              // background
        anchors.fill: parent
        border.color: accentColor
        border.width: 1
        anchors.rightMargin: 2
      }
      
      itemDelegate.label: Text {
        
        font.pointSize: 15
        font.family: "Courier"
        verticalAlignment: Text.AlignVCenter
        horizontalAlignment: Text.AlignHCenter
        font.capitalization: Font.SmallCaps
        color: styleData.selected ? backgroundColor : accentColor
        Behavior on color
        {
          ColorAnimation {
            duration: 250
            easing.type: Easing.InOutQuad
          }
        }
        text: styleData.text
      }
      
      itemDelegate.background: Item{
        Rectangle {  // selection of an item
          id: backItem
          anchors.fill: parent
          anchors.rightMargin: 2
          color: styleData.selected ? accentColor : "transparent"
          Behavior on color
          {
            ColorAnimation {
              duration: 250
              easing.type: Easing.InOutQuad
            }
          }				
        }
      }
      __scrollerStyle: ScrollViewStyle {  }
    }
    
    property Component __scrollerStyle: ScrollViewStyle { }
  }
  
  model: ListModel {
    id: cbItems
    ListElement { text: "Banana" }
    ListElement { text: "Apple" }
    ListElement { text: "Coconut" }
    ListElement { text: "Coconut" }
    ListElement { text: "Coconut" }
  }
  width: 200
}

Answer 1

I didn’t deal with shadows, but DropShadow is responsible for casting them