Qt Quick Window / Frame с мерцанием внутренней тени при изменении размера - PullRequest
Новая
       87

Qt Quick Window / Frame с мерцанием внутренней тени при изменении размера

0 голосов
/ 20 января 2020

Когда я изменяю размер Qt Quick ApplicationWindow, который содержит Frame с InnerShadow, я вижу мерцающие и визуальные артефакты. То же самое не верно, когда я либо не заменяю границу по умолчанию, либо если я использую простой прямоугольник для объекта Frame.

Я проверил это на своем ноутбуке, который работает на 64-битной Arch Linux. Он имеет графическую карту Nvidia GTX 1060 Max Q и встроенную графическую карту Intel. Я запускал код как с bumblebee.

* 1010, так и без него. Есть ли способ обойти или устранить это мерцание? Это довольно плохо. Мой код и некоторые скриншоты, как показано ниже

РЕДАКТИРОВАТЬ: я попытался установить атрибуты AA_ShareOpenGLContexts и AA_UseOpenGLES (и его варианты программного обеспечения / рабочего стола) безуспешно.

ОБНОВЛЕНИЕ: Я создал проблему здесь: https://bugreports.qt.io/browse/QTBUG-81519, но я все еще надеюсь, что кто-то может найти обходной путь.

test.qml 

import QtQuick 2.14
import QtQuick.Controls 2.14
import QtGraphicalEffects 1.14

ApplicationWindow{
    id: main
    width: 2*screen.width/3
    height: 2*screen.height/3
    title: "Test ApplicationWindow"  
    color: activeColorPalette.window 
    visible:true
    SystemPalette {
        id: activeColorPalette
        colorGroup: SystemPalette.Active
    }    
    Frame{
        anchors.fill: parent 
        anchors.margins: 10
        background: Item{
            id: root
            anchors.fill: parent
            Rectangle{
                anchors.fill: parent
                anchors.margins: 1
                radius: 16
                color: activeColorPalette.window
            }
            InnerShadow {
                anchors.fill: root
                horizontalOffset: 0
                verticalOffset: 0
                source: root
                radius: 16
                color: activeColorPalette.shadow
                spread: 0.6        
                samples: 32        
                cached: true
                fast:true
            }
        }
    }
}

Окно без мерцания и артефактов

Окно с мерцающими / визуальными артефактами при изменении размера

1 Ответ

0 голосов
/ 21 января 2020

Я нашел обходной путь для устранения визуальных артефактов при изменении размера.

В моем коде проблемы InnerShadow использовал тип Item QML в качестве источника, который по умолчанию прозрачен и содержит серый Rectangle, что я добавил в него. Визуальное различие между прозрачным источником Item и меньшим дочерним элементом Rectangle внутри него - это то, что InnerShadow использует для вычисления градиента тени внутри. Конечным результатом была декоративная теневая граница. Однако изменение размера приложения привело к появлению уродливых визуальных артефактов, которые иногда оставались. Примечание: изменение внешнего Item в прозрачный Rectangle не оказало заметного эффекта.

Но когда я инкапсулировал серый внутренний прямоугольник в другой прозрачный компонент, такой как

Item {прозрачный Rectangle {серый внутренний Rectangle}}

или аналогичный

Rectangle {прозрачный Rectangle {серый внутренний Rectangle}}

в дополнение к , устанавливающему средний прозрачный Rectangle в качестве источника для InnerShadow, визуальные артефакты устраняются , Ниже приведен рабочий код для test_workaround.qml , который можно сравнить с test.qml выше.

test_workaround.qml 

import QtQuick 2.14
import QtQuick.Controls 2.14
import QtGraphicalEffects 1.14

ApplicationWindow{
    id: main
    width: 2*screen.width/3
    height: 2*screen.height/3
    title: "Test ApplicationWindow"  
    color: activeColorPalette.window 
    visible:true
    SystemPalette {
        id: activeColorPalette
        colorGroup: SystemPalette.Active
    }    
    Frame{
        anchors.fill: parent 
        anchors.margins: 10
        background: Item{
            id: root
            anchors.fill: parent
            Rectangle{
                 id: middleRect
                 anchors.fill: parent
                 color: "transparent"           
                Rectangle{
                    id: innerRect
                    anchors.fill: parent
                    anchors.margins: 1
                    radius: 16
                    color: activeColorPalette.window
                }
            }
            InnerShadow {
                anchors.fill: root
                horizontalOffset: 0
                verticalOffset: 0
                source: middleRect
                radius: 16
                color: activeColorPalette.shadow
                spread: 0.6        
                samples: 32        
                cached: true
                fast:true
                smooth:true
            }  
        } 
    }
}
...