Kivy: Changing Image Source On Screen

After much headbanging, I've created an app that opens the FileChooser and picks an image. A function will then transform the image and change it on the screen. < FirstScreen &g

Solution 1:

Every time you use some_obj = SomClass() you are creating a new object, in your case that is what you are doing, you are creating a new ThirdScreen different from the one shown by that you do not observe the image, the solution is that you have to access to the initial object using the ScreenManager and name screen.

from kivy.lang import Builder
from kivy.app import App
from kivy.uix.screenmanager import ScreenManager, Screen
from kivy.properties import ObjectProperty, StringProperty


Builder.load_string("""
<FirstScreen>:
    BoxLayout:
        orientation: "horizontal"
        Label:
            id: first_screen_label
            text: "Hi, I'm the home page"
        BoxLayout:
            orientation: "vertical"
            Button:
                text: "Okay!"
                on_press: root.manager.current = '_second_screen_'
            Button:
                text: "Cancel!"
                on_press: app.stop()

<SecondScreen>:
    id: file_chooser
    BoxLayout:
        id: file_chooser_box_layout
        orientation: "horizontal"
        Button
            text: "Open"
            on_press: 
                root.callback_image_and_other_stuff(file_chooser_list_view.selection)
        FileChooserListView:
            id: file_chooser_list_view

<ThirdScreen>:
    BoxLayout:
        orientation: "vertical"
        id: third_screen
        Label:
            id: main_title
            text: "Upload"
            size_hint: (1, 0.1)
        Image:
            id: main_image
            source: root.img
            size_hint: (1, 0.75)
        BoxLayout:
            orientation: "horizontal"
            padding: 10
            size_hint: (1, 0.15)
            Button:
                text: "Okay"
                size_hint: (0.5, 1)
                on_press: image_viewer.image_accepted_by_user(filechooser.selection)
            Button:
                text: "Cancel"
                size_hint: (0.5, 1) 
                on_press: root.manager.current = '_first_screen_'   
""")

class FirstScreen(Screen):
    pass

class SecondScreen(Screen):
    def callback_image_and_other_stuff(self, new_image_address):
        if new_image_address:
            third_screen = self.manager.get_screen("_third_screen_")
            # do other stuff here also, then pass new_image_address along
            new_image_address = new_image_address[0].replace("\\", "/")
            third_screen.callback_image(new_image_address)

class ThirdScreen(Screen):
    img = ObjectProperty(None)

    def __init__(self, **kwargs):
        super(Screen, self).__init__(**kwargs)

    def callback_image(self, new_image_address):
        sm.current = "_third_screen_"
        self.img = new_image_address
        self.ids.main_image.source = self.img

        print(self.img)

# Create the screen manager
sm = ScreenManager() # Problem?
sm.add_widget(FirstScreen(name='_first_screen_'))
sm.add_widget(SecondScreen(name='_second_screen_'))
sm.add_widget(ThirdScreen(name='_third_screen_'))

class MyApp(App):
    def build(self):
        return sm

if __name__ == '__main__':
    MyApp().run()