Interference between two ComboBox widgets on Android



  • I have two ComboBox QtQuick widgets in a pane. Whenever I click on any of the two, it's always the previously selected one that drops. That bug only occurs on Android. On Windows and iOS, it's the one you are clicking on that drops. Any idea about why there is interference between these two ComboBox widgets?

    When I click on ComboBox A, then on ComboxBox B, it's the
    content of the B that drops under the A. So it is only the position of the dropdown that is wrong. The contents is right.

    Here is the actual code. (see below)

    There might be some interference between two instances of the same component. Probably that the ID of some of their inner widgets are the same? Name clash? Visually inspecting the code in details doesn't highlight any obvious name clash, though.

    I made a minimal prototype and tested it on Windows and Android, and it doesn't reproduce the bug. That means that there must be something wrong in the codebase I inherited. Any suggestions?

    // this is really the code used to display two combobox widgets.
    // I removed the code that is more specific and unrelated
    // But this snippet will not compile as is
    
        /* ... */
    
        ComboBox {
            id: wifisDetectedComboBox;
            objectName: "wifisDetectedComboBox";
    
            model: ListModel {
                id: wifiItems;
                objectName: "wifiItems";
            }
    
            height: defaultItemHeight;
            width: gui.ratioWidthToDevice(40);
            anchors.right: parent.right;
            anchors.rightMargin: rightMarginSize;
            anchors.top: wifiNetworksDetectedLabel.top;
            anchors.bottom: wifiNetworksDetectedLabel.bottom;
            activeFocusOnPress: true;
    
            // We make this ComboBox dark and without too much decorations
            // We also make sure to at least use a font that is also found in other
            // parts of the GUI. (though it doesn't quite look consistent with this
            // part, specifically)
            // Fix for Android.
            style: ComboBoxStyle {
                textColor: "#000";
                selectedTextColor: "#333";
                font.family: walkwayUltraBoldFont.name;
                font.pixelSize: gui.pxToDevice(15);
            }
    
            onActiveFocusChanged: {
                // Close the dropdown menu of the combo box when the pane changed.
                if ((gui.isAppleTablet) && ! activeFocus && pressed) {
                    __popup.show();
                }
            }
    
            onPressedChanged: {
                if (wifiItems.count !== 0) {
                    if (pressed) {
                        d.wifiListUpdateEnabled = false;
                    } else {
                        d.wifiListUpdateEnabled = true;
                    }
                }
            }
    
            onModelChanged: {
                if (enabled && visible && wifiItems.count === 0 && ! _isManualStep) {
                    // start animation and disable button
                    setAnimationEnabled(true);
                }
                else {
                    // stop animation and enable button
                    setAnimationEnabled(false);
                }
            }
        }
    
    	/* ... */
    
                ComboBox {
                    id: networkInterfacesComboBox;
                    objectName: "networkInterfacesComboBox";
                    width: gui.ratioWidthToDevice(28); //the other is 35
    
                    model: ListModel {
                        id: interfacesItems;
                        objectName: "interfacesItems";
                        property int interfaceCount: 0;
                    } // model
    
                    opacity: dboxOpacityFull;
                    activeFocusOnPress: true;
    
                    anchors.leftMargin: marginSize;
                    anchors.left: title.left;
    
                    // We make this ComboBox dark and without too much decorations
                    // We also make sure to at least use a font that is also found in other
                    // parts of the GUI. (though it doesn't quite look consistent with this
                    // part, specifically)
                    // Fix for Android.
                    style: ComboBoxStyle {
                        textColor: "#000";
                        selectedTextColor: "#333";
    
                        font.family: walkwayUltraBoldFont.name;
                        font.pixelSize: gui.pxToDevice(15);
                    }
    
                    onCurrentIndexChanged: {
                        console.debug("onCurrentIndexChanged " + currentIndex);
                        setNetworkInterfaceIndex(currentIndex);
                    } // onCurrentIndexChanged
                } // ComboBox
    


  • Here is a minimal example that reproduces the bug. It only occurs on Android, when using QtQuick.Controls 1.0. Notice how the location of the dropdown menu is almost random when you click on a ComboBox.

    import QtQuick 2.7
    import QtQuick.Controls 1.0
    
    ApplicationWindow {
        visible: true
        width: 640
        height: 480
        title: qsTr("Hello World")
    
        Label {
            x: 50;
            y: 100;
            text: qsTr("Interference bug minimal example.")
    
        }
    
        ComboBox {
            id: fruit_chooser;
            x: 50;
            y: 200;
    
            model: ListModel {
                id: fruits;
                ListElement {
                    text:"banana"
                }
                ListElement {
                    text:"apple"
                }
                ListElement {
                    text:"strawberry"
                }
            }
        }
    
        ComboBox {
            id: car_chooser;
            x: 50;
            y: 400;
            model: ListModel {
                id: cars;
                ListElement {
                    text:"Toyota"
                }
                ListElement {
                    text:"Nissan"
                }
                ListElement {
                    text:"Ford"
                }
            }
        }
    }
    

Log in to reply
 

Looks like your connection to Qt Forum was lost, please wait while we try to reconnect.