Only some of the operations called within the onPressed function are executed

Bracha

Hello everyone

I encountered a strange problem (which, by the way, also repeats itself in the onClicked() function)

I have a screen with a top and a bottom. The lower part contains 2 buttons that are hidden in the view of the upper part.

That is, when the A button is pressed, the top part will change to a certain view called A
And the same for the B button.

The appearance of the button is based on an image that I have in the project, and at the same time as changing the display of the upper part, I want to change the background image of the button and that the image remains for the entire time that the part of the screen related to it is displayed.

That's why I used the function onPressed() and there I defined both the display change of the top part and the change of the background image of the button.

What is happening is a really strange thing:
If we do only image replacement - it works fine. As soon as it is also required to change the display on the screen - only the display of the screen changes and the image does not.

(I tried changing the view both by directly accessing the source and changing it in the function to the other image, and by using a flag that I changed in the function and used in the source definition, both ways did not work)

Has anyone encountered such behavior and can help me in this matter?

Thanks!

GrecKo

@Bracha No and we can't help you more if you don't provide a minimal reproducible example.

Bracha

@GrecKo OK
It's a bit more complex than what I described, but I'll try to narrow it down and bring relevant code here.

so I have 2 buttons, info for information screen and general for general screen
this is FooterForm.ui.qml file

Item {
id: footerForm
    property alias generalBtn: general
    property alias generalBtnImg: generalBtnImg
    property alias informationBtn: information
    property alias infoBtnImg: infoBtnImg

Row {
            id: btns
            x: 18;  y: 8;    spacing: 10

            Button {
                id: general
                text: "general"

                background: Image {
                    id: generalBtnImg
                    source: generalIsPressed ? "../images/TabButtonClicked.png" : "../images/TabButton.png"
                }
            }

            Button {
                id: information
                text: "info"

                background: Image {
                    id: infoBtnImg
                    source: infoIsPressed ? "../images/TabButtonClicked.png" : "../images/TabButton.png"
                }
            }
        }
}

this is Footer.qml file

FooterForm {
id: footer
    property bool infoIsPressed: false
    property bool generalIsPressed: true

 generalBtn.onPressed: {
//  Booleans change to update the background image of the button
        generalIsPressed = true
        infoIsPressed = false
//signal that changes the top of the screen
        DeviceStateController.reloadLayout()
}

   informationBtn.onPressed: {
//  Booleans change to update the background image of the button
        generalIsPressed = false
        infoIsPressed = true
//call that changes the top of the screen
        GlobalVariables.stack.push(infoComp)
    }

So now the top part changes but the image of the button doesn't.

If I put in comment the calls to the top change and leave only the changes of the boolean variables, the change of the image works fine.

What to do in such a situation?

Bracha

I actually bypassed the problem and just defined the button, I didn't give it a source and on every page that has an instance of the button I set a different source and that's how it works. (on the information page there is a certain definition and on the general page a different definition as I wish) but the question remains the same.