How to connect login page to home screen?

53 Views Asked by At

I wrote the code separately for the start page, sign up page and login page. Afterwards I wrote the code for the navigation bar. They can run separately, but when I tried to put them together it ended up showing a blank page after I press login button on the login page.

What I expect is the login button on the login page will jump to the home page with navigation bar.

Here is my code:

main.py:

from kivy.core.text import LabelBase
from kivy.uix.screenmanager import ScreenManager, Screen
from kivymd.app import MDApp
from kivy.lang import Builder
from kivy.core.window import Window
from kivymd.uix.floatlayout import MDFloatLayout
from kivymd.uix.behaviors import FakeRectangularElevationBehavior
from kivy.factory import Factory
from kivy.utils import get_color_from_hex
from kivy.uix.boxlayout import BoxLayout
from kivy.uix.button import Button
from kivy.uix.textinput import TextInput
import requests

Window.size = (310, 580)

class HomeScreen(Screen):
    def __init__(self, **kwargs):
        super(HomeScreen, self).__init__(**kwargs)
        self.add_widget(NavBarScreen())

    pass
class Myapp(MDApp):
    def build(self):
        screen_manager = ScreenManager()
        screen_manager.add_widget(Builder.load_file("start.kv"))
        screen_manager.add_widget(Builder.load_file("signup.kv"))
        screen_manager.add_widget(Builder.load_file("login.kv"))
        home_screen = HomeScreen(name="home")
        home_screen.add_widget(NavBarScreen())

        screen_manager.add_widget(home_screen)
        return screen_manager


    def change_color(self, instance):
        if instance in self.root.ids.values():
            current_id = list(self.root.ids.keys())[list(self.root.ids.values()).index(instance)]
            for i in range(4):
                if f"nav_icon{i}" == current_id:
                    self.root.ids[f"nav_icon{i + 1}"].text_color = 1, 0, 0, 1
                else:
                    self.root.ids[f"nav_icon{i + 1}"].text_color = 0, 0, 0, 1

    def goto_home_screen(self):
        self.root.current = "home"


if __name__ == "__main__":
    LabelBase.register(name="Poppins-Medium", fn_regular=r"C:\Users\User\Desktop\FONT\Poppins\Poppins-Medium.ttf")
    LabelBase.register(name="Poppins-SemiBold", fn_regular=r"C:\Users\User\Desktop\FONT\Poppins\Poppins-SemiBold.ttf")

    Factory.register("NavBarScreen", cls=NavBarScreen)
    Myapp().run()

main.kv

<HomeScreen>:
    BoxLayout:
        orientation: "vertical"

        MDToolbar:
            title: "Home"
            md_bg_color: app.theme_cls.primary_color
            left_action_items: [["menu", lambda x: app.root.toggle_nav_drawer()]]

home.kv:

<HomeScreen>:
    BoxLayout:
        orientation: "vertical"

        MDToolbar:
            title: "Home"
            md_bg_color: app.theme_cls.primary_color
            left_action_items: [["menu", lambda x: app.root.toggle_nav_drawer()]]

        MDBottomNavigation:
            panel_color: rgba(180, 187, 114, 255)
            text_color_active: rgba(246, 250, 247, 255)

            MDBottomNavigationItem:
                name: "screen 1"
                text: "Records"
                font_name: "Poppins-Medium"
                icon: "leaf"
                icon_color: rgba(231, 234, 168, 255)
                MDLabel:
                    text: "Here is chats!"
                    halign: "center"

            MDBottomNavigationItem:
                name: "screen 2"
                text: "Scan"
                font_name: "Poppins-Medium"
                icon: "image-plus"
                MDLabel:
                    text: "Here is coffee!"
                    font_name: "Poppins-Medium"
                    halign: "center"
            MDBottomNavigationItem:
                name: "screen 3"
                text: "Settings"
                font_name: "Poppins-Medium"
                icon: "cog"
                MDLabel:
                    text: "Here is Python!"
                    font_name: "Poppins-Medium"
                    halign: "center"
            MDBottomNavigationItem:
                name: "screen 4"
                text: "About"
                font_name: "Poppins-Medium"
                icon: "information"
                MDLabel:
                    text: "Here is Python!"
                    halign: "center"

**start.kv:**
MDScreen:
    name: "main"
    MDFloatLayout:
        md_bg_color:rgba(246, 250, 247, 255)
        Image:
            source: r"C:\Users\User\Desktop\FONT\PythoScan.png"
            pos_hint: {"center_x": .11, "center_y": .95}

        Image:
            source: r"C:\Users\User\Desktop\FONT\Pytho.png"
            size_hint:.8, .8
            pos_hint: {"center_x": .5, "center_y": .65}

        MDLabel:
            text: "Hello!"
            font_name: "Poppins-SemiBold"
            font_size: "23sp"
            pos_hint: {"center_y": .38}
            halign: "center"
            color: rgba (48, 62, 39, 255)

        MDLabel:
            text: "Best Place To Write Life Stories"
            font_name: "Poppins-SemiBold"
            font_size: "13sp"
            size_hint_x: .85
            pos_hint: {"center_x": .5, "center_y": .3}
            halign: "center"
            color: rgba(180, 187, 114, 255)

        Button:
            text: "LOGIN"
            size_hint: .66, .065
            pos_hint: {"center_x": .5, "center_y":.18}
            background_color: 0, 0, 0, 0
            font_name: "Poppins-SemiBold"
            on_release:
                root.manager.transition.direction = "left"
                root.manager.current = "login"
            canvas.before:
                Color:
                    rgb: rgba(48, 62, 39, 255)
                RoundedRectangle:
                    size: self.size
                    pos: self.pos
                    radius: [5]

        Button:
            text: "SIGNUP"
            size_hint: .66, .065
            pos_hint: {"center_x": .5, "center_y":.09}
            background_color: 0, 0, 0, 0
            font_name: "Poppins-SemiBold"
            color: rgba(48, 62, 39, 255)
            on_release:
                root.manager.transition.direction= "left"
                root.manager.current= "signup"
            canvas.before:
                Color:
                    rgb: rgba(48, 62, 39, 255)
                Line:
                    width: 1.2
                    rounded_rectangle: self.x, self.y, self.width, self.height, 5, 5, 5, 5, 100

login.kv:

MDScreen:
    name: "login"
    MDFloatLayout:
        md_bg_color:rgba(246, 250, 247, 255)
        Image:
            source: r"C:\Users\User\Desktop\FONT\PythoFarmer.png"
            pos_hint: {"center_x": 0.8, "center_y": .1}
        MDIconButton:
            icon: "arrow-left"
            pos_hint: {"center_y": .95}
            user_font_size: "30sp"
            theme_text_color: "Custom"
            text_color: rgba(26, 24, 58, 255)
            on_release:
                root.manager.transition.direction = "right"
                root.manager.current = "home"

        MDLabel:
            text: "Welcome Back!"
            font_name: "Poppins-SemiBold"
            font_size: "26sp"
            pos_hint: {"center_x": .6,"center_y": .85}
            color: rgba(48, 62, 39, 255)

        MDLabel:
            text: "Sign in to continue"
            font_name: "Poppins-SemiBold"
            font_size: "18sp"
            pos_hint: {"center_x": .6, "center_y": .79}
            color: rgba(180, 187, 114, 255)

        MDFloatLayout:
            size_hint: .7, .07
            pos_hint: {"center_x":.5, "center_y":.63}
            TextInput:
                hint_text: "Username"
                font_name: "Poppins-Medium"
                size_hint_y: .75
                pos_hint: {"center_x":.52, "center_y":.5}
                background_color: 1, 1, 1, 0
                foreground_color: rgba(0, 0, 59, 255)
                cursor_color: rgba(0, 0, 59, 255)
                font_size: "14sp"
                cursor_width: "2sp"
                multiline: False

            MDFloatLayout:
                pos_hint: {"center_x": .5, "center_y": 0}
                size_hint_y: .03
                md_bg_color: rgba(178, 178, 178, 255)

        MDFloatLayout:
            size_hint: .7, .07
            pos_hint: {"center_x":.5, "center_y":.52}
            TextInput:
                hint_text: "Password"
                font_name: "Poppins-Medium"
                size_hint_y: .75
                pos_hint: {"center_x":.52, "center_y":.48}
                background_color: 1, 1, 1, 0
                foreground_color: rgba(0, 0, 59, 255)
                cursor_color: rgba(0, 0, 59, 255)
                font_size: "14sp"
                cursor_width: "2sp"
                multiline: False
                password: True

            MDFloatLayout:
                pos_hint: {"center_x": .5, "center_y": 0}
                size_hint_y: .03
                md_bg_color: rgba(178, 178, 178, 255)
        Button:
            text: "LOGIN"
            size_hint: .66, .065
            pos_hint: {"center_x": .5, "center_y":.34}
            background_color: 0, 0, 0, 0
            font_name: "Poppins-SemiBold"
            on_release:
                root.manager.transition.direction= "left"
                root.manager.current= "home"

            canvas.before:
                Color:
                    rgb: rgba(48, 62, 39)
                RoundedRectangle:
                    size: self.size
                    pos: self.pos
                    radius: [5]
        MDTextButton:
            text: "Forgot Password?"
            pos_hint: {"center_x":.5, "center_y":.46}
            color: rgba(48, 62, 39, 200)
            font_size: "12sp"
            font_name: "Poppins-Medium"

        MDLabel:
            text: "Don't have an account? "
            font_name: "Poppins-Medium"
            font_size: "11sp"
            pos_hint: {"center_x":.72, "center_y":.29}
            color: rgba(180, 187, 114, 255)

        MDTextButton:
            text: "Sign up"
            font_name: "Poppins-SemiBold"
            font_size: "11sp"
            color: rgba(180, 187, 114, 250)
            pos_hint: {"center_x":.72, "center_y":.29}
            on_release:
                root.manager.transition.direction = "left"
                root.manager.current = "signup"

signup.kv:

MDScreen:
    name: "signup"
    MDFloatLayout:
        md_bg_color:rgba(246, 250, 247, 255)
        Image:
            source: r"C:\Users\User\Desktop\FONT\Pytho2farmers.zip"
            pos_hint: {"center_x": 0.75, "center_y": .15}
        MDIconButton:
            icon: "arrow-left"
            pos_hint: {"center_y": .95}
            user_font_size: "30sp"
            theme_text_color: "Custom"
            text_color: rgba(26, 24, 58, 255)
            on_release:
                root.manager.transition.direction = "right"
                root.manager.current = "main"

        MDLabel:
            text: "Hi!"
            font_name: "Poppins-SemiBold"
            font_size: "26sp"
            pos_hint: {"center_x": .6,"center_y": .85}
            color: rgba(48, 62, 39, 255)

        MDLabel:
            text: "Create an account"
            font_name: "Poppins-SemiBold"
            font_size: "18sp"
            pos_hint: {"center_x": .6, "center_y": .79}
            color: rgba(180, 187, 114, 255)

        MDFloatLayout:
            size_hint: .7, .07
            pos_hint: {"center_x":.5, "center_y":.68}
            TextInput:
                hint_text: "Username"
                font_name: "Poppins-Medium"
                size_hint_y: .75
                pos_hint: {"center_x":.5, "center_y":.5}
                background_color: 1, 1, 1, 0
                foreground_color: rgba(0, 0, 59, 255)
                cursor_color: rgba(0, 0, 59, 255)
                font_size: "14sp"
                cursor_width: "2sp"
                multiline: False

            MDFloatLayout:
                pos_hint: {"center_x": .5, "center_y": 0}
                size_hint_y: .03
                md_bg_color: rgba(178, 178, 178, 255)

        MDFloatLayout:
            size_hint: .7, .07
            pos_hint: {"center_x":.5, "center_y":.57}
            TextInput:
                hint_text: "Farm ID"
                font_name: "Poppins-Medium"
                size_hint_y: .75
                pos_hint: {"center_x":.5, "center_y":.5}
                background_color: 1, 1, 1, 0
                foreground_color: rgba(0, 0, 59, 255)
                cursor_color: rgba(0, 0, 59, 255)
                font_size: "14sp"
                cursor_width: "2sp"
                multiline: False

            MDFloatLayout:
                pos_hint: {"center_x": .5, "center_y": 0}
                size_hint_y: .03
                md_bg_color: rgba(178, 178, 178, 255)

        MDFloatLayout:
            size_hint: .7, .07
            pos_hint: {"center_x":.5, "center_y":.46}
            TextInput:
                hint_text: "Password"
                font_name: "Poppins-Medium"
                size_hint_y: .75
                pos_hint: {"center_x":.5, "center_y":.5}
                background_color: 1, 1, 1, 0
                foreground_color: rgba(0, 0, 59, 255)
                cursor_color: rgba(0, 0, 59, 255)
                font_size: "14sp"
                cursor_width: "2sp"
                multiline: False
                password: True

            MDFloatLayout:
                pos_hint: {"center_x": .5, "center_y": 0}
                size_hint_y: .03
                md_bg_color: rgba(178, 178, 178, 255)


        Button:
            text: "CREATE"
            size_hint: .66, .065
            pos_hint: {"center_x": .5, "center_y":.34}
            background_color: 0, 0, 0, 0
            font_name: "Poppins-SemiBold"
            on_release:
                root.manager.transition.direction= "left"
                root.manager.current= "login"
            canvas.before:
                Color:
                    rgb: rgba(48, 62, 39)
                RoundedRectangle:
                    size: self.size
                    pos: self.pos
                    radius: [5]

what i expect is the login button on the login page will jump to the home page with navigation bar but it ended up to show a blank page after i press login button on the login page.

1

There are 1 best solutions below

0
EGarbus On

Here are a few things that I see that look problematic:

  1. You have defined HomeScreen kv rules in main.kv and home.kv
  2. Not sure what you are doing with NavBarScreen. It is not defined anywhere, but you have registered it.
  3. NavBarScreen is added in the __init__() of HomeScreen and the MDApp.build(), assuming NavBarScreen is a screen it should be added to the ScreenManager.
  4. I recommend you create kv rules for Signup and login screens, much like you have done for HomeScreen.
  5. home.kv is not being loaded, main.kv is not being loaded.
  6. In home.kv you have defined a root widget, in build you are using ScreenManager as the root widget.
  7. just another suggestion, you can define the ScreenManager and all of the Screens in kv, and put the screennames under the Screen instances. I find this makes code maintenance easier as all of the screen names are together in one place.

That should be enough to help you make more progress. Good Luck!