kivymd / KivyMD

KivyMD is a collection of Material Design compliant widgets for use with Kivy, a framework for cross-platform, touch-enabled graphical applications. https://youtube.com/c/KivyMD https://twitter.com/KivyMD https://habr.com/ru/users/kivymd https://stackoverflow.com/tags/kivymd
https://kivymd.readthedocs.io
MIT License
2.14k stars 655 forks source link

MDButton animation incomplete when changing screens. #1671

Open RobertFlatt opened 2 months ago

RobertFlatt commented 2 months ago

Description of the Bug

When a button is used to switch screens, on returning to the first screen the button is seen as still elevated.

Seems to me like this is the expected behavior of Kivy (because the button is no longer visible it does not see the change in elevation event) but not of KivyMD.

It is possible this is an enhancement request. Since only the programmer knows the use of a button, the resolution may be to provide an api to allow the programmer to immediately reset the button elevation. A programmer might for example call this api on_release. Simply setting button.elevation = 0 from on_release does not have any effect.

In the example below, moving the cursor resets the elevation (presumably related to hover). This is not always the case, for example in tabs content, however this stickiness may be related to #1663 .

Code and Logs

from kivymd.app import MDApp
from kivy.lang import Builder

from kivymd.uix.screen import MDScreen
from kivymd.uix.screenmanager import MDScreenManager

Builder.load_string("""
<Screen1>:
    md_bg_color: self.theme_cls.backgroundColor
    MDBoxLayout:
        orientation:'vertical'
        MDLabel:
            text: 'Press "Go to Screen 2" Button'
            halign: "center"
        MDButton:
            on_release: root.manager.current = 'Two'
            pos_hint: {"center_x": .5, "center_y": .5}
            size_hint_y:0.5
            MDButtonText
                text: 'Go to Screen 2'
        MDLabel:

<Screen2>:
    md_bg_color: self.theme_cls.backgroundColor
    MDBoxLayout:
        orientation:'vertical'
        MDLabel:
            text: 'Press "Go to Screen 1" Button\\nThen look at the elevation of the Button in Screen 1\\nBEFORE moving the cursor,\\nTHEN move the cursor.'
            halign: "center"
        MDButton:
            style: "elevated"
            pos_hint: {"center_x": .5, "center_y": .5}
            on_release: root.manager.current = 'One'
            MDButtonText
                text: 'Go to Screen 1'
        MDLabel:
            size_hint_y:0.2
""")

class Screen1(MDScreen):
    pass

class Screen2(MDScreen):
    pass

class TestApp(MDApp):

    def build(self):
        sm = MDScreenManager()
        sm.add_widget(Screen1(name='One'))
        sm.add_widget(Screen2(name='Two'))
        return sm

TestApp().run()

Screenshots

Versions

HeaTTheatR commented 2 months ago

I have not found any bugs in this code yet. Maybe you have screenshots that show the bug?

RobertFlatt commented 2 months ago

Perhaps I don't understand the expected behavior. To try to be clearer I added a "For comparison" button to the first screen (code below) as a reference. The screen shot is the first screen on return from the second screen, and without moving the cursor. The Comparison button is a different elevation to the "Go to screen 2" button.

Screenshot 2024-04-12 134438

from kivymd.app import MDApp
from kivy.lang import Builder

from kivymd.uix.screen import MDScreen
from kivymd.uix.screenmanager import MDScreenManager

Builder.load_string("""
<Screen1>:
    md_bg_color: self.theme_cls.backgroundColor
    MDBoxLayout:
        orientation:'vertical'
        MDLabel:
            text: 'Press "Go to Screen 2" Button'
            halign: "center"
        MDButton:
            on_release: root.manager.current = 'Two'
            pos_hint: {"center_x": .5, "center_y": .5}
            size_hint_y:0.5
            MDButtonText
                text: 'Go to Screen 2'
        MDButton:
            pos_hint: {"center_x": .5, "center_y": .5}
            size_hint_y:0.5
            MDButtonText
                text: 'For comparison, no action'
        MDLabel:

<Screen2>:
    md_bg_color: self.theme_cls.backgroundColor
    MDBoxLayout:
        orientation:'vertical'
        MDLabel:
            text: 'Press "Go to Screen 1" Button\\nThen look at the elevation of the Button in Screen 1\\nBEFORE moving the cursor,\\nTHEN move the cursor.'
            halign: "center"
        MDButton:
            style: "elevated"
            pos_hint: {"center_x": .5, "center_y": .5}
            on_release: root.manager.current = 'One'
            MDButtonText
                text: 'Go to Screen 1'
        MDLabel:
            size_hint_y:0.2
""")

class Screen1(MDScreen):
    pass

class Screen2(MDScreen):
    pass

class TestApp(MDApp):

    def build(self):
        sm = MDScreenManager()
        sm.add_widget(Screen1(name='One'))
        sm.add_widget(Screen2(name='Two'))
        return sm

TestApp().run()
HeaTTheatR commented 2 months ago

Now I understand what the problem is, thanks