QML做图片倒影效果（控件倒影）

　　前言
　　用QML做图片倒影，主要是用ShaderEffect组件来实现，先来看看实际效果，如下：
　　还可以用同样的方式来做其他控件的倒影，例如：
　　正文
　　直接来看源码
　　importQtQuick2。0importQtQuick。Controls1。4Rectangle｛id：windowwidth：600height：500gradient：Gradient｛GradientStop｛position：0；color：lightsteelblue｝GradientStop｛position：1；color：black｝｝Image｛id：imgwidth：300height：170source：car。pnganchors。centerIn：parent｝ShaderEffect｛anchors。top：img。bottomwidth：img。widthheight：img。heightanchors。left：img。leftpropertyvariantsource：imgpropertysizesourceSize：Qt。size（0。5img。width，0。5img。height）fragmentShader：varyinghighpvec2qtTexCoord0；uniformlowpsampler2Duniformlowpvec2sourceSuniformlowpfloatqtOvoidmain（）｛lowpvec2tcqtTexCoord0vec2（1，1）vec2（0，1）；lowpvec4col0。25（texture2D（source，tcsourceSize）texture2D（source，tcsourceSize）texture2D（source，tcsourceSizevec2（1，1））texture2D（source，tcsourceSizevec2（1，1）））；glFragColorcolqtOpacity（1。0qtTexCoord0。y）0。2；｝
　　若要拓展做其他控件的倒影，只需要修改propertyvariantsource：img对象即可。
　　还有一种比较简单的容易理解的方式来实现同样的效果
　　importQtQuick2。0importQtQuick。Controls1。4Rectangle｛id：600height：500gradient：Gradient｛GradientStop｛position：0；color：lightsteelblue｝GradientStop｛position：1；color：black｝｝Image｛id：300height：170source：car。png｝Item｛width：1origin。y：img。height2。｝｝LinearGradient｛width：0。0；color：Qt。rgba（0，0，0，0。1）｝GradientStop｛position：0。4；color：Qt。rgba（0，0，0，1）｝｝｝｝｝
　　原理是先通过设置一张倒着的图片，然后在图片上添加一个渐变层，代码很简单
　　【领QT开发教程学习资料，点击下方链接莬费领取，先码住不迷路】
　　点击这里：