CODEWITHSUNDEEP
pythonkivy
Edv Beq
Edv Beq

Reputation: 1000

Split Screen in Kivy?

I want to create a simple app in Kivy, but I want to split the main display in two sections. The top part will have some buttons and it will stay fixed. However, in the bottom part I want to switch between different screens. Is this possible?

Here is a simplified version:

<home screen>:
        BoxLayout:

               Button:


               Screen: 
                  (Switch between Screen 1, and 2)



<screen 1>

<screen 2>

I would really appreciate some help. Thank you!

Ok, here is my non working example.

.py File:

from kivy.app import App
from kivy.uix.screenmanager import ScreenManager, Screen
from kivy.uix.boxlayout import BoxLayout

class HomeScreen(Screen):
    pass

class Screen1(Screen):
    pass

class Screen2(Screen):
    pass

class SplitScreenApp(App):
    def build(self):

        sm = ScreenManager()
        sm.add_widget(HomeScreen(name='home_screen'))
        sm.add_widget(Screen1(name='screen_one'))
        sm.add_widget(Screen2(name='screen_two'))

        return sm
if __name__ == "__main__":
    SplitScreenApp().run()

.kv File

<HomeScreen>:

    BoxLayout:
        orientation: 'vertical'
        rows: 3

        ScreenManager:
            size_hint_y: 0.8

        Button:
            size_hint_y: 0.1
            on_press:
                root.manager.transition.direction = 'left'
                root.manager.current = 'screen_one'
        Button:
            size_hint_y: 0.1
            on_press:
                root.manager.transition.direction = 'left'
                root.manager.current = 'screen_two'


<Screen1>:

    BoxLayout:
        orientation: 'vertical'
        rows: 1
        Button:
            text: "Screen 1"

<Screen2>:

    BoxLayout:
        orientation: 'vertical'
        rows: 1
        Button:
            text: "Screen 2"

So I expect to see "Screen 1" show first on top of the two Buttons. Then, I can press one of the two in "HomeScreen" and it will switch between "Screen 1" and "Screen 2" on press.

Upvotes: 2

Views: 2714

Answers (3)

Edv Beq
Edv Beq

Reputation: 1000

I ask this a while back - and based on the feedback I received here I got the following code working for me. Perhaps, this will help someone else.

Python File:

from kivy.app import App
from kivy.uix.screenmanager import ScreenManager, Screen
from kivy.uix.boxlayout import BoxLayout

class HomeScreen(BoxLayout):
    pass

class Screen1(Screen):
    pass

class SplitScreenApp(App):
    def build(self):

        return HomeScreen()

if __name__ == "__main__":
    SplitScreenApp().run()

Kivy Code: 

<HomeScreen>:
    name: 'ScreenManager'
    BoxLayout:
        orientation: 'vertical'
        rows: 3

        ScreenManager:
            id: sm
            size_hint_y: 0.8

            Screen1:

            Screen:
                name: "screen_two"
                BoxLayout:
                    orientation: 'vertical'
                    rows: 1
                    Button:
                        text: "Screen 2"
                        on_release: sm.current = 'screen_one'

        Button:
            text: "Screen 1"
            size_hint_y: 0.1
            on_press:
                sm.transition.direction = 'left'
                sm.current = 'screen_one'
        Button:
            text: "Screen 2"
            size_hint_y: 0.1
            on_press:
                sm.transition.direction = 'left'
                sm.current = 'screen_two'

<Screen1>:
    name: "screen_one"
    BoxLayout:
        orientation: 'vertical'
        rows: 1
        Button:
            text: "Screen 1 Out"
            on_release: root.parent.current = 'screen_two'

Thanks again to everybody that is willing to help here.

Upvotes: 1

Ng Oon-Ee
Ng Oon-Ee

Reputation: 1233

You lack a reference to the screenmanager object, and your homescreen should be just another screen under the screenmanager, with the buttons on a separate Layout.

Have you checked out the examples which come with kivy? The 'showcase' one does pretty much exactly what you want.

Upvotes: 1

inclement
inclement

Reputation: 29450

Certainly, just replace Screen with ScreenManager in your example and add whatever Screens you like to it.

If you have a specific problem, post an example with real code demonstrating what you think should work and how it fails.

Upvotes: 3

Related Questions