Crop an image in one way

[DavidM29]

Hello I would like to show an image on top of another and crop one of the in one way in order to make some kind of gauge of the shape of an Image.
I tried something but it does not crop in one way only there is a moment where it crop the top and the bottom of the image.
How could I achieve my cropping properly ?

Here is what I have tried :

    Image {  //The background image
        anchors.top: slider.bottom  //I use a slider to change the height of the filling
        id: background
        source: "back.svg"
        z:10
        Image { //My filling imag
             width : parent.width
            anchors.bottom: parent.bottom //I anchor this to the bottom il order to have the filling coming from the bottom to the top 
            id: filling
            source: "fill.svg"
            fillMode : Image.PreserveAspectCrop //Whant to keep the image shape so it fills properly the backgroud image
            height: background.height*slider.value/100 //Change the height of the filling image 
            z:0
        }
    }

[ODБOï]

hi @DavidM29 ,
Show the Slider code please.