switch position

[joko]

Hi,

Is there a way to modify the groove and handler of switch element to position on the right of the text?

I am trying to create a custom switch element with text.
I know this would be possible if i'll put it into RowLayout, however I wanted to use the clicked signal that will be emitted by the Switch that is why i wanted to put it this way.
I tried using RowLayout and put alias on the Switch however i got stuck in working with the clicked signal of the element.

Switch {
  id: switch
 
  property alias label: label.text
 
  style: SwitchStyle {
      groove: Rectangle {
        id: groove
        implicitWidth: 100
        implicitHeight: 60
        radius: implicitWidth*0.5
        color: control.checked ? "green : "white"
        border.width: control.checked ? 0 : 1
        border.color: "gray"
      }
      handle: Rectangle {
        id: handle
        implicitWidth: height
        radius: implicitWidth*0.5
        color: "white"
        border.width: control.checked ? 0 : 1
        border.color: "gray"
      }
    }
 
  Text {
    id: label
 
    horizontalAlignment: Text.AlignLeft
  }
}

Switch {
  id: switch

  property alias label: label.text

  style: SwitchStyle {
      groove: Rectangle {
        id: groove
        implicitWidth: 100
        implicitHeight: 60
        radius: implicitWidth*0.5
        color: control.checked ? "green : "white"
        border.width: control.checked ? 0 : 1
        border.color: "gray"
      }
      handle: Rectangle {
        id: handle
        implicitWidth: height
        radius: implicitWidth*0.5
        color: "white"
        border.width: control.checked ? 0 : 1
        border.color: "gray"
      }
    }

  Text {
    id: label

    horizontalAlignment: Text.AlignLeft
  }
}

To copy to clipboard, switch view to plain text mode