Расположение страницу pdf по центру окна

Всем привет.
Использую PdfScrollablePageView так как мне надо работать с однйо страницей, скролить если я использовал zoom или растянул по ширине страницу(скрол в данном случаи будет по вертикали).
данный обьект наследован от Flickable(начинается большое колличесвто проблем позиционированием и центровкой) по сравнению с PdfpageView.

Требуется при открытии растягивать страницу по высоте, иметь background так как нужен цвет фона вне страницы. Этого я добился когда взял исходники PdfScrollablePageView и внутри завернул обьект что отвечает за саму страницу в еще один обьект pageHolder дял фона.
Ниже данный кусок кода

Код:

    Rectangle
    {
        // добавлен был к исходному коду вот этот обьект
        id: pageHolder

        width: pdfView.width
        height: image.height
        color: "color"

        Rectangle
        {
            id: paper

            width: rot90 ? image.height : image.width
            height: rot90 ? image.width : image.height

            property real rotationModulus: Math.abs(root.pageRotation % 180)
            property bool rot90: rotationModulus > 45 && rotationModulus < 135
            property real minScale: 0.1
            property real maxScale: 10
            anchors.centerIn: parent

            PdfPageImage
            {
                id: image

                document: root.document
                currentFrame: pageNavigator.currentPage
                asynchronous: true
                fillMode: Image.PreserveAspectFit
                rotation: root.pageRotation
                property real pageScale: image.paintedWidth / document.pagePointSize(pageNavigator.currentPage).width
                anchors.centerIn: parent

                Shape
                {
                    anchors.fill: parent
                    visible: image.status === Image.Ready

Вот так выглядит страницу при первом открытии
https://ibb.co/ChThkJQ
Идея рабочая но плохая так как мне пришлось целый файл исходного кода к данному обьекту копировать.

И решил попробовать сделать почти по принципу орегинального кода, но снаружи сделал pageHolder что делает вот такой вид и уже не правильный. https://ibb.co/BGhdpww

Код:

Rectangle
{
    id: root

    property alias pageRotation:    pdfPageView.rotation
    property alias document:        pdfPageView.document
    property alias renderScale:     pdfPageView.renderScale
    property alias sourceSize:      pdfPageView.sourceSize
    property real threeWidth: 0

    function goToPage(page)
    {
        pdfPageView.goToPage(page)
    }

    function scaleToPage()
    {
        pdfPageView.scaleToPage()
    }

    function scaleToWidth()
    {
        pdfPageView.scaleToWidth()
    }

    Rectangle
    {
        id: pageHolder

        width: root.width
        height: root.height
        color: "red"


        PdfScrollablePageView
        {
            id: pdfPageView

            anchors.fill: parent

И еще один вариант это использовать PdfPageView для которого сделать внешнйи Flickable, но и тут возникли трудности с позиционированием.

Код:

    Flickable
    {
        id: flickable

        width: root.width
        height: root.height

        contentWidth: pdfPageView.width
        contentHeight: pdfPageView.height

        Rectangle
        {
            id: pageHolder

            width: root.width
            height: root.height
            color: "red"
            //color: rootViewPdf.pelData.pdfViewerProperties.colorBackground


            PdfPageView
            {
                id: pdfPageView
                width: root.width
                height: root.height
            }
        }
    }

И выглядит это уже совершенно странно, хотя мне кажется это должно быт ьправильным решенеим. Само собою скрол уже тут не работает. https://ibb.co/JzWhnL6

Может кто то с этим посоветовать какое то решение?