6

ドロップ シャドウがカットされた qml ウィンドウ

QtGraphicalEffects で QtQuick 2 を使用してアイテムに効果を追加しようとしていますが、本当にぼやけた効果を調整して正しく表示する方法がよくわかりません。

この場合、ドロップ シャドウのサイズが小さく、完全にフェードアウトする前にエッジが切り取られています。どうすればきれいに溶け込み、切れないようにできますか?

ウィンドウのコードは次のとおりです。

import QtQuick 2.0
import QtGraphicalEffects 1.0

Item {
    width: 250
    height: 75

    Text {
        id: textItem
        x: 10; y: 10
        text: "how can I fix my shadow?"
    }

    DropShadow {
        id: shadowEffect
        anchors.fill: textItem
        source: textItem

        radius: 8
        samples: 16

        horizontalOffset: 20
        verticalOffset: 20
    }
}
4

2 に答える 2

8

効果を完全に描画できるように、元のアイテム (効果によって複製される) の周りに十分なスペースを確保する必要があります。私なら次のようにします。

import QtQuick 2.0
import QtGraphicalEffects 1.0

Item {
    width: 320;
    height: 240;

    Text {
        id: textItem;
        anchors.centerIn: parent;
        text: "how can I fix my shadow?";

        /* extend the bounding rect to make room for the shadow */
        height: paintedHeight + (shadowEffect.radius * 2);
        width: paintedWidth + (shadowEffect.radius * 2);

        /* center the text to have space on each side of the characters */
        horizontalAlignment: Text.AlignHCenter;
        verticalAlignment: Text.AlignVCenter;

        /* hide the original item because the Graphical Effect duplicates it anyway */
        visible: false;
    }
    DropShadow {
        id: shadowEffect;
        anchors.fill: source;
        source: textItem;
        radius: 8;
        samples: 16;
        horizontalOffset: 20;
        verticalOffset: 20;
    }
}
于 2013-03-26T14:05:44.260 に答える