Custom qml module not found

mjohn

Hello,
I'm trying to create a custom set of components/controls to set things like color/style requirements. I've tried two methods that I've come across but have had no luck it getting things to work.
The first was from this example on creating a custom style: https://doc.qt.io/qt-5/qtquickcontrols-flatstyle-example.html
I can get the "QML Plugin" section working but unable to get the "Implementing Custom Controls" section working.

My custom component, MmControl/ScrollBar.qml:

/* ScrollBar.qml */
import QtQuick 2.12
import QtQuick.Controls 2.12
import QtQuick.Controls.impl 2.12
import QtQuick.Templates 2.12 as T

T.ScrollBar {
    id: control

    implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset,
                            implicitContentWidth + leftPadding + rightPadding)
    implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset,
                             implicitContentHeight + topPadding + bottomPadding)

    padding: 2
    visible: control.policy !== T.ScrollBar.AlwaysOff
    active: true
    policy: T.ScrollBar.AlwaysOn

    contentItem: Rectangle {
        implicitWidth: control.interactive ? 6 : 2
        implicitHeight: control.interactive ? 6 : 2

        radius: 32
        color: "blue"
        opacity: 0.0

        states: State {
            name: "active"
            when: control.policy === T.ScrollBar.AlwaysOn || (control.active && control.size < 1.0)
            PropertyChanges { target: control.contentItem; opacity: 0.75 }
        }

        transitions: Transition {
            from: "active"
            SequentialAnimation {
                PauseAnimation { duration: 450 }
                NumberAnimation { target: control.contentItem; duration: 200; property: "opacity"; to: 0.0 }
            }
        }
    }
}

and the use else where in the code:

ScrollBar.vertical: ScrollBar {
                parent: control
                x: control.width - width
                y: control.topPadding
                height: control.availableHeight
                orientation: Qt.Vertical
                contentItem: Rectangle {
                        implicitWidth: 10
                        implicitHeight: 100
                }
}

But the ScrollBar is not blue or round (still the default white color with square edges). So it doesn't seen to use the custom module. I do have a qtquickcontrols2.conf file with Style=MmControl and a MmControl directory in the resource system at /MmControl.

The Second example I found was this one: https://doc.qt.io/qt-5/qtqml-qmlextensionplugins-example.html
I moved my ScrollBar to the import path and renamed it (imports/MmControl/VertScrollBarV1.qml) and created the qmldir file

module MmControl
VertScrollBar 1.0 VertScrollBarV1.qml

And updated my .pro file:

RESOURCES += imports/MmControl/VertScrollBarV1.qml imports/MmControl/qmldir

And updated the file using the custom component:

import MmControl 1.0
....
ScrollBar.vertical: VertScrollBar {
                    parent: control
                    x: control.width - width
                    y: control.topPadding
                    height: control.availableHeight
                    orientation: Qt.Vertical
                    contentItem: Rectangle {
                        implicitWidth: 10
                        implicitHeight: 100
                    }
}

But now QtCreator complains at the VertScrollBar line saying Unknown component. (M300)

Am I close at getting either of these methods to work? Ideally I'd like to override the default ScrollBar (and Button, Switch, etc) so I don't have to create a new name for each with the custom style.