QML Button not clickable when TextField below it has focus on iOS

If you have a RoundButton overtop of a TextField as in the QML below, the button onClicked action will not be called if the TextField below it has Focus. If the TextField does not have focus (is not being edited) OR if the button is not on top of the TextField, the RoundButton works just fine.

RoundButton onClicked will function just fine when tested on Windows 10 & MacOS Catalina.  But when run on iOS the button will visually look depressed when clicked, but no onClicked action occurs.

In the QML example below, the "clear" button acts to reset the input of the TextField, except when the user is entering text into the TextField on iOS.

 

 

import QtQuick 2.12
import QtQuick.Window 2.12
import QtQuick.Controls 2.12

Window {
    visible: true
    width: 640
    height: 480

  TextField

{     id: searchField     placeholderText: "Search..."   }

  RoundButton {
    id: clearSearch
    anchors.right: searchField.right
    anchors.top: searchField.top
    anchors.bottom: searchField.bottom
    anchors.margins: 5
    text: "X"
    opacity: 0.5

    onClicked:

{       console.log("clear btn clicked");       searchField.clear();       searchField.forceActiveFocus();     }

  }

}

 

https://stackoverflow.com/questions/59976434/qml-button-not-clickable-when-textfield-below-it-has-focus-on-ios