DropShadow继承于Item类型.
DropShadow可以设置某个Item或者某个图片的阴影背景,并将其放置在源对象的后面，创建一个柔和的阴影。
阴影的颜色可以用color属性来改变。阴影的位置可以通过horizontalOffset和verticalOffset属性来改变。
它的属性如下所示:
- cached : alias,缓存,默认为false.
- color : alias,设置阴影颜色值,默认值为"black"
- horizontalOffset : real,horizontalOffset和verticalOffset属性定义了渲染阴影相对于DropShadow项目位置的偏移量,默认值为0
- verticalOffset : real
- radius : int,设置阴影柔和度,为0的话表示不模糊,默认值为floor(samples/2)
- samples : alias,设置模糊计算的采样样本多少,默认为9,值越大,渲染越慢,模糊效果越好
- source : alias,设置生成阴影的源对象
- spread : alias,设置伸展系数(扩大阴影倍数),默认为0,不伸展
- transparentBorder : alias,设置模糊边框,默认为true,如果为false,那么对于不透明边缘的图像将不会得到模糊的阴影
对于Item类型,可以通过下面两个附加属性实现外部阴影
- layer.enabled : bool,设置图层使能,默认false.要设置阴影的话,必须设置为true
- layer.format : enumeration,设置图层效果,通常是一个ShaderEffect组件
修改之前的代码 32.qt quick-模仿QQ登录界面实现3D旋转(Rotation、Flipable)
修改之前:
修改之后:
修改如下所示:
import QtQuick 2.12 import QtQuick.Window 2.12 import QtGraphicalEffects 1.12 Window { id: wind visible: true width: flipable.width * 1.3 height: flipable.height * 1.3 flags: Qt.Window | Qt.FramelessWindowHint property var angleVlue : 0 color: "#00000000" Flipable { id: flipable width: 426 height: 327 y: (wind.height - height) /2 x: (wind.width - width) /2 property bool flipped: false front: Image { id: frontImage anchors.fill: flipable source: "qrc:/1.png" smooth: true antialiasing: true layer.enabled: true layer.effect: DropShadow { } } back: Image { id: backImage anchors.fill: flipable source: "qrc:/2.png" smooth: true antialiasing: true layer.enabled: true layer.effect: DropShadow { } } transform: Rotation { id: rotation origin.x: flipable.width/2 origin.y: flipable.height/2 axis { x: 0; y: 1; z: 0 } // set axis.y to 1 to rotate around y-axis angle: 0 // the default angle } states: State { name: "back" PropertyChanges { target: rotation; angle: 180 } when: flipable.flipped } transitions: Transition { NumberAnimation { target: rotation; property: "angle"; duration: 1000 ; easing.type: Easing.OutQuad} } MouseArea { anchors.fill: parent onClicked: { flipable.flipped = !flipable.flipped } } } }