QML file in application cannot detect touch but only works with mouse clicks

Question

I've been looking everywhere online but cannot find a working solution. When the application is used on a Desktop computer or laptop, it works fine. Mouse clicks are working, it's when we try with a device with a touch screen like surface pro, that's when problems appear.

I have tried adding to the cpp file that calls the QQuickwidget the flag responsible for detecting touch events and it works with some buttons but other widgets or items are not responding.

    AppName *AppName::createInstance(QWidget *parent)
{
    instanceUsageCounter++;
    if (instance == nullptr)
    {
        ui = new Ui::AppName();
        instance = new AppName();
        ui->setupUi(parent);
        ui->dc_stackWidget->setCurrentIndex(0);
        ui->widget_qml->setAttribute(Qt::WA_AcceptTouchEvents);
        QCoreApplication::setAttribute(Qt::AA_SynthesizeMouseForUnhandledTouchEvents);
    }
    return instance;
}

Comboboxes for example.

What exactly needs to be added to make the app detect both mouse clicks and touch events and wokr properly? What exactly is missing?

This is a part in my QML code that worked when I added a TapHandler:

    RoundButton
{
   id: playButton
   icon.source: "qrc:/Resourese/Images/Utility/play.png"
   icon.color: "white"
   icon.height: playButton.height*0.5
   icon.width: playButton.width*0.5
   width: settingsButton.width
   height: width
   radius: width/2
   x: width + settingsButton.x + parent.width*0.015
   y: settingsButton.y

//           x: settingsButton.x
//           y: height + settingsButton.y + parent.height*0.015
  TapHandler
  {
           gesturePolicy: TapHandler.ReleaseWithinBounds
           onTapped: playButtonClicked();
  }
   onClicked:
   {
       playButtonClicked();
   }

   background: Rectangle
   {
      //border.color: "#14191D"
      color: playButton.hovered ||  playButton.pressed ? "#3a5470":"#5f758d"
      width: playButton.width
      height: width
      radius: width/2
   }
}

Here you will see that there is an onClick and above it is the* TapHandler* that was added recently to add the ability for the boutton to be triggerd when touched on a touch screen. This only worked when the flag in the cpp file was added.

Now look at this:

              Rectangle
          {
              id: settingsCell_R7_C3
              Layout.fillHeight: true
              Layout.fillWidth: true
              Layout.columnSpan: 3
              Layout.rowSpan: 1
              Layout.row: 6
              Layout.column: 0

              color: "transparent"

              Button
              {
                  text: "Save settings"
                  font.pixelSize: 30
                  width: parent.width*0.8
                  height: parent.height*0.7
                  anchors.centerIn: settingsCell_R7_C3
                  TapHandler
                  {
                           gesturePolicy: TapHandler.ReleaseWithinBounds
                           onTapped:  applySettings()
                  }

                  onClicked: applySettings()
              }

          }

This Rectangle is within a gridlayout that is inside a Pop up when a Round button similar to the above gets clicked it triggers the pop up window that contains the Rectangle above. The button in this Rectangle when touched is within focus, but not triggered.