Change the solid circle color of interactive buttons.

• May 21, 2023 - 15:33

When selecting a button, how can I change the color of the solid circle of the button? I found that the blue color of Musescore 4 does not meet my requirements.I want to change these three buttons to different colors. How can I achieve this.
change color.png


Hi, you went in the right direction. Look at my NiceRadioButton item.
You define a new property at the level of the item that would the color:

RadioButton {
    id: control

    property var indicatorColor:  "black" // adds a new property

    // ...
    indicator: Rectangle {
        // ...
        Rectangle {
            // ...
            color: control.down ? "#555555" : control.indicatorColor  // use the new property
            visible: control.checked

And at the level of your GUI:

NiceRadioButton {
    indicatorColor: "red" // to obtain a radio buton which indicator is red

Rem: StackOverflow is good source of information for all these questions, better than this forum, because the guys and girls there have A LOT of knowledge about QML

In reply to by davil123

This one took me a while to figure out how to build it ;-)

For GUI, you have 2 options: the traditional QML approach (which I use) and the WebEngine+HTML approach which is a completely different approach, leading to rich GUI but whose support in MS4.0 is unknown.

For the latter, I have no experience, but you can check
- The Mixer Minimalist Style from msfp
- and his doc in the knowledge database

For the first (and traditional) approach, I could point to some of my plugin and some others:
- Batch Convert (some code is historical and less neat, but I didn't want to rewrite everything)
- Score from template (which has some subcomponents, filter-as-you-type list, ...)
- TempoChanges (with an interactive line canvas)
- Scale Workout Builder (with one of my best and successful usage of the ListModel approach)

Do you still have an unanswered question? Please log in first to post your question.