Eduardo
Eduardo

Reputation: 701

Remove space between TabButton in TabBar

I'm making a TabBar with custom TabButton and I want to remove the white space between the buttons. I've tried several things but I can't find the correct TabButton property.

enter image description here

This is my code:

Boton.qml:

TabButton {
onCheckedChanged: canvas.requestPaint()

contentItem: Text {
    antialiasing: false
    text: parent.text
    font.family: "monofonto"
    horizontalAlignment: Text.AlignHCenter
    verticalAlignment: Text.AlignVCenter
    color: "#19F51E"
}
background: Rectangle{
    color: 'black'
}
Canvas{
    id: canvas
    width: parent.width
    height: parent.height
    onPaint: {
        var ctx = getContext("2d");
        ctx.reset()
        ctx.lineWidth = 5;
        ctx.strokeStyle = "#19F51E";
        ctx.beginPath()
        if (parent.checked){
            ctx.moveTo(0, 0)
            ctx.lineTo(width, 0)
        } else {
            ctx.moveTo(0, height)
            ctx.lineTo(width, height)
        }
        ctx.stroke()
    }
}

}

Upvotes: 0

Views: 576

Answers (1)

Eduardo
Eduardo

Reputation: 701

I found the property. Setting spacing to 0 works fine.

Upvotes: 2

Related Questions