qt - Round border with light effect in QML -


round border lighting effect

i'm starting tests qt using qtquick. i'd know if there's way achieve kind of border effect in plain qml. i've seen qtquick3d, sounds much... visual effects in office application. application ran in low end desktops, , don't want performance penalty effects. please, correct if i'm wrong 3d being much.

the straightforward alternative seems borderimage object, want sure there's no way in plain qml (i.e., without external images).

i appreciate help.

maybe try implement shaderefect? code not efficient, should work expected on today's low performance graphic cards (opengl 3+) , qt5.2 (qt 5.0 bypass):

shadereffect {     x:50     y:50     width: 500     height: 100      property color color: "grey"     property vector2d size: qt.vector2d(width,height)     property real lightsize: 5     property real round:  50      vertexshader: "         uniform highp mat4 qt_matrix;         attribute highp vec4 qt_vertex;         uniform highp vec2 size;         varying highp vec2 coord;         void main() {             coord = qt_vertex.xy;             gl_position = qt_matrix * qt_vertex;         }"     fragmentshader: "         varying highp vec2 coord;         uniform highp vec2 size;         uniform lowp vec4 color;         uniform lowp float qt_opacity;         uniform lowp float lightsize;         uniform lowp float round;         void main() {             float dx=0.0f;             float dy=0.0f;             if( coord.x < round )                 dx = coord.x-round;             else if( coord.x > (size.x - round) )                 dx = round - (size.x - coord.x);             if( coord.y < round )                 dy = coord.y-round;             else if( coord.y > (size.y - round) )                 dy = round-(size.y - coord.y);             float distance= sqrt(dx*dx+dy*dy);             float ilumination = dot(vec2(dx, dy)/distance,vec2(-0.5f,-0.5f)) * 0.5 * smoothstep( lightsize, 0.0f , abs(distance-(round-lightsize*0.5)) );             lowp vec4 insidecolor = (vec4(ilumination, ilumination , ilumination,0.0f)+color) * smoothstep( round, round-2.0f, distance);             gl_fragcolor =  insidecolor * qt_opacity;         }"  } 

rounded box


Comments

Popular posts from this blog

user interface - How to replace the Python logo in a Tkinter-based Python GUI app? -

objective c - Greedy NSProgressIndicator Allocation -

how to set an OCR language in Google Drive -