QML DropDown Border Issue (Qt-5.3.2)
-
Hello all,
We are developing an application on IMX6 using Qt 5.3.2. The Qt libraries are provided by Yocto.
Our requirement is to list items inside a drop down menu using a particular background style. For this purpose we are using ComboBox provided by Qt Quick Controls and QtQuick.Controls.Styles for customizing the drop down background style. We are using MenuStyle component to customize the drop down.
When we apply the styles, we observed that the drop down bottom border does not close.
Please use the following link to view the picture.
We are not facing this issue in the Desktop. We tried running the same application on Ubuntu 12.04.
https://www.dropbox.com/s/33a57jaxs452c4r/IMX6.JPG?dl=0
https://www.dropbox.com/s/cmvvf3ytxg615q8/Ubuntu.JPG?dl=0
Also, below I've listed the qml code which we used for Customizing the drop down.
@
ComboBox { // CustomComboBox
id: comboFilterBy
x: 10
y: 130
z:1
width: 285
height: 39
model : eventFiltersListRectangle { id: arrow anchors.right: parent.right width: 20; height: parent.height border.color: "black" border.width: 1 Image { id: arrowIcon // anchors.fill: parent width: 10 height: arrow.height anchors.centerIn: parent clip: true smooth: true fillMode: Image.PreserveAspectFit source: "images/dropDownArrow.png" } } style: ComboBoxStyle { background: Rectangle { color: "#FFFFFF" border.width: 1 border.color: "black" antialiasing: true } label: Text { verticalAlignment: Text.AlignVCenter horizontalAlignment: Text.left font.pointSize: 19 font.family: "WenQuanYi Micro Hei Mono" color: "black" text: control.currentText } // drop-down customization here property Component __dropDownStyle: MenuStyle { __maxPopupHeight: 240 __menuItemType: "comboboxitem" padding.bottom : getPaddingLength(1) frame: Rectangle { // background color: "#fff" border.width: 1 } itemDelegate.label: // an item text Text { verticalAlignment: Text.AlignVCenter horizontalAlignment: Text.AlignHCenter font.pointSize: 19 font.family: "WenQuanYi Micro Hei Mono" color: "black" text: styleData.text } itemDelegate.background: Rectangle { // selection of an item color: styleData.selected ? "#5692c4" : "transparent" } __scrollerStyle: ScrollViewStyle { } } }
@
Any help is greatly appreciated.
--Narayanan K