Search code examples
pythonkivykivy-languagekivymd

Submit Button in Kivy


I have already made a login button that takes the user to the main homepage screen. However, I am designing a registration form and I am struggling with being making a submit button that clears all the textfield and creates a pop up notifying the user that they have submitted. I don't need it to be functional as of yet I just need to have something to show what the process will eventually look like.

I'm really new to Kivy and KivyMD and so I'm sure this is quite an easy thing to do, but I am struggling with it - any help would be hugely appreciated.


from kivy import Config
from kivy.app import App
from kivy.lang import Builder
from kivy.properties import StringProperty
from kivy.uix.image import Image
from kivy.uix.screenmanager import ScreenManager, Screen, FadeTransition
from kivymd.app import MDApp
from kivy.uix.boxlayout import BoxLayout
from kivymd.theming import ThemableBehavior
from kivymd.uix.navigationdrawer import MDNavigationLayout, MDNavigationDrawer
from kivymd.uix.list import MDList, OneLineAvatarListItem, ILeftBody
from kivy.properties import ObjectProperty
from kivy.uix.widget import Widget


Config.set('input', 'mouse', 'mouse,disable_multitouch')


class DrawerList(ThemableBehavior, MDList, Screen):
    pass


class NavLayout(MDNavigationLayout):
    pass


class Login(Screen):
    nav_drawer = ObjectProperty()


class Nav(Screen):
    Login = ObjectProperty()
    ScreenManager = ObjectProperty


class Homepage(Screen):
    Login = ObjectProperty()
    nav_drawer = ObjectProperty()


class AddNewCustomer(Screen):
    nav_drawer = ObjectProperty()


class AddNewStaff(Screen):
    pass


class ScreenManager(ScreenManager):
    Login = ObjectProperty()


class ContentNavigationDrawer(BoxLayout):
    pass


class MainApp(MDApp):
    def build(self):
        # Window.maximize()
        # self.theme_cls.theme_style = "Light"
        # self.theme_cls.primary_hue = "900"
        login = Builder.load_file("login.kv")
        return login




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


ScreenManager:
    Login:
    Homepage:
    AddNewCustomer:
    Nav:
    DrawerList:

<Login>:
    name: "login"
    MDCard:
        size_hint: None, None
        size: 700, 800
        pos_hint: {"center_x": 0.5, "center_y": 0.5}
        elevation: 10
        padding: 25
        spacing: 25
        orientation: 'vertical'

        Image:
            source: 'images/asteria.png'
            size: 100, 200

        MDLabel:
            id: login
            font_size: 40
            halign: 'center'
            size_hint_y: None
            height: self.texture_size[1]
            padding_y: 15

        MDTextFieldRound:
            id: user
            hint_text: "username"
            icon_right: "account"
            size_hint_x: None
            width: 200
            font_size: 18
            pos_hint: {"center_x": 0.5}

        MDTextFieldRound:
            id: password
            hint_text: "password"
            icon_right: "eye-off"
            size_hint_x: None
            width: 200
            font_size: 18
            pos_hint: {"center_x": 0.5}
            password: True

        MDRoundFlatButton:
            text: "LOGIN"
            font_size: 12
            pos_hint: {"center_x": 0.5}

            on_release:
                root.manager.current = "homepage"
                root.manager.transition.direction = "left"

        MDRoundFlatButton:
            text: "CLEAR"
            font_size: 12
            pos_hint: {"center_x": 0.5}
            on_press: app.clear()


        Widget:
            size_hint_y: None
            height: 50


<Nav>:
    ScrollView:
        MDList:
            OneLineListItem:
                text: "Add New Customer"

                on_release:
                    root.nav_drawer.set_state("close")
                    root.screen_manager.current = "addNewCustomer"
                    root.screen_manager.transition.direction = "right"





            OneLineListItem:
                text: "Add New Staff"
                font_size: 15
                halign: "center"
                on_release:
                    root.nav_drawer.set_state("close")
                    root.screen_manager.current = "addNewStaff"

            OneLineListItem:
                text: "Case List"
                font_size: 15
                halign: "center"
                on_release:
                    root.nav_drawer.set_state("close")
                    root.screen_manager.current = "caseList"


            OneLineListItem:
                text: "Create Case"
                font_size: 15
                halign: "center"
                on_release:
                    root.nav_drawer.set_state("close")
                    root.screen_manager.transition.direction = "left"
                    root.screen_manager.current = "Create Case"


            OneLineListItem:
                text: "Log Out"
                font_size: 15
                halign: "center"
                on_release:
                    root.nav_drawer.set_state("close")

                    root.manager.current = "login"
                    root.manager.transition.direction = "right"



<Homepage>:
    name: "homepage"
    Screen:

        MDNavigationLayout:
            ScreenManager:
                id: screen_manager
                Screen:
                    name: "Homepage"
                    MDLabel:
                        text: "Welcome Home"
                        halign: "center"


                Screen:
                    name: "addNewCustomer"
                    MDLabel:
                        text: "Add New customer"
                        halign: "center"

                Screen:
                    name: "addNewStaff"
                    MDLabel:
                        text: "Add New Staff"
                        halign: "center"

                Screen:
                    name: "caseList"
                    MDLabel:
                        text: "Case List"
                        halign: "center"

                Screen:
                    name: "casePool"
                    MDLabel:
                        text: "Case Pool"
                        halign: "center"

                Screen:
                    name: "Create Case"


                    MDLabel:
                        text: "Case Title"
                        font_size: 15
                        size_hint_x: None
                        bold: True
                        color: 0.204, 0.204, 0.204, 1
                        pos_hint: {"center_y": 0.875, "center_x": 0.115}



                    MDTextFieldRound:
                        id: CaseTitle
                        hint_text: "Info Here"
                        icon_right: "Case Title"
                        size_hint_x: None
                        width: 275
                        font_size: 15
                        pos_hint: {"top": 0.863, "center_x": 0.155}



                    MDLabel:
                        text: "Customer"
                        font_size: 15
                        size_hint_x: None
                        bold: True
                        color: 0.204, 0.204, 0.204, 1
                        pos_hint: {"center_y": 0.791, "center_x": 0.115}



                    MDTextFieldRound:
                        id: Customer
                        hint_text: "Info Here"
                        mode:"rectangle"
                        icon_right: "Customer"
                        size_hint_x: None
                        width: 275
                        font_size: 14
                        pos_hint: {"top": 0.779, "center_x": 0.155}


                    MDLabel:
                        text: "Customer Forename"
                        font_size: 15
                        size_hint_x: None
                        multiline: False
                        bold: True
                        color: 0.204, 0.204, 0.204, 1
                        pos_hint: {"center_y": 0.707, "center_x": 0.115}


                    MDTextFieldRound:
                        id: Customer Forename
                        hint_text: "Info here"
                        mode:"rectangle"
                        icon_right: "Customer"
                        size_hint_x: None
                        width: 137.5
                        font_size: 14
                        pos_hint: {"top": 0.687, "center_x": 0.121}

                    MDLabel:
                        text: "Customer Surname"
                        font_size: 15
                        size_hint_x: None
                        multiline: False
                        bold: True
                        color: 0.204, 0.204, 0.204, 1
                        pos_hint: {"center_y": 0.707, "center_x": 0.210}


                    MDTextFieldRound:
                        id: Customer Forename
                        hint_text: "Info Here"
                        mode:"rectangle"
                        icon_right: "Customer"
                        size_hint_x: None
                        width: 137.5
                        font_size: 14
                        pos_hint: {"top": 0.687, "center_x": 0.210}

                    MDLabel:
                        text: "Alternative email"
                        font_size: 15
                        size_hint_x: None
                        multiline: False
                        bold: True
                        color: 0.204, 0.204, 0.204, 1
                        pos_hint: {"center_y": 0.620, "center_x": 0.115}


                    MDTextFieldRound:
                        id: Alternative Email
                        hint_text: "Info Here"
                        mode:"rectangle"
                        size_hint_x: None
                        width: 275
                        font_size: 15
                        pos_hint: {"top": 0.600, "center_x": 0.155}

                    MDLabel:
                        text: "Alternative Phone"
                        font_size: 15
                        size_hint_x: None
                        multiline: False
                        bold: True
                        color: 0.204, 0.204, 0.204, 1
                        pos_hint: {"center_y": 0.533, "center_x": 0.115}


                    MDTextFieldRound:
                        id: Alternative phone
                        hint_text: "Info Here"
                        mode:"rectangle"
                        size_hint_x: None
                        width: 275
                        font_size: 15
                        pos_hint: {"top": 0.513, "center_x": 0.155}



                    MDLabel:
                        text: "Case Source"
                        font_size: 15
                        size_hint_x: None
                        multiline: False
                        bold: True
                        color: 0.204, 0.204, 0.204, 1
                        pos_hint: {"center_y": 0.449, "center_x": 0.115}

                    MDTextFieldRound:
                        id: Case Source
                        hint_text: "Info Here"
                        mode:"rectangle"
                        size_hint_x: None
                        width: 275
                        font_size: 15
                        pos_hint: {"top": 0.437, "center_x": 0.155}






                    MDLabel:
                        text: "Case Source"
                        font_size: 15
                        size_hint_x: None
                        multiline: False
                        bold: True
                        color: 0.204, 0.204, 0.204, 1
                        pos_hint: {"center_y": 0.449, "center_x": 0.115}

                    MDTextFieldRound:
                        id: Case Source
                        hint_text: "Info Here"
                        mode:"rectangle"
                        size_hint_x: None
                        width: 275
                        font_size: 15
                        pos_hint: {"top": 0.437, "center_x": 0.155}





                    MDLabel:
                        text: "Case Priority"
                        font_size: 15
                        size_hint_x: None
                        multiline: False
                        bold: True
                        color: 0.204, 0.204, 0.204, 1
                        pos_hint: {"center_y": 0.365, "center_x": 0.115}

                    MDTextFieldRound:
                        id: Case Priority
                        hint_text: "Info Here"
                        mode:"rectangle"
                        size_hint_x: None
                        width: 275
                        font_size: 15
                        pos_hint: {"top": 0.353, "center_x": 0.155}




                    MDLabel:
                        text: "Case Category"
                        font_size: 15
                        size_hint_x: None
                        multiline: False
                        bold: True
                        color: 0.204, 0.204, 0.204, 1
                        pos_hint: {"center_y": 0.281, "center_x": 0.115}

                    MDTextFieldRound:
                        id: Case Category
                        hint_text: "Info Here"
                        mode:"rectangle"
                        size_hint_x: None
                        width: 275
                        font_size: 15
                        pos_hint: {"top": 0.269, "center_x": 0.155}






                    MDLabel:
                        text: "Case Description"
                        font_size: 15
                        size_hint_x: None
                        bold: True
                        color: 0.204, 0.204, 0.204, 1
                        pos_hint: {"center_y": 0.883, "center_x": 0.360}


                    MDTextFieldRound:
                        id: CaseDescription
                        hint_text: "Info Here"
                        icon_right: "Case Title"
                        size_hint_x: None
                        width: 275
                        font_size: 15
                        pos_hint: {"top": 0.863, "center_x": 0.400}







                    MDLabel:
                        text: "Possible Cases"
                        font_size: 15
                        size_hint_x: None
                        bold: True
                        color: 0.204, 0.204, 0.204, 1
                        pos_hint: {"center_y": 0.799, "center_x": 0.360}



                    MDTextFieldRound:
                        id: PossibleCases
                        hint_text: "Info Here"
                        icon_right: "Case Title"
                        size_hint_x: None
                        width: 275
                        font_size: 15
                        pos_hint: {"top": 0.780, "center_x": 0.400}







                    MDLabel:
                        text: "Knowledge Helper"
                        font_size: 15
                        size_hint_x: None
                        bold: True
                        color: 0.204, 0.204, 0.204, 1
                        pos_hint: {"center_y": 0.715, "center_x": 0.360}



                    MDTextFieldRound:
                        id: KnowledgeHelper
                        hint_text: "Info Here"
                        icon_right: "Case Title"
                        size_hint_x: None
                        width: 275
                        font_size: 15
                        pos_hint: {"top": 0.697, "center_x": 0.400}

                    MDRoundFlatButton:
                        text: "Submit"
                        font_size: 12
                        pos_hint: {"center_y": 0.400,"center_x": 0.5}

                        on_release:


















        BoxLayout:
            orientation: 'vertical'
            MDToolbar:
                title: 'Navigation'
                left_action_items: [['menu', lambda x: nav_drawer.set_state('open')]]
                right_action_items: [["images/asteria.png", lambda x: None]]


                elevation:5
            Widget:


        MDNavigationDrawer:
            id: nav_drawer
            Nav:
                screen_manager: screen_manager
                nav_drawer: nav_drawer
                manager: root.manager


Solution

  • In your kv, just call a method that does the Popup.

    Define the method in your Homepage class:

    class Homepage(Screen):
        Login = ObjectProperty()
        nav_drawer = ObjectProperty()
    
        def submit(self):
            Popup(title='Submitted', content=Label(text='submitted'), size_hint=(0.5, 0.5)).open()
            sm = self.ids.screen_manager
            scr = sm.get_screen('Create Case')
            for child in scr.children:
                if isinstance(child, TextInput):
                    child.text = ''
    

    and call it from kv:

                    MDRoundFlatButton:
                        text: "Submit"
                        font_size: 12
                        pos_hint: {"center_y": 0.400,"center_x": 0.5}
                        on_release: root.submit()