qt - qmlの特定のパスに沿って画像をクリップする方法

Question

背景の溝の画像があります

プログレスフィリングイメージを使用してプログレスバー効果を生成する必要があります

プログレス バーの溝のパスに沿ってプログレス フィリング イメージをクリップする方法 (背景の溝イメージ)。現在、幅方向にクリッピングしようとしていますが、それは私が望むものではありません。私のコードのパスインターポレーターで述べたように、クリッピングはパスに対して垂直に発生するはずです。コード内の "RPM_BG.png" は、"RPM_Fill.png" (進行中の塗りつぶしイメージ) と同様の形状の背景の溝イメージです。

import QtQuick 2.5
import QtQuick.Window 2.2
import QtGraphicalEffects 1.0
import QtQuick.Controls 1.4
import QtMultimedia 5.0
import QtQuick.Controls.Styles 1.4
Window {
    visible: true
    color:"black"
        width: 357
        height: 221+200


        Image
        {
            id:groove1
            source:"qrc:/RPM_BG.png"
            anchors.top:parent.top
            anchors.left:parent.left

            Item{
                        id: displayWindow1
                        height: parent.height 
                         width: (225*(slider.value)/8000)+32


                        clip: true

                            anchors.bottom: parent.bottom
                            anchors.left: parent.left
                            anchors.right:needle.right
                            anchors.rightMargin:/*8*/{switch(true)
                            {
                                case slider.value>=0 && slider.value < 111:return 10;
                                case slider.value>=111 && slider.value < 124:return 9.7;
                                case slider.value>=124 && slider.value < 132:return 8.4;
                                case slider.value>=132 && slider.value < 135:return 8;
                                case slider.value>=135 && slider.value <= 165:return 7.15;
                                case slider.value>=165 && slider.value <= 240:return 6;

                                }
                            }

                        Image
                        {
                            id:speedarcfill
                            anchors.top:parent.top
                            anchors.left:parent.left
                            source:"qrc:/RPM_Fill.png"
                            z: 1
                        }
                    }

        PathInterpolator {
            id: motionPath
            property int value

            path: Path {
                startX: 27; startY: 189
                PathLine { x: 98; y: 54 }
                PathArc { x: 176; y: 12; radiusX: 90; radiusY: 90 }
                PathLine { x: 245; y: 11 }
            }
            progress:slider.value/8000
        }
        }

        Slider {
                    id: slider
                    anchors.top:groove1.bottom
                    anchors.topMargin:100
                    anchors.left:parent.left
                    anchors.leftMargin: 5
                    width: parent.width-10
                    height: 100

                    style: SliderStyle {
                        handle:
                            Rectangle {
                                        anchors.centerIn: parent
                                        color: control.pressed ? "white" : "lightgray"
                                        border.color: "gray"
                                        implicitWidth: 10
                                        implicitHeight: 40
                                    }

                        groove: Rectangle {
                            width: slider.width
                            height: 10
                            color:"black"

                            LinearGradient {
                                anchors.verticalCenter: parent.verticalCenter
                                start: Qt.point(0, 0)
                                end: Qt.point(parent.width, 0)
                                width: styleData.handlePosition
                                height: 10

                                gradient: Gradient {
                                    GradientStop {position: 0.0; color: "#008BFF" }
                                    GradientStop {position: 0.5; color: "#3FFFD0" }
                                    GradientStop { position: 1.0; color: "#3FFF41" }
                                }
                            }
                        }

                    }

                    maximumValue: 8000

                }

    }

進行状況のパスに垂直に進行状況の塗りつぶし画像をクリップできる方法を提案してください。