Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to draw a line with faded ends?

I'm trying to draw a line with faded ends in QML, similar to this one:

A faded ends white line on a black background

I tried drawing the line using a rectangle but I don't know how to fade out the ends.

I am using Qt 5.12.

like image 934
Vasanth Dhinakaran Avatar asked Oct 12 '25 16:10

Vasanth Dhinakaran


1 Answers

You can use the Rectangle item both with Gradient, for example:

    Rectangle {
        anchors.fill: parent
        color: "black"

        Rectangle {
            anchors.centerIn: parent
            width: 400
            height: 5
            border.width: 0
            gradient: Gradient {
                orientation: Gradient.Horizontal
                GradientStop { position: 0.0; color: "black" }
                GradientStop { position: 0.25; color: "white" }
                GradientStop { position: 0.75; color: "white" }
                GradientStop { position: 1.0; color: "black" }
            }
        }
    }
like image 78
folibis Avatar answered Oct 16 '25 06:10

folibis