Customizing Popup Screen in Kivy 1.10.0

Question

I'm currently trying to create a customized MessageBox in Python 3.6 using Kivy 1.10.0. I want to use it first as a MessageBox for error message when user entered incorrect username or password. I'm getting an attribute error whenever I call the open function from CalcPopUp class using the nextScreen function from CalcRoot class.

This is the codes that I have:

class CalcRoot(BoxLayout):

def __init__(self,**kwargs):
    super(CalcRoot,self).__init__(**kwargs)
    self.calc_popup = CalcPopUp(**kwargs)

def nextScreen(self, next_screen):
    #I have some conditions inside this function which works fine
    CalcPopUp.open(self, "Incorrect Login", True)`

class CalcPopUp(Popup):

popup_message = ObjectProperty()
popup_button = ObjectProperty()

def __init__(self, *args, **kwargs):
    super(CalcPopUp,self).__init__(*args, **kwargs)

def open(self, app_message, with_button=True):

    #if user selected the button attribute as true show button else remove
    if with_button:
        if self.popup_button in self.content.children:
            self.content.remove_widget(self.popup_button)
            # if answer is wrong, display button if not visible
    else:
        if self.popup_button not in self.content.children:
            self.content.add_widget(self.popup_button)

    #display text message
    self.message.text = app_message

    #display pop up
    super(CalcPopUp, self).open()

This is the error that I'm getting:

AttributeError: 'CalcRoot' object has no attribute 'popup_button'

This is the content of the kivy file associated to my screenpop:

<CalcPopUp>:
size_hint: .8, .4
title: "Message"
title_size: root.height *.05
auto_dismiss: False
separator_color: COLOR("#fcfc02") #yellow
popup_button: popup_button
popup_message: popup_message

BoxLayout:
    orientation: 'horizontal'
    padding: root.width * .02, root.height * .02
    spacing: min(root.height, root.width) * .02
    Label:
        id: popup_message
        text: ""
        halign: 'left'
        font_size: root.height / 10
        center_y: .5
        markup: True
    Button:
        id: popup_button
        text: 'Ok'
        size_hint: 1, None
        height: root.height / 20
        on_release: root.dismiss()

Answer 1

Here's what I did:

First of all, remove lines 7 and 8 in the .kv file. I'm not sure whether there is an indentation error in your original post, but here's how the .kv file should look now:

<CalcPopUp>:
    size_hint: .8, .4
    title: "Message"
    title_size: root.height *.05
    auto_dismiss: False

    BoxLayout: # this is indented to be inside CalcPopUp
        orientation: 'horizontal'
            ... # etc., no changes other than indentation...

I've changed the .py file structure quite a bit, take a look and tell me if there's anything I need to make explain:

from kivy.properties import ObjectProperty
from kivy.uix.boxlayout import BoxLayout
from kivy.uix.popup import Popup
from kivy.base import runTouchApp
from kivy.base import Builder


class CalcRoot(BoxLayout):
    def __init__(self, **kwargs):
        super(CalcRoot, self).__init__(**kwargs)

    def nextScreen(self, next_screen):
        # I have some conditions inside this function which works fine
        popup = CalcPopUp("Incorrect Login", True)
        popup.open()


class CalcPopUp(Popup):
    popup_message = ObjectProperty()
    popup_button = ObjectProperty()

    def __init__(self, app_message, with_button=True, **kwargs):
        super().__init__(**kwargs)

        # if user selected the button attribute as true show button else remove
        if with_button:
            if self.popup_button in self.content.children:
                self.content.remove_widget(self.popup_button)
            # if answer is wrong, display button if not visible
        else:
            if self.popup_button not in self.content.children:
                self.content.add_widget(self.popup_button)

        # display text message
        self.ids.popup_message.text = app_message


Builder.load_file("calcpopup.kv")
root = CalcRoot()
root.nextScreen(next_screen=None)
runTouchApp(root)