CODEWITHSUNDEEP
pythonkivykivy-language
gunner47300
gunner47300

Reputation: 11

Kivy: absolute positioning with screen

I created GUI using kivy. I based it on class "Widget". I positioned every item absolutely(coordinates and size). Its not responsive, buy it doesn't have to be. Everything worked fine but then I realized I would need another screen, so i changed class to "Screen" and "ScreenManager". Since I did it, everything is wrong. Previously coordinates (0, 0) were in left bottom, now they are in center. I had image whith specified size, now i can not do this. Is there any soultion to use code I already made, or it must be relative if "Screen" is used?

Previous (working) way:

Python:

class GUI(Widget):
    pass

class UpdaterApp(App):
    def build(self):
        return GUI()

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

kv:

<GUI>:

    Label:
        pos: 340, 660
        text: "IO"
        font_size: 80
    Label:
        pos: 340, 600
        text: "software update"
        font_size: 40
    Image:
        pos: 50, 600
        size: 180, 180
        source: "img/logo.png"

New (not working) way:

Python:

Window.size = (1400, 800)
Window.minimum_width = 1400
Window.minimum_height = 800

class GUI(Screen):
    pass

class NewWindow(Screen):
    pass

class WindowManager(ScreenManager):
    pass

class UpdaterApp(App):
    def build(self):
        wm = WindowManager()
        wm.add_widget(GUI(name="main"))
        wm.add_widget(NewWindow(name="new"))
        wm.current = "main"
        return wm

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

kv:

WindowManager:
    GUI:
    NewWindow:

<GUI>:
    Label:
        pos: 340, 660
        text: "IO"
        font_size: 80
    Label:
        pos: 340, 600
        text: "software update"
        font_size: 40
    Image:
        pos: 50, 600
        size: 180, 180
        source: "img/logo.png"

<NewWindow>:
    Button:
        text: "Go Back"

Upvotes: 1

Views: 968

Answers (1)

John Anderson
John Anderson

Reputation: 38962

Yes, you must use relative coordinates since the Screen is a RelativeLayout (See the documentation). Also, when using a Layout, children Widgets get the default size_hint of (1,1), which means that they will fill their parent. See the Widget documentation, and take note of the section discussing default values. If you want to use the size property, you must set size_hint to None, None (size_hint takes priority of size in the Layout container classes). Here is a modified version of your kv that demonstrates this:

<GUI>:
    Label:
        pos: 340, 600
        text: "IO"
        font_size: 80
        size_hint: None, None
        size: self.texture_size  # set Label size just big enough to hold text
    Label:
        pos: 340, 600
        text: "software update"
        font_size: 40
        size_hint: None, None
        size: self.texture_size  # set Label size just big enough to hold text
    Image:
        pos: 50,600
        size_hint: None, None
        size: 180, 180
        source: "img/logo.png"

Upvotes: 1

Related Questions