How to center ScrollView that is in StackView?

I can't center pushed ScrollView into the StackView. I've tried a bunch of ways, but nothing works. Can you help me with this, please?

//Main.qml
...
StackView {
    id: stackView
    anchors.fill: parent
    initialItem: mainView
}
Loader {
    id: serialportLoader
    active: false
    source: "secondFile.qml"
}
...
//Push "secondFile.qml" by pressing a button with the action:
Action {
    id: openSerialportSettings
    text: "Open serial port"
    onTriggered: {
        serialportLoader.active = true;
        stackView.push(serialportLoader.item);
    }
}
...

//secondFile.qml
ScrollView   {
    ColumnLayout {
        spacing: 5
//        Layout.alignment: Qt.AlignVCenter
        anchors.centerIn: parent
        Rectangle {
            color: "green"
            height: 50
            Layout.fillWidth: true
        }
...

If I add an empty Item to the ScrollView, it comes to the center but no longer scrollable:

ScrollView   {
    Item {
    }
    ColumnLayout {
...

I guess I'm just using ScrollView wrong, because I get these results with ScrollView and Page instead of it:

ScrollView/*Page*/  {
    id: topItem
    ColumnLayout {
        spacing: 5
        anchors.centerIn: parent
        Rectangle {
            color: "green"
            height: 200
            width: 300
            Layout.fillWidth: true
        }
    }
}

In Online editor

As hinted by JarMan, the cause of the problem/confusion is your implementation of Loader makes your StackView implementation ambiguous. I have created a version of your application just using the StackView and made that receive "SecondPage.qml":

import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
Page {
    header: AppToolBar { }
    StackView {
        id: stackView
        anchors.fill: parent
        initialItem: "MainView.qml"
    }
}

// MainView.qml
import QtQuick
import QtQuick.Controls
Page {
    Label {
        anchors.centerIn: parent
        text: "MainView.qml"
    }
    Button {
        anchors.horizontalCenter: parent.horizontalCenter
        y: parent.height * 3 / 4
        text: "Go To Second Page"
        onClicked: stackView.push("SecondPage.qml")
    }
}

// SecondPage.qml
import QtQuick
import QtQuick.Controls
Page {
    Label {
        anchors.centerIn: parent
        text: "SecondPage.qml"
    }
    Button {
        anchors.horizontalCenter: parent.horizontalCenter
        y: parent.height * 3 / 4
        text: "Back"
        onClicked: stackView.pop()
    }
}

// AppToolBar.qml
import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
ToolBar {
    RowLayout {
        width: parent.width
        ToolButton {
            enabled: stackView.depth > 1
            icon.source: "chevron-left-32.svg"
            opacity: enabled ? 1 : 0
            onClicked: stackView.pop()
        }
        Label {
            Layout.fillWidth: true
            text: "Page Title"
            horizontalAlignment: Qt.AlignHCenter
        }
        ToolButton {
            icon.source: "handle-vertical-32.svg"
        }
    }
}

// chevron-left-32.svg: https://raw.githubusercontent.com/Esri/calcite-ui-icons/master/icons/chevron-left-32.svg

// handle-vertical-32.svg: https://raw.githubusercontent.com/Esri/calcite-ui-icons/master/icons/handle-vertical-32.svg

You can Try it Online!