Customize TabView/TabBar.

[pra7]

I am a beginner and I need to do some customization for tabView/tabBar ,Please refer below image:

W.r.t IMAGE:

1. When I customized tab using TabViewStyle I am getting as (1).

TabView {
id: tv
width: parent.width
height: parent.height
antialiasing: true

style: TabViewStyle {
frameOverlap: -1

tab: Rectangle {
    color: "Transparent"
    implicitWidth: text1.width + 50
    implicitHeight: 20
    radius: 2
    smooth: true
    Canvas {
        id: canvas1
        anchors.fill: parent
        width: parent.width
        height: parent.height
        onPaint: {
            styleData.selected ? drawTab(canvas1,"#0C3142") :
                                 drawTab(canvas1,"Transparent") //Some custom JS function to draw a object
        }

        function drawTab() { // *** some drawing
            console.log('draw')
        }



        Text {
            id: text1
            height: parent.height
            verticalAlignment: Text.AlignVCenter
            anchors.left : parent.left
            anchors.leftMargin: 15
            text: styleData.title
            color: "white"
        }
    }
}

frame: Rectangle {
    width: parent.width
    height: parent.height
    color: "Transparent"
    border.color:"white"
}
tabBar: Rectangle {
    color: "Transparent"
    anchors.fill: parent
}

}

Tab {
id: tab1
title: "Tab1"
}
Tab{
id: tab2
title: "Tab2"

}
2) Final Output in which there should be no line for selected tab.

Please suggest.