Customise TreeView branch indicator

Bob64

Hi - my first post on the forum. I'm quite new to QML and currently somewhat confused, so please be kind if I am asking dumb questions...

First of all, in case it makes any difference, I am using Qt 5.9.6. I know this is quite old but this is a restriction I have at work.

I have been trying to customise the branch indicator of my TreeView using a pair of 'chevron' images implemented as svg files because I don't esepcially like the default 'triangle' indicators. So I have an Image item in my branchDelegate and I simply switch the image source based on whether styleData.isExpanded is true:

branchDelegate: Rectangle {
    width: 16; height: 16
    Image {
        anchors.centerIn: parent
        source: styleData.isExpanded ? "qrc:///img/chev-dn.svg" : "qrc:///img/chev-rt.svg"
    }

This works fine, except that if the row is selected (and therefore highlighted) the whole row is blue apart from the square containing my indicator image, which stays white.

I know that I can set the color in the Rectangle delegate item but for the life of me I can't see how to query the branch selection colour so that I set the correct value for color. It does not appear to be customisable at all. I have even resorted to trying to decipher the QML source code but I cannot see where it is defined. Can anyone help please? Or is there a better approach to setting the indicator that would avoid the problem in the first place?

On a related note, I tried building the filesystembrowser example provided by Qt, which is a fairly simple example using the 'file system model' with a TreeView. Bizarrely, when I run this example, the tree is using the sort of chevron branch indicators that I am trying to implement, even though there is nothing as far as I can see in the example code that is customising the indicator. Can anyone explain why this happens? Again I have tried browsing the Qt source to see if I can spot anything. The default indicator is defined in Src/qtquickcontrols/src/controls/Styles/Base/TreeViewStyle.qml

    property Component branchDelegate: Item {
        width: indentation
        height: 16
        Text {
            visible: styleData.column === 0 && styleData.hasChildren
            text: styleData.isExpanded ? "\u25bc" : "\u25b6"
            ...
        }
    }

In other words the default indicators are simple implemented as Text containing the unicode characters for 'black down pointing triangle' and 'black right pointing triangle'. I can't see anythwere else in the source where this is set differently from this to account for what I see in the file browser example. Any ideas as I am baffled? If I can figure out how this is working I might be able to use it.

Thanks in advance for any help.

Bob

Bob64

OK, so I have a partial answer in that I have been able to find the tree selection highlight colour by searching for it in the QML debugger tree. From this I found that it is "#0077cc". However, there must surely be a better way to do this!

On the way to this I thought I had found the answer in SystemPalette. So I tried:

// branchIndicator
Rectangle {
    SystemPalette { id: myPalette; colorGroup: SystemPalette.Active }
    color: styleData.selected ? myPalette.highlight : "white"
    ...
    Image { ... }
}

But this is not the same as the tree highlight colour unfortunately.

Bob64

I guess my questions might have been missed as I posted over the weekend. The summary is:

How do I reliably query for the colour that is used to indicated a selected/highlighted row in TreeView?
How is it that the branch indicator in the filesystembrowser example is different from the default when the example code does not appear to be doing anything to customise this?