qml无框窗口的阴影

Posted 2023-02-16

【中文标题】qml无框窗口的阴影

【英文标题】：Shadow for qml frameless windows

【发布时间】：2013-09-12 01:49:58

【问题描述】：

我有由 qml 创建的无框主窗口（我的 main.qml 文件中的 ApplicationWindow ..） 我通过QQmlApplicationEngine::load（Qt5.1 中引入的类）实例化 qml。 如果我设置Qt.FramelessWindowHint 标志，则窗口是无框的，但会丢失阴影（在 Windows 中）。 如何给我的窗口添加阴影？

我的窗口列表：

ApplicationWindow 
    id: rootWindow
    color : "#f8f8f8"
    maximumHeight: 445
    minimumHeight: 445
    minimumWidth: 730
    maximumWidth: 730
    flags  : Qt.FramelessWindowHint  |  Qt.Window

    Component.onCompleted: 
        setHeight(455)
        setWidth(740)
    

    MainObject
            id:mainObject1
            anchors.fill: parent
            height:445
            width:730
    

【问题讨论】：

Windows(TM) WM 将阴影效果应用于装饰的窗口，如果我设置 Qt.FramelessWindowHint 阴影不适用于窗口。

【参考方案1】：

解决方案是实现应用程序集成的阴影部分，这样您可以禁用 WM 装饰并且仍然有装饰，并且在不同平台之间保持一致。

在下面的例子中，窗口有一个阴影，它甚至可以动画来创建移动窗口时抬起窗口的效果。并且当窗口最大化时，边距被移除，因此阴影不再可见。

import QtQuick 2.7
import QtQuick.Controls 2.1
import QtGraphicalEffects 1.0
import QtQuick.Window 2.3

ApplicationWindow 
    id: main
    visible: true
    width: 300
    height: 200
    color: "#00000000"
    flags: Qt.FramelessWindowHint | Qt.Window

    Rectangle 
      id: rect
      anchors.fill: parent
      anchors.margins: main.visibility === Window.FullScreen ? 0 : 10
      MouseArea 
        id: ma
        anchors.fill: parent
        property int dx
        property int dy
        onPressed:  dx = mouseX; dy = mouseY 
        onPositionChanged: 
          main.x += mouseX - dx
          main.y += mouseY - dy
        
        onDoubleClicked: main.visibility = main.visibility === Window.FullScreen ? Window.AutomaticVisibility : Window.FullScreen
      
    

    DropShadow 
      anchors.fill: rect
      horizontalOffset: 1
      verticalOffset: 1
      radius: ma.pressed ? 8 : 5
      samples: 10
      source: rect
      color: "black"
      Behavior on radius  PropertyAnimation  duration: 100  
    

【参考方案2】：

import QtQuick 2.12
import QtQuick.Window 2.12
import QtQuick.Controls 2.12
import QtGraphicalEffects 1.0

ApplicationWindow
    id: window
    visible: true
    width: 640
    height: 480
    title: qsTr("Hello World")
    flags: Qt.Window | Qt.FramelessWindowHint
    color: "#00000000"

    Rectangle 
        id: rect
        anchors.fill: parent
        anchors.margins: 10
        radius: 5
    

    DropShadow 
        anchors.fill: rect
        samples: 20
        source: rect
        color: "gray"
    

【参考方案3】：

如果你指的是投影效果，那就不是这样了。

除了您刚刚使用的无框窗口标志外，我们无法控制 Qt 中的 WM 装饰。它几乎是 WM 特定的。 Windows (TM) WM 应用阴影效果来装饰窗户，但这是 Windows (TM) 的选择。另外，你刚刚暗示它不应该装饰。